83.3K+Télécharger
Aller au guide d’utilisation
enhance-promptpar Google Labs

Enhance Prompt Skill.

Un skill Claude Code et Codex pour la conception UI : réécrit les idées UI vagues en prompts polis et optimisés pour Stitch.

  • Web et UI
Télécharger OpenDesignVoir le guide d'utilisation
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
En-tête et titres de section lus depuis le fichier amont le 14 septembre 2026 · 6 618 caractères au total

01 Ce qu'il fait

Ce que fait le skill enhance-prompt dans Claude Code et Codex

Résumé, workflow et sorties, tous lus dans le SKILL.md du skill.

D'après le SKILL.mdLu le 14-09-2026 · pas une exécution enregistrée

Dans les termes du Skill

Ce skill transforme des idées d'UI approximatives en prompts calibrés pour la génération Stitch. En agissant comme un Stitch Prompt Engineer, il vérifie l'entrée pour repérer l'absence de plateforme, de type de page, de structure, de style visuel, de couleurs et de composants, puis réécrit les formulations vagues en noms de composants précis, amplifie les adjectifs d'ambiance, regroupe le contenu en sections numérotées et met en forme chaque couleur avec un nom, un code hexadécimal et un rôle fonctionnel.

Lorsque le projet possède un DESIGN.md, sa palette, sa typographie et les styles de composants sont intégrés dans un bloc DESIGN SYSTEM (REQUIRED) ; en son absence, un conseil renvoie vers le skill design-md. La sortie est par défaut un texte à copier, ou un fichier tel que next-prompt.md pour stitch-loop.

Ce qu'il produit

  • Un prompt enrichi qui s'ouvre sur une description en une ligne de l'objet et de l'ambiance de la page, suivie du bloc de design system et de la structure de page numérotée.
  • Un fichier next-prompt.md optionnel, rédigé pour être utilisé avec le skill stitch-loop.
  • Un fichier optionnel portant un nom personnalisé choisi par l'utilisateur.
Voir l'exemple de prompt ↗

Fonctionnement

  1. 01
    Auditer l'entrée brute

    Le skill vérifie le prompt de l'utilisateur au regard de six éléments : plateforme, type de page, structure, style visuel, couleurs et composants.

  2. 02
    Récupérer le design system

    Il recherche un DESIGN.md dans le projet en cours et lit le bloc de design system afin que la palette, la typographie et les styles de composants puissent être réutilisés dans le nouveau prompt.

  3. 03
    Appliquer les techniques d'amélioration

    Les termes vagues deviennent des composants nommés, les adjectifs sont amplifiés en une ambiance, le contenu est organisé en sections numérotées, et les couleurs sont écrites avec un nom descriptif, une valeur hexadécimale et un rôle.

  4. 04
    Mettre en forme la sortie dans un ordre fixe

    Le résultat s'ouvre sur une description en une ligne de l'objet et de l'ambiance de la page, puis un bloc DESIGN SYSTEM (REQUIRED), puis une Page Structure numérotée.

02 Trouvez celui qui vous convient

Quand utiliser le skill enhance-prompt

Utilisez le skill enhance-prompt dans Claude Code ou Codex lorsque la tâche concerne du design UI de ce type. La portée et les limites ci-dessous proviennent du fichier du skill.

Bon choix

  • Peaufiner un prompt d'UI avant son envoi à Stitch.
  • Retravailler un prompt qui a déjà produit de mauvais résultats de génération.
  • Ajout de la cohérence du design system à une idée simple.
  • Transformation d'un concept vague en un prompt structuré et exploitable.

Connaître les limites

  • Regrouper plusieurs modifications sans rapport en une seule demande d'édition est activement déconseillé ; les modifications doivent être traitées une par une.
  • La sur-conception est un anti-pattern : lorsque l'utilisateur souhaite quelque chose de simple, l'amélioration doit rester alignée sur cette intention.

