Documenti on-brand con Claude Design: come crearli una volta e condividerli col team

Sarà capitato anche a te: finisce la revisione del brand, ti consegnano magnifici PDF, i loghi SVG e le linee guida per l'uso. Materiale ottimo. Sta poi a te trasformare tutto questo in template utili per la tua impresa e renderli fruibili al team.

Perché l'identità non vive nel manuale del brand: vive nell'offerta che mandi al cliente e nel contratto che gli fai firmare.

La generazione dei nostri documenti si era già evoluta passando dai classici template Word e Google Doc ad un piccolo script custom creato da noi — IA per sistemare le note in Markdown, trasformarle in HTML e Playwright per creare il PDF, risultato un link scaricabile comodo per essere usato ovunque, in locale o da un agente nel cloud.

Funziona, lo usiamo ancora oggi per le note di meeting e i follow-up.

Il limite principale è che non è flessibile nella forma: si aggiorna solo modificandone il codice sorgente. Per offerte e contratti non bastava più, si fanno spesso aggiustamenti, modifiche, personalizzazioni che necessitano la flessibilità del documento Word combinata ad un design ripetibile.

Il passo successivo era rifare tutto da capo: dal codice a un plugin per IA. Ho insegnato il brand a Claude una volta sola, ne ho fatto uno strumento e l'ho dato al mio team.

Tre elementi: un design system in Claude Design, una skill che genera i documenti, un plugin per distribuirla. Vado in ordine.

Cos'è Claude Design

Claude Design è lo strumento di design di Claude, ancora in beta. Lo apri da web su claude.ai/design o dalla sidebar dell'app desktop. Nella schermata iniziale scegli cosa creare: Slides, Product prototype, Product wireframe, Document, Animation, o parti da un file.

Mettiamo subito un paletto: non è Lovable, Bolt o v0, quelli che ti sputano fuori un'app funzionante in un colpo. Claude Design fa design — estetica, layout, identità visiva — non codice. Se poi serve software vero, passa la mano a Claude Code. Per i miei documenti non mi serviva un'app. Mi serviva che fossero giusti.

Passo 1 — Il design system: dove si gioca tutto

Da dove si parte?

Il pezzo che conta è il design system — il linguaggio visivo del brand: colori, tipografie, spaziature, componenti, loghi. È la differenza tra un documento che è tuo e l'ennesima cosa generica uscita da un'IA. Una volta che esiste, ogni cosa che generi nasce già dentro la tua identità.

In Claude Design lo crei da "Add a design system". Hai tre strade, scegli in base a cosa hai in mano:

• Create here — connetti Figma o GitHub, o carichi slide e asset.
• Create using Claude Code — massima fedeltà se il brand esiste già come componenti React sul tuo computer.
• Add fonts, logos and assets — trascini font, loghi e i documenti che descrivono il brand.

Claude Design offre diverse opzioni per partire: l'URL del tuo sito già aggiornato, un .fig di Figma, un repo GitHub col brand dentro. Io avevo i PDF e i loghi dell'agenzia, quindi ho usato "Add fonts, logos and assets" e gli ho dato in pasto tutto il materiale — più l'indirizzo del mio sito, che avevo già rifatto col brand nuovo, così aveva anche font e colori "in produzione" da cui pescare.

Poi lo lasci lavorare — e qui ci vuole pazienza vera. Oltre la mezz'ora, spesso. Non è istantaneo perché sta costruendo il sistema sul serio: palette, scale tipografiche, spaziature, componenti.

Alla fine te lo ritrovi pronto e selezionabile in cima a ogni progetto — nel mio caso l'Arkad Design System. Da lì in poi ogni design parte già nel brand giusto.

Passo 2 — I modelli di documento

Il design system è pronto. Cosa genero adesso?

I modelli che uso davvero: offerta, contratto e gli altri documenti formali che finiscono in mano al cliente. Niente catalogo teorico — quelli che apri ogni settimana.

Escono già coerenti tra loro perché nascono dallo stesso linguaggio. I documenti rapidi e i follow-up li ho lasciati sul generatore di prima: lì il flusso Markdown→PDF va benissimo, l'eleganza serve dove il cliente firma.

Quando sono stato soddisfatto, ho esportato il pacchetto in .zip: modelli e design system insieme. Quel file è il mattone per tutto il resto.

Passo 3 — Dal pacchetto alla skill: prima testa su roba vera

Ora è il momento di dare a Claude il file .zip per creare la Skill — le istruzioni più i template che gli dicono come produrre un documento Arkad. Per questo va bene sia Claude Code sia Cowork. Ho iniziato da Cowork, perché volevo provarlo subito su un mio file vero, con dati reali, non su un esempio finto.

Il primo giro era buono. Non perfetto: un paio di dettagli da raddrizzare, un paio di regole da scrivere nero su bianco invece di darle per scontate. Io sono fissato col testo giustificato e le righe ben allineate nei documenti — e quel genere di cose un'IA non le indovina, gliele devi imporre per iscritto.

Ho corretto la skill, ho rifatto il test, ho iterato finché l'output non era quello che avrei mandato a un cliente. Solo allora l'ho congelata.

Testare su un caso reale prima di bloccare la skill ti permette di correggere le imprecisioni prima di usarla sul serio.

Passo 4 — Da skill a plugin: il perché, in breve

