En designassistent, der kører på din enhed - Ingen konto, ingen server

Forudsætningen

De fleste AI designværktøjer sende din prompt til en server, køre en stor model, og sende kode tilbage. Det har brug for en konto, et netværk rundtur, og tillid til, at dit arbejde-i-fremskridt transmitterer en andens infrastruktur.

Vi ønskede at vide, hvor langt den anden ekstreme går: * * en design assistent, hvor modellen kører på din egen maskine. * * Ingen konto. Ingen upload. Hurtig forlader aldrig browseren. Dette er nu live i PinePaper 's redaktør som en eksperimentel * * AI / Code → Assistant * * tab, og dette indlæg er en ærlig redegørelse for, hvordan det fungerer, og hvor det er kort.

Hvorfor ikke bare bede modellen om kode?

Den indlysende tilgang er at bede on- enhed model til at skrive JavaScript mod PinePaper "s API og køre det. Vi prøvede det. Det går dårligt.

Små modeller - dem, der passer på en bærbar computer - har * * ingen viden om en bestemt app 's API. * * Spørg en 0.5- 2B model til at ringe til PinePaper.create(), og det improviserer: en nøgle metoden ikke læse (en SVG- stil fill, hvor API forventer color), en metode, det forestillede sig, argumenter i den forkerte form. Output * ligner kode og gør det forkerte.

Så vi beder ikke om kode. Vi beder om en * * begrænset liste over værktøjskald: * *

[
  { "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" } }
]

Det samme ordforråd PinePaper "s [MCP server] (/api/guides/mcp-integration) udsætter eksterne agenter - men udsendt af en model kører lokalt, og udføres på lærredet gennem en lille sender.

Ugyldiggørelse af output

Det vigtigste træk er * * begrænset afkodning. * * I stedet for at håbe at modellen producerer en gyldig form, begrænser vi * hvad tokens det er endda tilladt at udsende: *

• På Chrome 's build- in * * Prompt API * * (Gemini Nano), passerer vi en * * JSON Schema * * som en svarbegrænsning. Modellen kan kun producere objekter skemaet tillader - med additionalProperties: false, ethvert argument skemaet ikke definerer er bogstaveligt talt ikke representable.
• På * * WebLLM * * (en åben model kører på WebGPU), vi Vedlæg en * * EGFF grammatik * * via XGrammar. grammatikken dikterer strukturen; modellen udfylder kun værdierne.

Begge producerer den samme værktøjs- call form. En lille reparation pass derefter bjærger nær- savner en lille model stadig gør - en droppet name, argumenter uden deres wrapper - ved at udlede værktøjet fra argumentet form. Resultatet er, at "tegne en grøn pentagon" bliver en reel create_item opkald i stedet for en fejl.

To udbydere, en kontrakt

On- enhed AI er ikke én ting - det afhænger af browseren:

• • • Browser AI * * - Chrome 's build- in * * Gemini Nano * * (window.LanguageModel). Modellen skibe med browseren; der er intet at hente fra os. Dette er den mest pålidelige on- enhed sti i dag, fordi JSON- schema begrænsning er billig og velunderstøttet.
• • • PinePaper AI * * - * * WebLLM * * kører en Qwen2.5 model i enhver WebGPU browser. Det downloader en model én gang (cachet derefter), derefter kører offline.
• • • Sprog * * - ikke-engelsk prompts er oversat til engelsk on- enhed først (via browserens build-in oversætter), fordi de små code- orienterede modeller er engelsk- centrisk. Den genererede scene er den samme uanset hurtig sprog.

Brugeren vælger motoren; alt nedstrøms - begrænsningen, eksekutoren, lærredet - er identisk.

Redigering, ikke bare generering

En generator er ikke assistent. For at støtte "gøre stjernen rød", modellen skal vide, hvad der allerede er på lærredet. Så hver tur vi fodre det et kompakt snapshot af de nuværende elementer - deres id, typer og farver - præcis som en serverside chat ville. "Gøre stjernen rød" derefter løser til en reel modify_item opkald mod emnets id. (Og fordi en lille model undertiden refererer til "den _ cirkel", når det betyder stjernen, eksekutoren løser fuzzy referencer mod levende lærred.)

Samtaleloggen opbevares * * på din enhed * * i lokal opbevaring. Intet om det sendes hvor som helst - medmindre du udtrykkeligt vælge at dele mislykkedes prompts, som hjælper os med at forbedre de prompts og grammatik.

Når den lille model ikke er nok - eskalere

Her er den ærlige del: * * en 0.5-2B model er den svageste tier. * * Begrænset afkodning garanterer * gyldig struktur *, men modellen skal stadig vælge det rigtige værktøj og fornuftige værdier, og det vil ikke altid. Bed om en pentagon og en underspecificeret model giver dig en sekskant; spørg to gange om "rød" og det kan køre en generator i stedet.

Så arkitekturen behandler on- enhed som * første * niveau, ikke den eneste. Efter et par mislykkede forsøg den assistent tilbyder at * * hånd hele samtalen op til Cloud model * * - samme hensigt, samme lærred, en langt mere kompetent model - og du fortsætter præcis, hvor du slap. Lav troskab, gratis og privat, med en one-klik sti til høj troskab, når du har brug for det.

Hvad vi har lært

• • • Restriktioner beat prompting. * * En jordbaseret system prompt hjælper; en grammatik / skema, der gør ugyldig output umuligt hjælper langt mere. Den største pålidelighed spring kom fra begrænset dekodning, ikke fra en bedre prompt.
• • • Modelstørrelse dominerer stadig. * * Går fra en 0.5B til en 1.5B model mærkbart forbedret, hvor ofte assistenten vælger det rigtige værktøj. Der er ingen prompt, der gør en lille model til en klog.
• Den fulde grammatik kan være for stor. Vores første grammatik kodet * hver * mulig operation - herunder en hoppe-længde flugt luge for vilkårlig tegning kode. Det var så stort, at begrænset afkodning standsede siden. En kompakt grammatik, der dækker de fælles operationer er den rigtige standard; den fulde overflade er opt- in.
• • • Kør det fra hovedtråden. * * En model, der gør inferens på UI tråden fryser siden. WebLLM kører i en Web Worker, så redaktøren forbliver lydhør, mens en model indlæser og genererer.

Hvad så nu

Dette er eksperimentelt og forbedret. På køreplanen:

• • • Større redskabsdækning i den begrænsede sti * * - mere af PinePaper 's operationer kan udtrykkes uden freeform flugt luge.
• • • Større on- enhed modeller * * som WebGPU model kataloger vokse, handel download størrelse for pålidelighed.
• • • En strammere evaluering loop * * - ved hjælp af opted- in fiasko rapporter til at måle, som tilskynder trip on-device modeller og hærde grammatik mod dem.
• • • En glattere on- enhed → Cloud tømmermænd * *, så eskalering føles som at skrue op for kvalitet dial snarere end at skifte værktøj.

Gennemløb: det samme deklarative værktøj ordforråd driver en model på begge sider af browsergrænsen. En ekstern agent kalder disse værktøjer over MCP; en on-device model kalder de samme former lokalt. En kontrakt, agenter, hvor de end løber.

• Prøv det i editoren - åben * * AI / Code → Assistent * *. Det er gratis, kører på din enhed, og behøver ingen konto. *