Quoi fournir

  • L'idée brute ou le prompt existantUne idée vague de génération d'UI ou un prompt peu performant constitue la matière de départ que le skill réécrit.
  • Le fichier DESIGN.md du projet, s'il existeIl est lu depuis le projet en cours afin que sa palette, sa typographie et ses styles de composants puissent être repris dans le nouveau prompt.

03 Dans le skill

Règles que le skill enhance-prompt donne à Claude Code et Codex

7 instructions concrètes, valeurs par défaut et limites que le SKILL.md fixe pour l'agent — la partie du fichier qui change le résultat.

  1. Consultez d'abord le guide Stitch

    Avant d'améliorer quoi que ce soit, consultez la documentation officielle de prompting Stitch, car ses recommandations peuvent primer sur les schémas intégrés à ce skill.

  2. Recadrer DESIGN.md en un bloc obligatoire

    Lorsqu'un DESIGN.md existe, son contenu n'est pas cité tel quel ; il est reformaté dans une section intitulée DESIGN SYSTEM (REQUIRED) dans le résultat.

  3. Couvrir le cas où DESIGN.md est absent

    Si aucun DESIGN.md n'est présent, le prompt amélioré se termine par une note renvoyant l'utilisateur vers le skill design-md pour des designs multi-écrans cohérents.

  4. Écrire les couleurs selon un modèle fixe unique

    Chaque couleur est exprimée sous forme de nom descriptif, code hexadécimal entre parenthèses et rôle fonctionnel qu'elle joue, jamais comme une simple pastille ou un adjectif vague.

  5. Numéroter les sections de la page

    Le contenu de la page est regroupé en sections numérotées afin que Stitch lise la hiérarchie, plutôt que de le laisser sous forme d'un paragraphe de texte.

  6. Sortie par défaut en texte

    Sauf demande contraire de l'utilisateur, le prompt amélioré est renvoyé sous forme de texte à copier ; l'écriture d'un fichier est optionnelle.

  7. Préserver le reste lors d'éditions ciblées

    Lorsque la demande est une édition plutôt qu'une nouvelle page, le prompt doit préciser que seule la modification décrite est effectuée et que tous les éléments existants sont conservés.

04 Mettez-le en pratique

Installez enhance-prompt dans Claude Code ou Codex

Une commande npx skills add, puis une première tâche dans votre agent et une checklist pour le résultat.

Ajoutez enhance-prompt à Claude Code, Codex ou Votre Agent

Exécutez-la dans votre projet ; l'installateur demande à quel agent l'ajouter.

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

Forme générique de la CLI skills pour plugins/stitch-utilities/skills/enhance-prompt/SKILL.md ; le dépôt peut documenter son propre chemin.

Donnez au skill une première tâche de design UI

Adaptez ce prompt avec votre propre contenu et contraintes, puis exécutez-le dans Claude Code ou Codex.

Example prompt
make me a login page

Source : exemple SKILL.md (verbatim).

Vérifiez le premier résultat

Ce que le SKILL.md lui-même présente comme un résultat correct :

  • Le prompt contient un bloc DESIGN SYSTEM (REQUIRED) listant, dans cet ordre, la plateforme, le thème, l'arrière-plan, l'accent principal et le texte principal.
  • Chaque couleur se lit comme un nom descriptif, un code hexadécimal et un rôle fonctionnel.
  • Le contenu de la page apparaît sous forme de sections numérotées, comme un en-tête avec une navigation, plutôt que comme une description vague.
  • Aucun mot de composant vague ne subsiste ; une demande de bouton devient un bouton d'appel à l'action principal.
  • Le bloc de design system est bel et bien présent, car c'est la cohérence qui fait tenir un résultat multi-pages.
  • Pour une modification ciblée, le prompt précise l'emplacement, le style, le placeholder, le comportement et la largeur plutôt que de redécrire toute la page.

Dans OpenDesign enhance-prompt est intégré : Plugins → Skills, sélectionnez-le dans la barre supérieure.

Télécharger OpenDesignLire le démarrage rapide

05 Open source, traçable

Source, licence et vérification

D'où proviennent les faits de cette page et quand ils ont été vérifiés pour la dernière fois.

