Design

En tant qu'architecte de design system, crée un système pour : [ENTREPRISE/PRODUIT] Structure : 1. **Principes** fondamentaux du design 2. **Palette** de couleurs et typographie 3. **Composants** réutilisables (boutons, formulaires...) 4. **Patterns** d'interaction 5. **Guidelines** d'utilisation 6. **Outils** et implémentation technique Assure cohérence, scalabilité et adoption par les équipes.

Tu es un expert Tailwind CSS et Design Systems. Je veux créer un design system complet. Projet: [DÉCRIRE LE PROJET: EX: SAAS, ECOMMERCE, DASHBOARD...] Architecture complète: 1. **Config Custom** : tailwind.config.js avec thème personnalisé (colors, spacing, typography) 2. **Design Tokens** : Variables CSS custom pour les valeurs du design system 3. **Component Library** : Base UI components (Button, Card, Modal...) avec variants Tailwind 4. **Responsive Strategy** : Breakpoints personnalisés et mobile-first approach 5. **Dark Mode** : Implémentation complète avec transitions fluides 6. **CSS Organization** : Utilisation de @apply vs component classes vs utility classes 7. **Performance** : Purge CSS pour enlever les classes inutilisées 8. **Accessibility** : Focus states, screen reader support, contrast ratios 9. **Documentation** : Storybook ou style guide pour les designers 10. **Figma Integration** : Design tokens synchronisés avec Figma Génère une page de démonstration interactive avec tous les composants.

Tu es un expert en design écosystème. Crée une stratégie cohérente pour : [ÉCOSYSTÈME NUMÉRIQUE ET PARCOURS UTILISATEUR] Cohérence cross-platform : 1. Architecture informationnelle scalable multi-devices 2. Design patterns adaptatifs et contexte-sensibles 3. Continuity design et transferts contextuels 4. Synchronisation état et données temps réel 5. Performance et contraintes techniques par plateforme 6. Testing utilisateurs multi-écrans et contextualisés 7. Documentation patterns et guidelines d'implémentation

Nous faisons un atelier pour mieux comprendre notre utilisateur type : [PERSONA]. Guide-nous pour remplir l'Empathy Map : 1. **Ce qu'il VOIT** : Son environnement, ses amis, le marché. 2. **Ce qu'il ENTEND** : Ce que disent ses collègues, ses influenceurs. 3. **Ce qu'il PENSE et RESSENT** : Ses préoccupations majeures, ses aspirations (non-dits). 4. **Ce qu'il DIT et FAIT** : Son comportement public, son attitude.

Audite l'accessibilité de [SITE/APPLICATION]. Audit WCAG 2.1 AA complet : 1. **Perceivable** : contrast, alt text, captions 2. **Operable** : keyboard navigation, timeouts 3. **Understandable** : language, instructions, error handling 4. **Robust** : semantic HTML, ARIA labels 5. **Screen reader testing** avec NVDA/JAWS 6. **Keyboard-only navigation** testing 7. **Color blindness simulation** et testing Fournis rapport détaillé avec niveaux de priorité et solutions techniques.

Audite l'UX de cette application mobile : [DESCRIPTION APP + SCREENSHOTS] Points d'audit : 1. **Navigation patterns** et information architecture 2. **Touch targets** et gesture interactions 3. **Onboarding flow** et first-time user experience 4. **Form usability** et input methods 5. **Performance perception** et loading states 6. **Accessibility** (VoiceOver, TalkBack) 7. **Platform guidelines** (iOS HIG, Material Design) Fournis rapport détaillé avec recommandations prioritaires.

Agis comme un expert UX certifié spécialisé en évaluation heuristique. Je vais te fournir une interface ou application à analyser. Effectue un audit complet basé sur les 10 heuristiques de Nielsen Norman Group : 1. **Visibilité du statut système** 2. **Correspondance système-réel** 3. **Contrôle et liberté utilisateur** 4. **Consistance et standards** 5. **Prévention d'erreurs** 6. **Reconnaissance plutôt que rappel** 7. **Flexibilité et efficacité d'utilisation** 8. **Esthétique et design minimaliste** 9. **Aide à la reconnaissance/diagnostic/récupération d'erreurs** 10. **Aide et documentation** Pour chaque heuristique : - ✅ Évaluation (respectée/partiellement/non respectée) - 📍 Éléments spécifiques concernés - 💡 Recommandations d'amélioration concrètes - 🎯 Priorité (Haute/Moyenne/Basse) Interface à auditer : [INSÉRER DESCRIPTION/SCREENSHOTS]

Réalise un audit d'accessibilité WCAG 2.1 AA pour : Site/Application : [DESCRIPTION] URL : [URL SI APPLICABLE] Public cible : [PUBLIC CIBLE] Analyse selon les 4 principes : **1. Perceptible** : - Alternatives textuelles (images, médias) - Contrastes couleurs (ratio 4.5:1 minimum) - Responsive design et zoom **2. Operable** : - Navigation clavier complète - Timing et animations - Cibles de clic (44x44px minimum) **3. Understandable** : - Langue de la page - Instructions claires - Gestion d'erreurs **4. Robust** : - HTML sémantique - Compatibilité lecteurs d'écran Fournis la checklist détaillée avec priorités.

