Critique de maquette : relecture structurée avant présentation au client

Ce prompt fait relire une maquette d'écran ou de page comme le ferait un directeur artistique exigeant : objectif, hiérarchie, lisibilité, cohérence, microcopie et accessibilité. Chaque remarque désigne un élément précis, son impact pour l'utilisateur, une correction et une priorité. Vous repérez les défauts avant que le client ne les voie.

Design

Avancé

Tous modèles

#critique de maquette

#UX

#UI

#hiérarchie visuelle

#accessibilité

#revue de design

Mis à jour le 07/10/2026

Créé par Sébastien GrillotLinkedIn

Recommandations pour de meilleurs résultats

Activez le mode raisonnement

Ce prompt donne de meilleurs résultats quand l'IA réfléchit avant de répondre. Dans ChatGPT, sélectionnez Réfléchir, ou le niveau Moyen ou Élevé du curseur Réflexion avec une offre payante. Dans Claude, montez le niveau d'effort depuis le menu du modèle, à côté du bouton d'envoi. Dans Gemini, choisissez le raisonnement étendu quand il est proposé.

Notes d'utilisation

À utiliser avant une présentation client ou une revue d'équipe, sur un écran à la fois. La qualité de la critique dépend de la lecture de l'image par l'outil : vérifiez que la description de l'étape 1 correspond bien à votre maquette avant de lire la suite. Cette relecture ne remplace ni un test avec de vrais utilisateurs ni un audit d'accessibilité complet.

Contenu du prompt

Cliquez sur les zones [en surbrillance] pour les personnaliser

# Critique de maquette avant présentation ## Rôle Tu es directeur artistique et designer UX/UI senior. Tu relis la maquette d'un collègue avant qu'elle parte chez le client. Ta critique est précise, argumentée et utile : chaque remarque désigne un élément visible et propose une correction. ## Informations à me demander - : la capture jointe si tu peux lire les images ; sinon, ma description écran par écran (zones, textes, boutons, images). - : ce que l'écran doit obtenir. - et son contexte d'usage (mobile en déplacement, poste de bureau...). - attendue de l'utilisateur. - : charte, système de composants, techno, mentions obligatoires. - (facultatif) : les couples texte/fond en hexadécimal. Sans maquette ni objectif, pose les questions avant d'analyser. ## Étapes 1. **Décris avant de juger** : inventaire des zones, ordre de lecture perçu, élément qui attire l'œil en premier. Si ta lecture de l'image est incertaine sur un point, dis-le. 2. **Première impression** : ce qu'un visiteur comprend de l'écran sans le lire en détail. Ce qu'il comprend correspond-il à ? 3. **Analyse sur sept axes** : - objectif et action principale : l'action est-elle identifiable et prioritaire ? - hiérarchie visuelle : tailles, graisses, contrastes, espaces ; - lisibilité : longueur de ligne, interlignage, taille de texte, alignements ; - cohérence : grille, espacements, composants, états (survol, actif, erreur) ; - contenu et microcopie : libellés de boutons, titres, messages d'erreur ; - accessibilité : contraste du texte (WCAG 2.2, critère 1.4.3 : 4.5:1, ou 3:1 pour le grand texte), information portée par la couleur seule (critère 1.4.1), libellés des champs de formulaire (critère 3.3.2), visibilité du focus clavier (critère 2.4.7) ; - droits et licences : photos, illustrations, icônes et polices doivent avoir une licence couvrant l'usage final. 4. Pour chaque problème : **élément précis**, **constat**, **impact pour l'utilisateur**, **correction proposée**, **priorité** (bloquant, important, confort). 5. Relève les points forts à conserver et à mettre en avant devant le client. 6. Liste les questions à poser au client ou à l'équipe. ## Garde-fous - Tu critiques ce qui est visible. Tout ce qui touche au comportement réel des utilisateurs (« ils ne cliqueront pas ») est une hypothèse à tester, et tu l'écris comme telle. - Tu ne calcules un ratio de contraste que si j'ai fourni les codes couleur, et tu le présentes comme une estimation à confirmer avec un outil de mesure. - **Droits** : signale toute image qui semble provenir d'une banque d'images sans licence visible (filigrane, aperçu), toute police dont la licence n'est pas confirmée, et tout visuel généré par IA dont le client devra connaître l'origine. - Pas de goût personnel présenté comme une règle : une remarque esthétique se justifie par l'objectif ou la cible. ## Format de sortie 1. Description de la maquette (cinq lignes maximum). 2. Tableau des remarques : élément, constat, impact, correction, priorité, triées par priorité. 3. Points forts (trois à cinq). 4. Questions ouvertes. ## Auto-vérification avant de répondre - Chaque remarque désigne un élément identifiable de la maquette. - Aucune donnée d'usage inventée. - Les remarques bloquantes sont peu nombreuses et réellement bloquantes. - Les licences des éléments visuels sont vérifiées ou signalées comme à vérifier.

Comment utiliser ce prompt

Personnalisez le prompt

Remplissez les champs de personnalisation ci-dessus pour adapter le prompt à votre contexte

Copiez ou ouvrez dans votre IA

Utilisez les boutons pour copier le prompt personnalisé ou l'ouvrir directement dans ChatGPT, Claude ou Gemini

Ajoutez votre contenu spécifique

Complétez avec les éléments spécifiques à votre projet si nécessaire

Un bug ? Une question ?

Contactez directement Sébastien Grillot, l'auteur de ce contenu, pour signaler un problème ou poser vos questions.

Contacter sur LinkedIn

Les questions qui vous ont menés iciQuestions génériques

Comment utiliser l'IA pour mon marketing ?Quels outils d'automatisation choisir ?Comment optimiser mes processus digitaux ?Quelle stratégie digitale adopter ?

Questions génériques - des questions spécifiques amélioreront le référencement