Prototipi UI: la claude skill che crea mockup cliccabili con dati reali.

Cosa risolve.

Hai un'idea di prodotto. Una nuova app per pianificare workout. Una dashboard per gestire ordini. Una chat per coordinare il team. La vuoi mostrare al cliente, al founder, all'investitore. Hai due strade tradizionali e fanno entrambe schifo.

La prima: apri Figma e disegni schermate statiche. Ore di lavoro. Il risultato sembra un poster. Il cliente non capisce dove cliccare, le interazioni sono in testa tua, i dati sono "Mario Rossi" e "lorem ipsum". Tutto urla "non esiste ancora". La seconda: assumi uno sviluppatore per due settimane di MVP. Migliaia di euro, due settimane di feedback in ritardo.

Prototipi UI è la terza via. Apri Claude Code, descrivi l'idea in italiano — "dashboard per gestione clienti palestra, vista lista + dettaglio + form aggiungi", la skill ti restituisce un prototipo HTML/JS funzionante, con dati realistici di palestra italiana (nomi veri, indirizzi credibili, abbonamenti coerenti), micro-interazioni, hover states, mobile responsive, dark mode. Carichi su Vercel/Netlify (o lo apri locale), condividi il link. Il cliente clicca, naviga, capisce.

Cosa c'è dentro.

Per chi è.

• Product manager che testano ipotesi di prodotto e hanno bisogno di feedback su flussi reali, non su Figma.
• Designer che fanno pitch al cliente e vogliono mostrare l'idea, non venderla a parole.
• Founder pre-MVP che validano il concept con potenziali utenti prima di assumere uno sviluppatore.
• Consulenti che mostrano capability ai clienti durante una proposta: ecco come potrebbe essere la dashboard, prova.
• Team interni che decidono se costruire una feature: meglio prototipare in mezza giornata che discuterla per due settimane.

Come si installa.

1. Scarichi Claude Code (gratuito, Mac o Windows) da claude.com/product/claude-code.
2. Acquisti Prototipi UI, ricevi via email il file .zip.
3. Apri Claude Code → Impostazioni → Funzionalità → Competenze → Personalizza → Carica skill → selezioni il .zip.
4. Crei la cartella del progetto, opzionalmente metti un PROFILE.md col brand del cliente (lo genera la skill Brand Voice Extractor gratuita).
5. Descrivi l'idea a Claude in italiano. Prototipi UI fa il resto.

Tre minuti la prima volta. Da quel momento ogni idea diventa un prototipo cliccabile in 20-40 minuti.

Domande frequenti.

Posso esportare il prototipo in Figma?

Non direttamente. Prototipi UI genera codice HTML/JS, non file .fig. Il vantaggio: è un prototipo vero, navigabile, non un'illustrazione statica. Se ti serve la fase Figma successiva, lo fai a partire dai flussi già validati col prototipo.

Include user flow e mappa schermate?

Sì. La skill genera un FLOW.md con la mappa dei percorsi utente (entry point, schermate intermedie, exit), utile per documentazione e handoff a sviluppo.

Posso condividere un link pubblico?

Sì. Output statico (HTML/CSS/JS): lo carichi su Vercel, Netlify, GitHub Pages o qualsiasi hosting in 2 minuti. La skill include un comando per deploy diretto su Vercel se hai la CLI installata.

I clienti possono lasciare commenti sul prototipo?

Sì, opzionale. La skill può includere un widget di feedback minimal (commento + screenshot + email mittente) che raccoglie tutto in un endpoint serverless o webhook Notion/Slack.

È mobile o solo desktop?

Entrambi. Tutti gli archetipi sono responsive: testano bene da iPhone e desktop. Per test utente mobile-first, la skill genera direttamente layout mobile-prima e desktop come adattamento.

Altre skill compatibili.