Agis comme un expert en accessibilité numérique. Audite le site [URL OU DESCRIPTION] selon les critères WCAG 2.1 AA. Analyse : 1. **Perception** : Contrastes, alternatives textuelles, captions. 2. **Opérabilité** : Navigation clavier, timing, animations. 3. **Compréhension** : Langue de la page, structure logique, erreurs. 4. **Robustesse** : Compatibilité avec technologies d'assistance. Pour chaque problème trouvé : - Niveau de sévérité (Bloquant/Majeur/Mineur) - Impact sur les utilisateurs - Solution technique concrète (code HTML/CSS/JS) - Outils de validation recommandés

Audite l'accessibilité de : Type d'interface : [web/mobile/app] Public cible : [public] Contraintes : [contraintes techniques] Évalue selon WCAG 2.1 : 1. Perceptibilité (images, couleurs, audio) 2. Opérabilité (navigation, clavier) 3. Compréhensibilité (lecture, langue) 4. Robustesse (compatibilité) Pour chaque critère : - État actuel - Problèmes identifiés - Niveau de conformité - Recommandations prioritaires Sois spécifique et hiérarchisé.

Tu es un expert en accessibilité numérique et design inclusif. Réalise un audit complet d'accessibilité pour : [URL OU DESCRIPTION DU SITE/APPLICATION] [TYPE DE CONTENU ET PUBLIC VISÉ] [CONTRAIRES RÉGLEMENTAIRES APPLICABLES] Audit d'accessibilité complet : 1. Évaluation de conformité WCAG 2.2 (niveaux A, AA, AAA) 2. Tests avec lecteurs d'écran (JAWS, NVDA, VoiceOver) 3. Analyse navigation clavier et focus management 4. Vérification contrastes couleurs et lisibilité 5. Tests formulaires et champs de saisie accessibles 6. Évaluation contenu multimédia (sous-titres, transcriptions) 7. Validation structure sémantique et ARIA landmarks 8. Tests utilisateurs avec différents handicaps 9. Plan de correction priorisé par impact et effort 10. Formation équipes et monitoring continu de l'accessibilité

Tu es un expert en accessibilité numérique certifié WCAG. Réalise un audit complet pour : [SITE/APPLICATION À AUDITER] Audit d'accessibilité : 1. Analyse automatique (outils et scripts) 2. Tests manuels par catégorie de handicap 3. Évaluation du parcours utilisateur critique 4. Priorisation des corrections (impact/effort) 5. Plan de mise en conformité progressif 6. Formation et sensibilisation des équipes 7. Monitoring continu de l'accessibilité

Tu es un expert en accessibilité numérique (WCAG 2.2). Audit ce produit : [SITE/APPLICATION + PUBLIC CIBLE + CONTRAINTES TECHNIQUES] Audit accessibilité complet : 1. **Perceptible** : alternatives textuelles, captions, contrast 2. **Operable** : navigation clavier, timing, seizures 3. **Understandable** : langage, prévisibilité, assistance 4. **Robust** : compatibilité AT, HTML sémantique 5. **Screen reader testing** : NVDA, JAWS, VoiceOver 6. **Motor disabilities** : navigation alternative, voice control 7. **Cognitive accessibility** : clarté, consistance, aide mémoire Fournis le rapport détaillé avec priorités et plan de correction.

Tu es un expert en accessibilité numérique (CPACC, WAS). Audit cette interface selon WCAG 2.1 AA : [INSÉRER URL/SCREENSHOT/COMPOSANTS] Analyse les 4 principes : 1. **Perceivable** : contrast, alt text, captions, resizable text 2. **Operable** : keyboard navigation, timeouts, motion 3. **Understandable** : readable, predictable, input assistance 4. **Robust** : markup validity, assistive tech compatibility Fournis un rapport détaillé avec niveaux de conformité et corrections prioritaires.

Tu es un expert en accessibilité numérique (a11y). Audite l'interface web suivante selon les standards WCAG 2.1 et les meilleures pratiques. Interface à auditer : [URL OU DESCRIPTION] Vérification complète : 1. **Perceptuelle** : Le contenu est-il perceptible par tous les utilisateurs ? 2. **Opérable** : Peut-on naviguer et utiliser toutes les fonctionnalités sans souris ni vision ? 3. **Compréhensible** : L'information est-elle claire et facile à comprendre ? 4. **Robuste** : Fonctionne-t-elle correctement avec les technologies d'assistance ? 5. **Prédictible** : Les utilisateurs peuvent-ils anticiper les résultats de leurs actions ? Tests automatisés : - **Contraste de couleurs** : Vérifie le ratio de contraste (minimum 4.5:1). - **Navigation au clavier** : Teste la navigation complète au clavier (Tab, Shift+Tab, Echap, Flèches directionnelles). - **Lecteurs d'écran** : Vérifie la compatibilité avec les lecteurs d'écran. - **Zoom** : Teste le zoom jusqu'à 200% sans perte de qualité. - **Responsive Design** : Vérifie l'adaptation mobile (320px, 768px, 1024px). Rapport d'audit : - **Conformité WCAG** : Score global et détails par critère. - **Recommandations prioritaires** : Actions correctives avec code exemples. - **Outils de test** : Extensions et navigateurs recommandés.