83.3K+Scarica
Vai alla guida all’uso
enhance-promptdi Google Labs

Enhance Prompt Skill.

Una skill per Claude Code e Codex dedicata al design UI: riscrive idee vaghe di interfacce in prompt raffinati e ottimizzati per Stitch.

  • Web & UI
Scarica OpenDesignGuida all'uso
google-labs-code/stitch-skills · plugins/stitch-utilities/skills/enhance-prompt/SKILL.mdSKILL.md
--- name: enhance-prompt description: Transforms vague UI ideas into polished, Stitch-optimized prompts. Enhances specificity, adds UI/UX keywords, injects design system context, and structures output for better generation results. --- ## Prerequisites ## When to Use This Skill ## Enhancement Pipeline ## Output Options ## Examples ## Tips for Best Results
Front matter e intestazioni di sezione letti dal file upstream il 14/09/2026 · 6.618 caratteri in totale

01 Cosa fa

Cosa fa la Skill enhance-prompt in Claude Code e Codex

Sintesi, workflow e output, tutto letto dal SKILL.md della skill.

Dal SKILL.mdLetto il 14-09-2026 · non è un'esecuzione registrata

Nelle parole della skill

Questa skill trasforma idee di UI grezze in prompt costruiti per la generazione con Stitch. Lavorando come Stitch Prompt Engineer, verifica l'input alla ricerca di piattaforma, tipo di pagina, struttura, stile visivo, colori e componenti mancanti, poi riscrive le formulazioni vaghe in nomi di componenti specifici, amplifica gli aggettivi legati all'atmosfera, raggruppa i contenuti in sezioni numerate e formatta ogni colore come nome, codice hex e ruolo funzionale.

Quando il progetto ha un DESIGN.md, la sua palette, la tipografia e gli stili dei componenti vengono inseriti in un blocco DESIGN SYSTEM (REQUIRED); quando non lo ha, un suggerimento indica la skill design-md. L'output è per impostazione predefinita testo copiabile, oppure un file come next-prompt.md per stitch-loop.

Che cosa produce

  • Un prompt migliorato che si apre con una descrizione in una riga dello scopo e dell'atmosfera della pagina, seguita dal blocco del design system e dalla struttura numerata della pagina.
  • Un file opzionale next-prompt.md, scritto per l'uso con la skill stitch-loop.
  • Un file opzionale con un nome personalizzato scelto dall'utente.
Vedi l'esempio di prompt ↗

Come funziona

  1. 01
    Verificare l'Input Grezzo

    La skill controlla il prompt dell'utente rispetto a sei elementi: piattaforma, tipo di pagina, struttura, stile visivo, colori e componenti.

  2. 02
    Recuperare il Design System

    Cerca un DESIGN.md nel progetto corrente e legge il blocco del design system in modo che palette, tipografia e stili dei componenti possano essere riutilizzati nel nuovo prompt.

  3. 03
    Applicare le Tecniche di Miglioramento

    I termini vaghi diventano componenti nominati, gli aggettivi vengono amplificati in un'atmosfera, i contenuti sono organizzati in sezioni numerate e i colori sono scritti con un nome descrittivo, un valore hex e un ruolo.

  4. 04
    Formattare l'Output in un Ordine Fisso

    Il risultato si apre con una descrizione in una riga dello scopo e dell'atmosfera della pagina, poi un blocco DESIGN SYSTEM (REQUIRED), poi una Struttura della Pagina numerata.

02 Trova la tua applicazione

Quando usare la skill enhance-prompt

Usa la skill enhance-prompt in Claude Code o Codex quando il lavoro riguarda UI design di questo tipo. Ambito e limiti qui sotto sono presi dal file della skill stessa.

Buona applicazione

  • Perfezionare un prompt UI prima che venga inviato a Stitch.
  • Rielaborare un prompt che ha già prodotto risultati di generazione scadenti.
  • Aggiungere coerenza del design system a un'idea semplice.
  • Trasformare un concetto vago in un prompt strutturato e operativo.

Conosci i limiti

  • Raggruppare più modifiche non correlate in un'unica richiesta di modifica è fortemente scoraggiato; le modifiche vanno gestite una alla volta.
  • Il sovradesign è un anti-pattern: quando l'utente desidera qualcosa di semplice, l'arricchimento deve restare coerente con quell'intento.

