En designassistent som körs på din enhet - inget konto, ingen server

Premissen

De flesta AI designverktyg skickar din prompt till en server, kör en stor modell och skicka kod tillbaka. Det behöver ett konto, en nätverksrundtur och lita på att ditt arbete-in-progress överför någon annans infrastruktur.

Vi ville veta hur långt den andra extremen går: ** en designassistent där modellen körs på din egen maskin. Inget konto. Ingen uppladdning. Prompten lämnar aldrig webbläsaren. Detta är nu live i PinePaper redaktör som en experimentell **AI / Kod → Assistent ** flik, och detta inlägg är en ärlig redogörelse för hur det fungerar och där det faller kort.

Varför inte bara fråga modellen för kod?

Det uppenbara tillvägagångssättet är att be modellen på nätet att skriva JavaScript mot PinePaper API och köra den. Vi försökte det. Det misslyckas dåligt.

Små modeller - de som passar på en bärbar dator - har ** ingen kunskap om en specifik apps API. ** Fråga en 0,5-2B-modell för att ringa PinePaper.create() och det improviserar: en nyckel som metoden inte läser (en SVG-stil fill där API förväntar sig color), en metod som den föreställde sig, argument i fel form. Utgången * ser * som kod och tyst gör fel sak.

Vi ber inte om kod. Vi ber om en ** begränsad lista över verktygssamtal:*

[
  { "name": "pinepaper_set_background_color", "arguments": { "color": "#0F0F1A" } },
  { "name": "pinepaper_create_item", "arguments": { "itemType": "star", "x": 400, "y": 300, "radius": 90, "color": "#E74C3C", "animationType": "pulse" } }
]

Samma ordförråd PinePaper [MCP-server] (/api/guides/mcp-integration) exponerar för externa agenter - men avges av en modell som körs lokalt och utförs på duken genom en liten avsändare.

Gör ogiltig utgång omöjlig

Nyckelrörelsen är ** begränsad avkodning. ** Istället för att hoppas att modellen producerar en giltig form, vi begränsar * vad tokens det till och med tillåts att avge: *

• På Chromes inbyggda Prompt API (Gemini Nano) passerar vi en JSON Schema som svarsbegränsning. Modellen kan bara producera objekt schemat tillåter - med additionalProperties: false, något argument som schemat inte definierar är bokstavligen orepresenterbart.
• På ** WebLLM** (en öppen modell som körs på WebGPU), vi Bifoga en **EBNF-grammatik ** via XGrammar. Grammatiken dikterar strukturen; modellen fyller endast i värdena.

Båda producerar samma verktygslåda form. Ett litet reparationspass bär sedan de nästan missar en liten modell gör fortfarande - en droppe name, argument utan deras omslag - genom att dra slutsatsen verktyget från argumentformen. Resultatet är att "rita en grön pentagon" blir ett riktigt create_item-samtal istället för ett fel.

Två leverantörer, ett avtal

On-device AI är inte en sak - det beror på webbläsaren:

• Browser AI - Chromes inbyggda Gemini Nano (window.LanguageModel). Modellen fartyg med webbläsaren; det finns inget att ladda ner från oss. Detta är den mest tillförlitliga på-enhet väg idag, eftersom JSON-schema begränsningar är billigt och väl stöds.
• PinePaper AI******* kör en Qwen2.5-modell i någon WebGPU-webbläsare. Den laddar ner en modell en gång (cachad därefter), sedan går offline.
• ** språk* - icke-engelska prompts översätts till engelska på-enhet först (via webbläsarens inbyggda översättare), eftersom de små kod-orienterade modellerna är engelsk-centrerade. Den genererade scenen är densamma oavsett snabbspråk.

Användaren plockar motorn; allt nedströms - begränsningen, exekutören, duken - är identisk.

Redigering, inte bara generera

En one-shot generator är inte en assistent. För att stödja "göra stjärnan röd" behöver modellen veta vad som redan finns på duken. Så varje tur matar vi det en kompakt ögonblicksbild av de aktuella objekten - deras id, typer och färger - precis som en server-side chatt skulle. "Gör stjärnan röd" löser sedan till en riktig modify_item-anrop mot objektets id. (Och eftersom en liten modell ibland hänvisar till "cirkel" när det betyder stjärnan, beslutar exekutören fuzzy referenser mot levande duk.)

Konversationsloggen hålls ** på din enhet** i lokal lagring. Ingenting om det skickas någonstans - om du inte uttryckligen väljer att dela misslyckade prompts, vilket hjälper oss att förbättra prompt och grammatik.

När den lilla modellen inte räcker - eskalera

Här är den ärliga delen: a 0,5-2B-modellen är den svagaste nivån. Begränsad avkodning garanterar * giltig struktur*, men modellen måste fortfarande välja rätt verktyg och förnuftiga värden, och det kommer inte alltid. Be om en pentagon och en underspecificerad modell ger dig en hexagon; fråga två gånger för "röd" och det kan köra en generator istället.

Så arkitekturen behandlar på-enhet som första * nivå, inte den enda. Efter några misslyckade försök erbjuder assistenten att ** hantera hela konversationen Till Cloud-modellen – samma avsikt, samma duk, en mycket mer kapabel modell – och du fortsätter exakt där du slutade. Låg trohet, fri och privat, med en klickbana till hög trohet när du behöver det.

Vad vi har lärt oss

• Begränsningar slår omgående.*** En jordad systemprompt hjälper; en grammatik / schema som gör ogiltig produktion omöjlig hjälper mycket mer. Den enskilt största tillförlitlighet hoppet kom från begränsad avkodning, inte från en bättre snabb.
• Modellstorlek dominerar fortfarande.* Att gå från en 0,5B till en 1,5B-modell förbättrade märkbart hur ofta assistenten väljer rätt verktyg. Det finns ingen prompt som förvandlar en liten modell till en smart.
• ** Den fulla grammatiken kan vara för stor.** Vår första grammatik kodade *every * möjlig drift - inklusive en gränsad längd flykt kläck för godtycklig ritning kod. Det var så stort att begränsad avkodning stannade sidan. En kompakt grammatik som täcker den gemensamma verksamheten är rätt standard; den fullständiga ytan är opt-in.
• ** Kör den från huvudtråden.**** En modell som gör slutsats på UI-tråden fryser sidan. WebLLM körs i en webbarbetare så redaktören förblir lyhörd medan en modell laddas och genererar.

Vad är nästa

Detta är experimentellt och förbättrat. På färdplanen:

• ** Översätt verktygstäckning i den begränsade vägen* - mer av PinePaper: s verksamhet expressible utan freeform escape hatch.
• Larger on-device modeller som WebGPU modell kataloger växer, handel nedladdning storlek för tillförlitlighet.
• En tätare utvärderingsloop – med hjälp av opted-in misslyckande rapporter för att mäta vilka uppmanar att resa på-enhet modeller och härda grammatiken mot dem.
• *En mjukare on-device → Cloud handoff, så eskalering känns som att vrida upp kvalitetsring snarare än att byta verktyg.

The throughline: samma deklarativa verktyg ordförråd driver en modell på vardera sidan av webbläsarens gräns. En extern agent kallar dessa verktyg över MCP; en enhetsmodell kallar samma former lokalt. Ett kontrakt, agenter var de än kör.

Försök i redaktören - öppen **AI / Kod → Assistent **. Det är gratis, körs på din enhet och behöver inget konto. *