Come funziona Open Design — l'architettura auto-ospitabile con "porta la tua chiave"

Questa guida è per chi vuole capire cosa sta davvero eseguendo: come funziona Open Design sotto il cofano, perché può essere auto-ospitato e BYOK a ogni livello, e perché le sue skill e i suoi design system sono semplici file che puoi forkare. Segue la presentazione orientata all'architettura che AI Stack Engineer offre nel suo video completo, riscritta e aggiornata alla release attuale. Guarda il video qui sopra per la prova dal vivo, oppure prosegui con la versione scritta.

L'hub dei plugin: esplora il registro, importa i plugin e preparali per il tuo team.

Che cos'è Open Design?

Open Design è un sostituto completamente open source di uno strumento di design in cloud: local-first, distribuibile sul web e BYOK a ogni livello. "BYOK" significa porta la tua chiave (bring your own key). Invece di includere un proprio modello o agente, Open Design scansiona la tua macchina alla ricerca di qualunque CLI di sviluppo tu già abbia — Claude Code, Codex, Cursor, Gemini, OpenCode e altri — e la usa come motore. Se non ce n'è nessuna nel tuo path, c'è un fallback sull'API di Anthropic. La licenza è Apache-2.0, quindi puoi forkarlo, distribuirlo internamente e modificarlo liberamente.

Il punto su cui AI Stack Engineer torna di continuo: uno strumento di design in cloud gira solo sul modello di un unico fornitore, nel suo cloud, dietro un piano a pagamento, senza alcuna possibilità di auto-ospitarlo. Open Design ribalta tutti e tre i punti — la tua macchina, il tuo agente, la tua chiave.

Com'è costruito (la parte che vale la pena capire)

L'architettura è volutamente semplice:

• Frontend — un'app Vite + React + TypeScript.
• Backend — un daemon Node + Express con SQLite per progetti, conversazioni, messaggi e schede.
• Il daemon è l'unico processo privilegiato. Avvia la CLI che hai scelto, con la directory di lavoro impostata su una cartella per progetto sotto una directory nascosta .od.

È quest'ultimo punto a rendere Open Design qualcosa di più di una casella di chat: l'agente ottiene veri strumenti di lettura / scrittura / bash / web-fetch su un vero filesystem. Quando genera un artefatto, scrive file reali su disco che puoi aprire, modificare, versionare ed esportare — invece di restituire un blob in una finestra di chat.

Skill e design system sono semplici file

Due elementi costitutivi svolgono la maggior parte del lavoro, ed entrambi sono semplici file che ti appartengono:

• Le skill coprono superfici concrete — prototipo web, landing SaaS, dashboard, pagina prezzi, docs, blog, app mobile, presentazioni (inclusa una skill per PPT in stile rivista) — più modelli di deliverable come specifiche PM, aggiornamenti settimanali, verbali di riunione, runbook, report finanziari, fatture, board Kanban e OKR. Ognuna è un file che puoi leggere, modificare o ampliare.
• I design system sono salvati come file DESIGN.md in markdown puro. Ognuno definisce colore, tipografia, spaziatura, layout, componenti, movimento, tono, regole di brand e anti-pattern, tratti da brand reali.

L'area di lavoro di Open Design: descrivi ciò che vuoi creare, scegli una modalità e il tuo agente fa il resto.

Poiché entrambi sono file, l'intero flusso di design diventa versionabile e forkabile — un team può tenere la propria skill interna e il proprio DESIGN.md di brand in git e far generare qualunque agente a partire da essi.

Installare e auto-ospitare

git clone https://github.com/nexu-io/open-design.git
cd open-design
corepack enable && pnpm install   # questo scarica molte dipendenze — dagli un minuto
pnpm tools-dev run web

Apri l'URL locale che stampa (una porta dinamica — non fissarla nel codice). Preferisci zero configurazione? L'app desktop su open-design.ai/download salta Node e pnpm. Al primo avvio scansiona il tuo PATH ed elenca gli agenti trovati; scegline uno (AI Stack Engineer prova il percorso non-Claude con OpenCode), oppure usa l'opzione BYOK di Anthropic.

Due accorgimenti intelligenti nello stack dei prompt che vale la pena conoscere: un modulo di scoperta (chiede di superficie, pubblico, tono, brand e scala prima di scrivere — 30 secondi di pulsanti di opzione risparmiano 30 minuti di correzioni di rotta) e un selettore di direzione (cinque direzioni visive curate con palette deterministiche, così il modello non improvvisa l'atmosfera).

Modalità presentazione: scegli una categoria di presentazione e fai il fork di un esempio come punto di partenza.

Quando hai finito, esporta in HTML, PDF o ZIP — oppure distribuisci. Dato che è distribuibile sul web e local-first, niente deve toccare il cloud di terzi.

Il verdetto onesto

AI Stack Engineer è equilibrato: uno strumento cloud rifinito e calibrato su un modello di punta vince ancora sulla cura pronta all'uso e sull'ampiezza dell'esportazione. Open Design vince sulle cose che contano per molte persone — è gratuito e Apache-2.0, porti il tuo agente e la tua chiave, e la flessibilità di modello è un superpotere silenzioso: se un fornitore alza i prezzi, o vuoi confrontare come due modelli gestiscono un layout, cambi agente nel menu a tendina e riesegui. Qualche nota onesta: è in una fase iniziale di research preview; Claude Code ottiene lo streaming più ricco (stream-JSON strutturato) mentre le altre CLI sono bufferizzate per riga; la qualità dell'output dipende molto dal modello a cui punti; e alcune funzioni, come le modifiche chirurgiche in modalità commento, sono ancora nella roadmap.

Consigli

• Capisci la cartella di progetto .od — i tuoi artefatti lì sono file reali; fanne il backup / committali.
• Tieni skill e DESIGN.md in git per un flusso versionato e condivisibile in team.
• Usa una CLI locale così la generazione si appoggia a un abbonamento che già paghi.
• Scegli il motore con intenzione — un modello debole, anche con un ottimo design system, produce comunque output debole.
• Auto-ospita / distribuisci quando ti servono privacy o controllo — niente deve lasciare la tua macchina.

FAQ

Cosa significa "BYOK a ogni livello"? Porti la tua CLI di agente e la tua chiave di modello. Open Design fornisce la superficie di design, le skill e i design system; il modello e il suo costo restano dalla tua parte.

Dove vive davvero il mio lavoro? Sulla tua macchina, in una cartella per progetto sotto .od, gestita dal daemon locale (SQLite + file reali). È auto-ospitabile e distribuibile sul web.

Posso personalizzare le skill e i design system? Sì — sono semplici file (le skill come cartelle, i design system come DESIGN.md). Modificali, aggiungi i tuoi e tienili sotto controllo di versione.

È gratuito? L'app è open source sotto Apache-2.0 e gratuita da eseguire in locale. Paghi solo per l'uso di modello dell'agente e della chiave che colleghi.

---

Questa guida scritta si basa sulla presentazione completa di AI Stack Engineer. Guarda il video completo qui sopra e iscriviti ad AI Stack Engineer per altre analisi pratiche di stack di IA.