Cosa fornire

  • L'idea approssimativa o il prompt esistenteUn'idea vaga di generazione UI o un prompt che ha reso poco è il materiale di partenza che lo skill riscrive.
  • Il file DESIGN.md del progetto, se esisteViene letto dal progetto corrente in modo che la sua palette, la tipografia e gli stili dei componenti possano essere riportati nel nuovo prompt.

03 Dentro la skill

Regole che lo skill enhance-prompt fornisce a Claude Code e Codex

7 istruzioni concrete, valori predefiniti e limiti che SKILL.md definisce per l'agente — la parte del file che cambia il risultato.

  1. Consultare prima la Stitch Guide

    Prima di arricchire qualsiasi cosa, consultare la documentazione ufficiale sul prompting di Stitch, perché le sue indicazioni possono avere la precedenza sui pattern integrati in questo skill.

  2. Riformulare DESIGN.md come Blocco Obbligatorio

    Quando esiste un DESIGN.md, il suo contenuto non viene citato tale e quale; viene riformattato in una sezione intitolata DESIGN SYSTEM (REQUIRED) nell'output.

  3. Gestire il Caso di DESIGN.md Assente

    Se non è presente alcun DESIGN.md, il prompt arricchito termina con una nota che indirizza l'utente allo skill design-md per design multi-schermata coerenti.

  4. Scrivere i Colori Secondo uno Schema Fisso

    Ogni colore viene espresso come nome descrittivo, codice hex tra parentesi e ruolo funzionale che svolge, mai come semplice campione o aggettivo vago.

  5. Numerare le Sezioni della Pagina

    Il contenuto della pagina è raggruppato in sezioni numerate affinché Stitch ne legga la gerarchia, invece di lasciarlo come un paragrafo di prosa.

  6. Predefinire l'Output in Testo

    A meno che l'utente non richieda diversamente, il prompt arricchito viene restituito come testo da copiare; la scrittura di un file è opzionale.

  7. Preservare il Resto nelle Modifiche Puntuali

    Quando la richiesta è una modifica e non una nuova pagina, il prompt deve dichiarare che viene apportata solo la modifica descritta e che tutti gli elementi esistenti restano invariati.

04 Mettila al lavoro

Installa enhance-prompt in Claude Code o Codex

Un comando npx skills add, poi un primo task nel tuo agente e una checklist per il risultato.

Aggiungi enhance-prompt a Claude Code, Codex o al Tuo Agente

Eseguitelo nel Suo progetto; l'installer chiede a quale agente aggiungerlo.

Terminal
npx skills add https://github.com/google-labs-code/stitch-skills --skill enhance-prompt

Forma generica della CLI skills per plugins/stitch-utilities/skills/enhance-prompt/SKILL.md; il repository potrebbe documentare un proprio percorso.

Assegna alla skill un primo compito di progettazione UI

Adatta questo prompt con i tuoi contenuti e vincoli, poi eseguilo in Claude Code o Codex.

Example prompt
make me a login page

Fonte: esempio SKILL.md (testuale).

Verifica il primo risultato

Ciò che il SKILL.md stesso indica come risultato corretto:

  • Il prompt contiene un blocco DESIGN SYSTEM (REQUIRED) che elenca piattaforma, tema, sfondo, accento primario e testo primario in quest'ordine.
  • Ogni colore è espresso come nome descrittivo, codice hex e ruolo funzionale.
  • Il contenuto della pagina appare come sezioni numerate, ad esempio un'intestazione con la navigazione, invece che come descrizione generica.
  • Nessuna parola vaga per i componenti sopravvive; una richiesta per un pulsante diventa un pulsante di invito all'azione primario.
  • Il blocco del design system è presente in ogni caso, poiché è la coerenza che tiene insieme l'output multi-pagina.
  • Per una modifica mirata, il prompt individua posizione, stile, segnaposto, comportamento e larghezza invece di descrivere di nuovo l'intera pagina.

In OpenDesign enhance-prompt è incluso: Plugins → Skills, selezionatelo nella barra superiore.

