shape
Planifier la Conception UX/UI Avant le Codage
La plupart des interfaces générées par IA échouent car elles ignorent la pensée conceptuelle. Cette compétence exécute un entretien de découverte structuré pour comprendre les besoins, les contraintes et les objectifs des utilisateurs avant de produire un brief de conception complet qui guide l'implémentation.
Télécharger le ZIP du skill
Importer dans Claude
Allez dans Paramètres → Capacités → Skills → Importer un skill
Activez et commencez à utiliser
Tester
Utilisation de "shape". Façonnez l'UX pour un flux d'onboarding utilisateur qui aide les nouveaux utilisateurs à configurer leur espace de travail.
Résultat attendu:
Résumé de la fonctionnalité : Configuration initiale de l'espace de travail pour les utilisateurs qui viennent de s'inscrire. Objectif principal : emmener les utilisateurs vers le 'moment d'aha' en 5 minutes tout en réduisant l'anxiété face à la complexité de la configuration. Action principale de l'utilisateur : Compléter la configuration de l'espace de travail avec confiance. Direction de conception : Calme, rassurant, révélation progressive. Stratégie de mise en page : Flux vertical à colonne unique avec indicateurs de progression clairs. États clés : Première visite (accueil), En cours (indicateurs d'étapes), Terminé (célébration du succès), Erreur (validation avec guidance). Modèle d'interaction : Assistant guidé avec étapes optionnelles ignorables, sauvegarde automatique après chaque section. Exigences de contenu : Message de bienvenue, titres d'étapes, texte d'aide intégré, messages de validation. Références recommandées : interaction-design.md, form-design.md. Questions ouvertes : Devrions-nous autoriser le跳过 de la configuration du profil ?
Utilisation de "shape". J'ai besoin de concevoir un tableau de bord pour surveiller la santé des API.
Résultat attendu:
Résumé de la fonctionnalité : Tableau de bord de surveillance des API en temps réel pour les ingénieurs DevOps. Objectif principal : identification rapide des problèmes et analyse des causes racines. Action principale de l'utilisateur : Repérer et diagnostiquer rapidement les anomalies d'API. Direction de conception : Densité d'information élevée, contraste fort, analyse rapide. Stratégie de mise en page : Grille avec vue d'ensemble du statut en haut, métriques détaillées en bas, gradient de gravité de gauche à droite. États clés : Tous les systèmes sains, dégradation partielle (avertissement), défaillance critique, chargement (récupération initiale des données), aucune donnée. Modèle d'interaction : Survol pour les détails, clic pour approfondir, rafraîchissement automatique toutes les 30s, rafraîchissement manuel disponible. Exigences de contenu : Noms des services, indicateurs de statut, chiffres de latence, nombres d'erreurs, horodatages, messages d'erreur. Références recommandées : data-visualization.md, dashboard-design.md. Questions ouvertes : Préférences de seuils d'alerte ?
Audit de sécurité
SûrStatic analysis detected 22 potential issues (21 'weak cryptographic algorithm' patterns, 1 'external commands' pattern). All findings are false positives caused by pattern matching on markdown formatting (backticks around `.impeccable.md`) and common English words ('block', 'key', 'cipher'). This is a pure documentation/planning skill with no executable code, no network operations, no file system access, and no security risks. The skill runs a structured interview process and generates design documentation.
Problèmes à risque faible (1)
Score de qualité
Ce que vous pouvez construire
Chef de Produit Planifiant une Nouvelle Fonctionnalité
Avant de transmettre les exigences à l'ingénierie, utilisez cette compétence pour établir une direction UX claire, des métriques de succès et des contraintes de conception.
Développeur Démarrant l'Implémentation
Utilisez avant de coder pour clarifier ce qui doit être construit, en évitant le travail de refonte causé par des exigences mal comprises ou des cas limites oubliés.
Designer Définissant les Modèles d'Interaction
Structurez votre réflexion autour des flux utilisateurs, des états et des exigences de contenu avant de créer des maquettes visuelles ou des prototypes.
Essayez ces prompts
J'ai besoin de concevoir [feature description]. Exécutez l'entretien de découverte et créez un brief de conception.
Façonnez l'UX pour [feature]. J'ai déjà un contexte de conception de /impeccable, donc utilisez-le lors de la discussion sur les contraintes et les patrons.
Planifiez l'UX pour [feature] avec ces contraintes : [list constraints comme mobile-first, exigences d'accessibilité, budgets de performance]. Concentrez l'entretien sur la façon dont ces contraintes façonnent la conception.
Je veux concevoir [feature] mais je m'inquiète pour [specific concern comme la complexité écrasante]. Assurez-vous que l'entretien de découverte explore les anti-objectifs et ce que cela ne doit PAS être.
Bonnes pratiques
- Invoke /impeccable avant d'utiliser cette compétence pour assurer que les principes de conception et le contexte du projet sont chargés
- Répondez thoughtfully aux questions d'entretien même si vous pensez qu'un détail est évident
- Examinez attentivement le brief de conception généré avant de confirmer
- Transmettez le brief confirmé à /impeccable craft ou /impeccable pour une implémentation fluide
Éviter
- Sauter l'entretien de découverte et aller directement aux suggestions de conception
- Donner des réponses d'un mot aux questions d'entretien sans contexte
- Utiliser cette compétence en attendant une sortie de code au lieu d'une documentation de conception
- Ignorer l'étape de confirmation du brief et procéder avec une compréhension incomplète