Skill a posto, sono passato a Claude Code per farne un plugin.

Perché un plugin e non lasciarla una skill?

La distribuibilità — è il motivo numero uno.

Una skill la puoi condividere: mandi i file a un collega del team, gli spieghi dove metterli. Funziona. Un plugin è più comodo: lo pubblichi una volta e chiunque lo installa con un comando, sul proprio computer. Una volta installato è disponibile in ogni conversazione — non solo quando hai aperto la cartella giusta.

Un plugin è una cartella autosufficiente con una struttura precisa:

arkad-documents/
├── .claude-plugin/
│   └── plugin.json        # manifesto: nome, versione, descrizione
├── skills/
│   └── arkad-documents/
│       ├── SKILL.md        # quando attivarsi + come generare il documento
│       └── assets/         # template HTML + Arkad Design System
└── README.md

Il cuore è plugin.json, e può essere minimo così:

{
  "name": "arkad-documents",
  "version": "0.1.0",
  "description": "Genera documenti Arkad (offerta, contratto, audit, NDA) nel brand ufficiale",
  "author": { "name": "Arkad Consulting" }
}

Passo 5 — Il marketplace

Un plugin installato sul mio portatile risolve il mio problema. Ma i documenti li fa anche il mio team, e se da loro esce qualcosa di diverso siamo daccapo.

Per distribuire lo stesso plugin a tutto il team, con aggiornamenti centralizzati, serve un marketplace: un catalogo che elenca i tuoi plugin e dice dove trovarli. Ne ho fatto uno privato per Arkad — in pratica un repo GitHub con un file marketplace.json:

{
  "name": "arkad",
  "owner": { "name": "Arkad Consulting" },
  "plugins": [
    {
      "name": "arkad-documents",
      "source": "./plugins/arkad-documents",
      "description": "Documenti Arkad nel brand ufficiale"
    }
  ]
}

Da qui condividere è semplice. In Claude Code è questione di due righe — un membro del team registra il marketplace una volta:

/plugin marketplace add Arkad-Agency/arkad-marketplace

e installa il plugin:

/plugin install arkad-documents@arkad

Fatto. Ora ognuno genera offerte, contratti e gli altri documenti formali identici ai miei, nello stesso brand, senza che io spedisca file o spieghi qual è la versione buona. Quando miglioro qualcosa — un colore, una sezione, un nuovo tipo di documento — aggiorno il repo e al refresh successivo ce l'hanno tutti. Un repo privato basta: serve solo a noi.

Una trappola da sapere: Cowork e Claude Code sono ambienti separati

Qui c'è un dettaglio che fa perdere tempo se non lo sai. Un plugin installato in Cowork non è installato in Claude Code, e viceversa: i due ambienti hanno i loro plugin e i loro marketplace, gestiti separatamente. Non c'è travaso automatico.

E non sono solo due registrazioni separate — ogni ambiente si installa a modo suo. In Cowork tutto passa dall'interfaccia: apri Customize → Plugins e premi +. Da lì scegli una di due strade — collegare un marketplace (puntandolo allo stesso repo Arkad-Agency/arkad-marketplace) oppure caricare direttamente un file .plugin. Funzionano entrambe, ma io punto sul marketplace: quando miglioro il plugin, l'aggiornamento arriva a tutti al refresh successivo, mentre un file .plugin è un'istantanea congelata che dovresti ridistribuire a mano.

Se prendi comunque la strada del file, quel .plugin non ha niente di esotico: è uno zip della cartella del plugin, con un'estensione diversa. Dalla cartella ne impacchetti il contenuto:

cd plugins/arkad-documents && zip -r -X ../../arkad-documents.plugin . -x "*.DS_Store"

Il file arkad-documents.plugin che ottieni è quello che trascini in Cowork. Passando dal marketplace — in Cowork come in Claude Code — non lo costruisci mai: è l'installazione a mettere insieme la cartella direttamente dal repo.

In Claude Code non c'è un'interfaccia per questo — sono le stesse due righe di prima: /plugin marketplace add Arkad-Agency/arkad-marketplace e poi /plugin install arkad-documents@arkad. Lo stesso catalogo che useresti in Cowork, ma guidato dal CLI. In ogni caso va impostato una volta per ambiente: ogni membro del team lo registra dove lavora davvero — in Cowork, in Claude Code, o in entrambi.

Il punto

Per i documenti rapidi resta il vecchio generatore, aggiornato al brand nuovo: lì cambiare colori e header bastava. Il codice era già pronto e funziona — perché buttarlo.

Per offerte, contratti e report — dove l'eleganza conta e il cliente firma — ora c'è il plugin. Lo installo con un comando e il documento esce nel brand giusto, da me e da chiunque nel team.

Il salto è stato trasformare la skill in qualcosa che si installa, si versiona e si distribuisce come un normale pezzo di software interno.

Da lì la coerenza ha smesso di dipendere da chi si ricorda di aprire il template giusto.

Come lo usiamo oggi: io e il mio team scriviamo il contenuto — offerta, contratto, rapporto — in Markdown, dentro Claude o Hermes. Quando il contenuto è validato lo passiamo alla skill, che fa la finitura sul brand Arkad. Da chiunque parta, esce una struttura praticamente identica.

Il rebrand è stato solo l'occasione per montare tutto questo.