Scarica OpenDesignLeggi il quickstart

05 Open source, tracciabile

Sorgente, licenza e verifica

Da dove provengono i dati di questa pagina e quando sono stati verificati l'ultima volta.

Author
Google Labs
Repository
github.com/google-labs-code/stitch-skills Branch main
File della skill
plugins/stitch-utilities/skills/enhance-prompt/SKILL.md Checksum del contenuto registrato alla verifica; commit 0337446
License
Apache-2.0 Da LICENSE.
Stelle del repository
8.304 Snapshot GitHub preso il 14-09-2026 per l'intero repository google-labs-code/stitch-skills, che contiene 12 skill in questo catalogo. Non è una valutazione o conteggio di utilizzo per enhance-prompt.
Verificato da OpenDesign
14 settembre 2026 Il file sorgente, il percorso, il testo della licenza e il conteggio delle stelle sono stati verificati. Incluso nella build principale di OpenDesign (verificato il 28 agosto 2026); non è stata registrata un'esecuzione live su questa pagina.

All'interno di SKILL.md

  1. PrerequisitiConsultate la guida ufficiale al prompting di Stitch prima di potenziare il prompt, poiché potrebbe sostituire questi pattern.
  2. Quando Usare Questa SkillQuattro casi: perfezionare un prompt, correggere un risultato debole, aggiungere coerenza di design, strutturare un concetto vago.
  3. Pipeline di PotenziamentoQuattro passaggi: valutare le lacune, controllare il DESIGN.md, applicare tecniche di parole chiave, vibe, struttura e colore, poi formattare.
  4. Opzioni di OutputTesto da copiare per impostazione predefinita; opzionalmente si può scrivere next-prompt.md o un file con nome scelto dall'utente.
  5. EsempiUna richiesta vaga per una pagina di login e una modifica mirata per aggiungere una barra di ricerca, entrambe con l'output potenziato completo.
  6. Consigli per Ottenere i Migliori RisultatiCinque promemoria su specificità, intento dell'utente, struttura numerata, inclusione del design system e modifiche a cambiamento singolo.
Descrizione della skill
"Trasforma idee UI vaghe in prompt raffinati e ottimizzati per Stitch. Aumenta la specificità, aggiunge parole chiave UI/UX, inietta contesto del design system e struttura l'output per migliori risultati di generazione."

Descrizione front-matter da SKILL.md. Il file completo è di circa 6.618 caratteri. Leggi il file completo su GitHub.

06 Prima di installare

Domande Sulla Skill enhance-prompt

Le risposte provengono dal SKILL.md letto il 2026-09-14, non da un'esecuzione registrata.

Ho bisogno di un DESIGN.md prima di poter usare questa skill?

No. La skill si limita a cercarne uno nel progetto corrente. Se non ce n'è nessuno, il prompt potenziato termina con un suggerimento a crearne uno con la skill design-md, in modo che tutte le pagine generate condividano lo stesso linguaggio visivo.

Che aspetto ha effettivamente il prompt finito?

Una descrizione in una riga dello scopo della pagina e del vibe, un blocco DESIGN SYSTEM (REQUIRED) con token di piattaforma, tema, sfondo e accento, poi una Page Structure numerata. La sezione della struttura elenca ogni area, come header, hero e footer.

Salva il prompt da qualche parte o lo mostra soltanto?

Per impostazione predefinita restituisce il prompt potenziato come testo da copiare. Se richiedete un file, può scrivere next-prompt.md per la skill stitch-loop, oppure un nome di file da voi specificato.

Di quali strumenti ha bisogno questa skill?

Dichiara Read e Write come strumenti consentiti, il che copre la lettura di un DESIGN.md e la scrittura di un file di prompt opzionale.

Enhance Prompt

Esegui enhance-prompt su un Compito Reale di Design UI.

Lo skill enhance-prompt è incluso in OpenDesign. Scarica l'app, seleziona lo skill in Plugins → Skills, incolla il prompt sopra e leggi il piano prima del risultato.

Scarica OpenDesignEsplora tutte le skill
Terminale
npx skills add https://github.com/google-labs-code/stitch-skills --skill enhance-prompt