1.Come lo uso io
Le pagine e le piattaforme che costruisco con Claude Code passano tutte dalle stesse tre skill. Una toglie quell'aria da «fatto con l'AI» che rende tutti i siti uguali. Una mi dà stili, palette e caratteri già ragionati, così il design parte bene invece di partire generico. La terza mi fa creare le skill mie, perché le migliori che uso non le ho trovate online: le ho scritte sul mio modo di lavorare. Sotto c'è una libreria che non è una skill ma cambia tutto: i file DESIGN.md dei brand, da dare in pasto all'AI come riferimento.
2.Cosa ti serve
Claude Code
Installato e collegato al tuo account (Pro o Max). Come si fa è in fondo alla guida.
Node.js
Serve per i comandi npx. Nel Terminale scrivi npx --version: se non risponde, scaricalo da nodejs.org (versione LTS).
Python 3
Lo usa UI/UX Pro Max per le sue ricerche. Scrivi python3 --version: su Mac c'è quasi sempre; su Windows si scarica da python.org.
Un progetto
Una landing, un sito, un'app che stai costruendo con Claude Code. Anche appena iniziata.
3.Come funziona
Una skill è un insieme di istruzioni che Claude Code carica quando serve: le regole di un mestiere, scritte una volta. Le skill di design contengono gusto e regole (spaziature, tipografia, contrasto, movimento) che l'AI da sola applica a caso. Un DESIGN.md è un'altra cosa: la descrizione dello stile di un brand vero, colori, caratteri, ritmo, da usare come riferimento.
- 1
RIFERIMENTO
un DESIGN.md nella radice del progetto: «assomiglia a questo»
- 2
COSTRUZIONE
UI/UX Pro Max sceglie stile, palette e caratteri mentre Claude costruisce
- 3
RIFINITURA
impeccable rivede la pagina e toglie i difetti tipici dell'AI
- 4
REGOLE TUE
skill-creator trasforma le tue correzioni ricorrenti in una skill
«Fammi una landing»: esce la solita pagina con il titolo enorme, tre card uguali, un gradiente viola. Corretta, dimenticabile.
Parte da uno stile scelto, con regole di spaziatura e tipografia, e finisce con una revisione che trova i difetti prima di te.
Qui comincia la parte pratica.
Dimmi chi sei e la guida si apre tutta: i passi, gli errori tipici e il file per la tua AI. Le risorse nuove te le mando per email; il telefono serve per sentirci a voce, se ha senso.
Gratis. Lo compili una volta: le altre guide restano aperte su questo dispositivo.
Cosa trovi dopo
- 4Passo 1 · impeccable
- 5Passo 2 · UI/UX Pro Max
- 6Passo 3 · skill-creator
- 7Passo 4 · La libreria dei DESIGN.md
- 8In che ordine
- 9Se ti esce così
- 10Prima di costruire davvero
- 11Ora tocca a te
- 12Il prossimo passo
Non leggerla soltanto: falla applicare.
Questa guida esiste anche come file Markdown, il formato che le AI leggono meglio. In testa ha già le istruzioni: lo dai a Claude Code (o lo alleghi a Claude, a ChatGPT) e l'AI la applica al tuo caso, chiedendoti i dati che le servono. Niente da riscrivere, niente da spiegare.
Cosa ottieni: Le tre skill installate nel tuo progetto, un DESIGN.md di riferimento nella radice e una prima revisione della tua pagina fatta con impeccable.
Gratis. Ti chiedo chi sei e come trovarti: le risorse nuove arrivano per email. Come si installa.
Installala nella tua AI
Il file che scarichi non è un riassunto: è la guida intera più le istruzioni per l'AI, scritte in testa. Tu lo consegni, lei lo legge, ti fa le domande e produce il risultato. Qui: Le tre skill installate nel tuo progetto, un DESIGN.md di riferimento nella radice e una prima revisione della tua pagina fatta con impeccable.
Con Claude Code
ConsigliatoClaude Code lavora dentro una cartella del tuo computer: legge il file, scrive i risultati lì e li ritrovi la prossima volta. Serve un account Claude con piano Pro o Max (non è nel piano gratuito).
- 1Installa Claude Code, una volta sola. Apri il Terminale (su Mac: cerca «Terminale» con Spotlight; su Windows: «PowerShell») e incolla il comando. Al primo avvio si apre il browser per entrare con il tuo account Claude.
ComandoMac curl -fsSL https://claude.ai/install.sh | bash
ComandoWindows (PowerShell) irm https://claude.ai/install.ps1 | iex
- 2Scarica il file dal riquadro «Per la tua AI» e mettilo in una cartella: quella del lavoro a cui vuoi applicarlo, o una nuova (per esempio
guide-ai). - 3Apri il Terminale in quella cartella. Il modo più semplice: scrivi
cd, uno spazio, trascina la cartella dentro la finestra del Terminale e premi Invio. - 4Avvia Claude Code scrivendo
claudee premendo Invio. Poi incolla il comando della guida e rispondi alle domande, una alla volta.Terminalecosì, per esempio $ claude > Leggi il file guida-skill-design-claude-code.md e segui le istruzioni scritte all'inizio. Ho letto la guida. Prima domanda, una alla volta: qual è la richiesta che rifai più spesso?
Su claude.ai, senza installare niente
Apri una chat nuova su claude.ai, allega il file con la graffetta e scrivi la frase qui sotto. Se usi i Progetti, aggiungi il file ai contenuti del progetto: resta a disposizione in ogni chat.
Leggi le istruzioni all'inizio del file allegato e seguile.Con ChatGPT o un'altra AI
Allega il file alla chat e scrivi la stessa frase. Le istruzioni sono pensate per Claude Code: dove parlano di cartelle e comandi, l'AI ti darà il testo da copiare al posto di scriverlo lei sul tuo computer.
Vale per qualunque assistente che legge i file allegati.
Continua con
Vuoi che un sistema così lo costruiamo insieme nella tua azienda? Prenota la call conoscitiva: 30 minuti, senza impegno.