Author
Google Labs
Repository
github.com/google-labs-code/stitch-skills Branche main
Fichier du skill
plugins/stitch-utilities/skills/enhance-prompt/SKILL.md Somme de contrôle du contenu enregistrée à la vérification ; commit 0337446
License
Apache-2.0 D'après LICENSE.
Étoiles du dépôt
8 304 Capture GitHub prise le 14/09/2026 pour l'ensemble du dépôt google-labs-code/stitch-skills, qui contient 12 skills dans ce catalogue. Ce n'est pas une note ou un compte d'utilisation pour enhance-prompt.
Vérifié par OpenDesign
14/09/2026 Le fichier source, le chemin, le texte de licence et le nombre d'étoiles ont été vérifiés. Inclus dans OpenDesign main (vérifié le 28/08/2026) ; aucune exécution en direct n'a été enregistrée sur cette page.

Dans le SKILL.md

  1. PrérequisConsultez le guide officiel de prompting Stitch avant d'améliorer, car il peut remplacer ces modèles.
  2. Quand utiliser ce skillQuatre déclencheurs : peaufiner un prompt, corriger un résultat faible, ajouter de la cohérence de design, structurer un concept vague.
  3. Pipeline d'améliorationQuatre étapes : évaluer les lacunes, vérifier le DESIGN.md, appliquer des techniques de mots-clés, de vibe, de structure et de couleur, puis formater.
  4. Options de sortieTexte à copier par défaut ; possibilité d'écrire next-prompt.md ou un fichier nommé par l'utilisateur.
  5. ExemplesUne demande vague de page de connexion et une modification ciblée d'ajout d'une barre de recherche, chacune avec la sortie améliorée complète.
  6. Conseils pour de meilleurs résultatsCinq rappels portant sur la spécificité, l'intention de l'utilisateur, la structure numérotée, l'inclusion du design system et les modifications à changement unique.
Description du skill lui-même
« Transforme des idées d'UI vagues en prompts polis et optimisés pour Stitch. Améliore la spécificité, ajoute des mots-clés UI/UX, injecte le contexte du système de design et structure la sortie pour de meilleurs résultats de génération. »

Description du front-matter de SKILL.md. Le fichier complet fait environ 6 618 caractères. Lisez le fichier complet sur GitHub.

06 Avant d'installer

Questions sur le skill enhance-prompt

Les réponses proviennent du SKILL.md tel que lu le 2026-09-14, et non d'une exécution enregistrée.

Ai-je besoin d'un DESIGN.md avant de pouvoir utiliser ce skill ?

Non. Le skill cherche simplement s'il en existe un dans le projet en cours. S'il n'y en a pas, le prompt amélioré se termine par un conseil suggérant d'en créer un avec le skill design-md afin que toutes les pages générées partagent le même langage visuel.

À quoi ressemble concrètement le prompt final ?

Une description en une ligne de l'objectif et de l'ambiance de la page, un bloc DESIGN SYSTEM (REQUIRED) avec les tokens de plateforme, de thème, d'arrière-plan et d'accent, puis une structure de page numérotée. La section structure liste chaque zone comme l'en-tête, le hero et le pied de page.

Enregistre-t-il le prompt quelque part ou se contente-t-il de l'afficher ?

Par défaut, il renvoie le prompt amélioré sous forme de texte à copier. Si vous demandez un fichier, il peut écrire next-prompt.md pour le skill stitch-loop, ou un nom de fichier que vous précisez.

De quels outils ce skill a-t-il besoin ?

Il déclare Read et Write comme outils autorisés, ce qui couvre la lecture d'un DESIGN.md et l'écriture d'un fichier de prompt optionnel.

Enhance Prompt

Exécutez enhance-prompt sur une Vraie Tâche de Design UI.

Le skill enhance-prompt est inclus dans OpenDesign. Téléchargez l'application, sélectionnez le skill dans Plugins → Skills, collez le prompt ci-dessus et lisez le plan avant le résultat.

Télécharger OpenDesignParcourir tous les skills
Terminal
npx skills add https://github.com/google-labs-code/stitch-skills --skill enhance-prompt