J'ai failli ne pas l'installer. Une autre compétence Claude Code open source, un autre mardi, un autre dépôt GitHub promettant qu'il résoudrait le problème "AI ressemble à AI". J'avais déjà vu ce film. Je l’ai donc ajouté à mes favoris et je suis retourné à l’expédition.
Ensuite, j'ai exécuté une commande sur mon propre portefeuille.
impeccable critique a renvoyé un nombre que je ne voulais pas voir : 25 sur 40. Slop limite AI. La compétence indiquait cinq éléments spécifiques – trois d'entre eux étaient des décisions que j'avais personnellement prises, défendues lors de revues de conception et expédiées en toute confiance. Les deux autres étaient des défauts paresseux que je n’avais jamais remarqués car je consulte le même site tous les jours.
C'est à ce moment-là que j'ai arrêté de traiter Impeccable comme une autre compétence du répertoire et j'ai commencé à la traiter comme une deuxième paire d'yeux. Au cours de la semaine suivante, j'ai reconstruit des sections de deux projets avec, j'ai exécuté l'interview craft à partir de zéro sur une fausse page de destination SaaS et j'ai interrompu le mode alpha live de six manières différentes. Cet article est le rapport honnête. Ce qui a fonctionné. Ce qui n'a pas fonctionné. Ce que j'ai modifié sur mon propre site après que la partition soit revenue moche.
Si vous expédiez du code frontal avec Claude Code en 2026 et que vous avez déjà regardé une page de destination fraîchement générée et pensé "pourquoi cela ressemble-t-il à toutes les autres sorties AI" - la réponse se trouve dans les 4 000 mots suivants.
Ce qu’est vraiment Impeccable (sans le discours marketing)
Supprimez la copie du site Web et la Impeccable Skill Claude Code est une chose : un dossier de fichiers markdown qui se charge dans votre contexte Claude Code et modifie la façon dont le modèle considère le code frontal.
Cela semble ennuyeux jusqu'à ce que vous lisiez ce qu'il y a dans la démarque.
Vingt-trois commandes. Sept fichiers de référence spécifiques à un domaine : typographie, couleur, conception spatiale, réactivité, interactions, mouvement et écriture UX. Une liste de règles explicites « à ne pas faire » intégrées dans la mémoire de travail du modèle. Le tout s'installe avec une seule commande et fonctionne dans Claude Code, Cursor, Gemini CLI et Codex CLI. Depuis la version 1.5.1 (expédiée le 17 mars 2026, actuellement au nord de 10 000 étoiles GitHub), elle couvre la majorité du pipeline de conception frontale qu'un constructeur solo ou une petite équipe de produits toucherait.
L'auteur est Paul Bakaus. Le site d'accompagnement sur impeccable.style héberge des galeries before/after, des documents, une extension Chrome et une CLI autonome pour analyser les fichiers en dehors d'un harnais AI. Il existe une infrastructure marketing autour du projet, mais la valeur fondamentale réside dans la compétence elle-même. Si vous installez uniquement la compétence et ignorez tout le reste, vous bénéficiez toujours de l'essentiel des avantages.
Voici ce que personne d’autre ne dit clairement : cette compétence est fondamentalement une mise à niveau du vocabulaire. La compétence frontend-design d'Anthropic (celle livrée avec Claude Code) donne au modèle une certaine direction de conception. Impeccable va plus loin en lui donnant des mots. Mots spécifiques. "Plus silencieux." "Plus audacieux." "Distiller." "Polonais." "Adapter." Chacune est une commande que le modèle peut exécuter sur un composant, avec des règles documentées sur la signification visuelle de chaque mot.
La plupart des résultats de conception AI se ressemblent car le modèle n'a pas de vocabulaire pour la direction de conception. Il peut décrire — « utiliser une police de 16 pixels avec une hauteur de ligne de 1,5 » — mais il ne peut pas directer — « rendre cette section plus silencieuse pour que le CTA attire l'attention ». Impeccable installe cette couche de direction. C'est la véritable innovation technique.
La liste d’anti-patterns qui m’a fait taire pendant dix minutes
Laissez-moi vous montrer ce qui m'a brisé le cerveau lorsque j'ai lu pour la première fois les fichiers de compétences.
À l'intérieur du dépôt, il y a une liste de règles explicites « NE PAS ». Des choses comme : n'utilisez pas de texte gris sur des arrière-plans colorés. N'utilisez pas la palette AI (dégradés cyan sur foncé, violet vers bleu). N'utilisez pas de noir pur ou de blanc pur sans légère teinte. Ne chargez pas trois familles de polices et n’en expédiez que deux. Ne décorez pas avec des maquettes de téléphones clip-art. N'enfouissez pas le CTA principal dans une carte avec le même arrière-plan que la section environnante.
Je me suis assis là, en train de lire et j'ai pensé : J'ai expédié chacun d'entre eux au cours des six derniers mois.
Pas parce que je ne sais pas mieux. Parce que lorsque j'invite Claude Code à 23 heures et que je lui dis de "créer une section de héros", le modèle me donne à quoi ressemblent ses données d'entraînement selon une section de héros. Les données de formation proviennent de l’Internet public. L'Internet public, à partir de 2026, est principalement constitué de l'interface utilisateur Tailwind, des modèles Vercel et des pages de destination générées par AI. Le centre statistique de cette distribution correspond exactement à l'apparence décrite par les anti-patterns de Impeccable.
Anthropic a un nom pour cela : la convergence distributionnelle. Les modèles reproduisent le centre statistique des décisions de conception car ils ont été formés sur le centre statistique des décisions de conception. La contribution de Impeccable ne consiste pas à rendre le modèle « plus intelligent ». C'est qu'il décentre le modèle en injectant des contraintes opiniâtres sur lesquelles aucun comité de conception sur l'Internet public n'a jamais été d'accord.
C'est une contribution plus importante qu'il n'y paraît. La plupart des outils « anti-slop » tentent de détecter les mauvais résultats après coup. Impeccable empêche la sortie de se produire en premier lieu en attribuant au modèle une distribution de référence différente. C'est la différence entre éditer un brouillon et modifier ce qui est rédigé.
Je vais vous expliquer les sept piliers de la conception dans un instant, mais je veux planter un drapeau ici : la liste anti-pattern vaut à elle seule l'installation de la compétence. Même si vous n'utilisez jamais une seule commande, le fait d'avoir ces règles dans votre contexte Claude Code modifiera considérablement ce que le modèle expédie.
Les sept piliers (et pourquoi ils comptent plus que les commandements)
Les 23 commandes reçoivent l'essentiel de la presse, mais la structure porteuse de la compétence réside dans les sept fichiers de référence. Chacun d’entre eux est une plongée approfondie dans un domaine de conception unique, et Claude en tire chaque fois qu’il touche cette zone du code.
Typographie. Pas « utiliser l'Inter » – règles réelles. Dimensionnement optique entre les points d'arrêt. La relation entre la hauteur de la ligne du corps et l’espacement des paragraphes environnants. Quand utiliser les polices d’affichage et quand augmenter la police du corps. Les anti-références de la compétence dénoncent explicitement une surutilisation de l'Inter, ce que j'ai apprécié car j'en étais coupable sur trois de mes quatre projets.
Couleur. C'est là que la plupart des sorties AI se noient. Le fichier de référence prône la retenue, la discipline des accents et les tons neutres sur le noir pur et le blanc pur. Il existe une section spécifique sur ce que la compétence appelle « decoration discipline » : couleur utilisée pour la hiérarchie, pas pour l'excitation. Après avoir exécuté cela sur mon site, j'ai supprimé deux arrière-plans dégradés et la page est devenue considérablement plus confiante.
Conception spatiale. Rembourrage, marges et rythme entre les sections. Le fichier de référence est convaincu d'un rythme vertical cohérent entre les points d'arrêt - une chose que les mises en page générées par AI ne réussissent presque jamais car les données d'entraînement sont pleines d'espacement incohérent.
Réactivité. Règles spécifiques sur la façon dont les mises en page doivent changer, et pas seulement redimensionner, entre les points d'arrêt. C'est l'un des piliers sur lesquels la sortie de Impeccable diffère sensiblement de la génération par défaut de Claude Code.
Interactions. États de survol, anneaux de mise au point et ce que la compétence appelle des « surfaces avec état ». Il existe une règle discrète mais importante selon laquelle les états de survol doivent faire quelque chose de significatif, pas seulement s'assombrir légèrement. Après l'avoir lu, j'ai parcouru mon propre site et réalisé que sept de mes boutons avaient des états de survol qui ne faisaient pratiquement rien.
Mouvement. Un fichier de référence avec des opinions bien arrêtées sur l'assouplissement des courbes, les plages de durée et les cas où le mouvement est approprié. Les avertissements anti-patterns sont ici précis : atténuation du rebond sur les produits sérieux, parallaxe sur les pages de contenu dense et animation qui existe pour elle-même.
UX Writing. Celui-ci m'a surpris. La compétence comprend des conseils sur la façon dont les étiquettes des boutons, les messages d'erreur et les titres doivent sonner. Pas seulement la grammaire – la voix. Il existe une règle pour éviter "Cliquez ici" et "En savoir plus" comme texte de lien que j'ai envoyé à Claude Code en tant que règle decoration discipline et je refuse maintenant de fusionner le code qui la viole.
Les piliers comptent plus que les commandes car les commandes sont un raccourci pour invoquer les règles des piliers. Lorsque vous tapez impeccable polish, le modèle lit simultanément les piliers typographie, couleur, spatial et interactions et les applique au composant sélectionné. Sans les piliers, les commandes ne seraient que des verbes.
Le workflow Greenfield — Exécuter impeccable craft à partir de zéro
J'ai testé cela sur un faux produit SaaS appelé Lighthouse, un outil d'agrégation des commentaires des clients. Nouveau référentiel, nouvelle session Claude Code, aucun contexte de conception préalable. Je voulais voir ce que impeccable craft ferait sans aucune entrée préalable façonnant la sortie.
Le commandement donne le coup d'envoi d'un entretien. Environ 13 questions, selon la manière dont vous répondez aux questions ramifiées. La structure de l’entretien est la partie dont personne ne parle, alors laissez-moi vous expliquer ce qu’elle demande réellement :
- Type de produit. Interface utilisateur de l'application, site marketing, tableau de bord, éditorial. La réponse détermine si la compétence s'exécute en mode « marque » (le design EST le produit) ou en mode « produit » (le design SERVE le produit). 2. Public. Qui l'utilisera. Pas « tout le monde » : une personnalité spécifique avec un travail spécifique et un niveau spécifique de connaissances en design. 3. Voix et ton. Confiant, ludique, retenu, technique. Avec des sous-questions sur la question de savoir si la voix change entre différents contextes (marketing ou messages d'erreur, par exemple). 4. CTA principal. Quelle est l'action la plus importante entreprise par l'utilisateur. L'interview s'oppose fortement aux réponses vagues : « s'inscrire » est suivi de « pour quoi spécifiquement ».
- Portée visuelle. Clair, sombre ou les deux. Couleurs de la marque s'il en existe. Préférences typographiques avec avertissements explicites contre les choix génériques. 6.
Anti-références. Ce à quoi vous ne voulez PAS que cela ressemble. C’était la question la plus intelligente. La compétence vous demande de nommer trois sites concurrents ou orientations esthétiques que vous souhaitez activement éviter. 7. Dimensions de la personnalité. Curseurs le long d'axes tels que "ludique ↔ sérieux", "minimal ↔ maximal", "doux ↔ pointu". La composition de la sortie change en fonction de l'endroit où vous atterrissez.
L'entretien dure entre 5 et 8 minutes si vous répondez de manière réfléchie. À la fin, la compétence écrit deux fichiers dans votre dépôt : product.markdown et design.md.
product.markdown porte la couche stratégique : registre, audience, voix, anti-références, principes de conception. Le « qui, quoi, pourquoi » du produit. design.md contient la couche visuelle : couleurs, typographie, élévation, composants, choses à faire et à ne pas faire, formaté dans la même structure en six sections que Google Stitch a popularisée en 2025.
Une fois que ces deux fichiers existent, chaque future interaction Claude Code les lit en tant que contexte. C’est là que le véritable effet de levier s’accroît. Vous ne demandez pas au modèle de concevoir à partir de zéro à chaque fois, vous lui demandez d'étendre un système déjà documenté.
La démo Lighthouse — Premier passage, puis trois variantes
Après l'entretien, j'ai demandé à Claude Code (avec la Impeccable Skill chargée et les deux nouveaux fichiers en contexte) de créer une page de destination pour Lighthouse. Une invite. Aucun suivi.
La première passe était propre. Pas excitant, mais propre. Un héros avec un titre ciblé, un seul CTA principal au-dessus de la ligne de flottaison, une grille de fonctionnalités discrète et une section de témoignages qui n'a pas crié. Pas de glassmorphisme. Pas de dégradé violet. L'Inter n'était nulle part dans le dossier. La police était un affichage serif associé à un sans humaniste, deux choix qui ont émergé des réponses aux entretiens sur la voix.
Ensuite, j'ai exécuté la deuxième commande – impeccable variants – et j'ai demandé trois directions de mise en page : éditoriale, trempée et brutaliste.
La variante éditoriale ressemblait à un article de magazine long – photographie à fond perdu, lettrines dans le titre, mise en page de citation dans la barre latérale. La variante trempée a poussé la couleur de la marque à occuper 70 % du champ visuel avec des caractères blancs à contraste élevé. La variante brutaliste a entièrement dépouillé la décoration : lourdes bordures noires, esthétique HTML brute, type d'affichage à espacement fixe.
Ce qui m'a surpris, ce n'est pas que les variantes soient différentes. C'était qu'ils étaient lisiblement différents. Les variantes générées par AI ressemblent généralement au même design avec trois palettes de couleurs différentes. Ceux-ci s’engagent en fait dans des orientations esthétiques distinctes, de la même manière qu’un designer senior s’engagerait lors de l’esquisse d’options pour un client.
La comparaison la plus proche que j'ai est la génération de variantes de Google Stitch, mais Stitch fonctionne dans son propre canevas. Impeccable génère la même gamme de directions distinctes mais les envoie sous forme de code de production réel dans votre flux de travail Claude Code. Cette différence est importante lorsque l'étape suivante est « l'expédition » et non « la capture d'écran ».
J'ai choisi la variante trempée pour Lighthouse et je suis passé en mode direct.
Live Mode - où il brille et où il trébuche
impeccable live est la fonctionnalité alpha et l'étiquette alpha effectue un certain travail. Permettez-moi d'être honnête sur les deux moitiés.
La brillance d'abord. Le mode Live ouvre une session de navigateur, charge votre serveur de développement local et vous permet de sélectionner des composants directement dans la sortie rendue. Cliquez sur un héros. Exécutez bolder. Le héros devient visuellement plus lourd – plus de poids sur le caractère, une composition plus dense, un contraste plus profond. Cliquez sur quieter. Le contraire. Cliquez sur distill. Le composant perd son ornement et se réduit à ses éléments centraux. Cliquez sur polish. Le modèle passe et resserre les problèmes d'espacement, d'alignement et de petits problèmes de rythme visuel sans changer la structure.
Il existe un mode micro-variations qui génère quatre ou cinq petites variations du composant sélectionné côte à côte. Vous acceptez celle que vous souhaitez, rejetez les autres et la variante choisie est réécrite dans le fichier. Cette boucle - sélectionner, varier, accepter - est la chose la plus proche que j'ai utilisée pour une itération de conception en temps réel avec un partenaire AI. Quand ça marche, c'est vraiment amusant.
La commande detect exécute l'analyseur anti-pattern sur la page en direct et fait apparaître les problèmes en ligne. Sur la démo Lighthouse, il a détecté une carte de fonctionnalité avec une taille de cible tactile insuffisante sur mobile, un saut de titre de h1 à h3 et un CTA techniquement cliquable mais visuellement atténué en dessous d'un élément concurrent. Ces trois problèmes constituaient de véritables problèmes. Aucun d'entre eux n'aurait été attrapé par un linter standard.
Maintenant les trébuchements. Le mode Live est alpha et il agit comme ça.
La session du navigateur perd parfois la connexion au processus Claude Code et vous devez redémarrer les deux. La sélection des composants est délicate sur les pages avec un DOM profondément imbriqué : vous sélectionnez parfois un élément wrapper lorsque vous souhaitez la carte visible. La commande adapt (qui est censée traduire un composant dans un registre visuel différent) a produit deux fois une sortie qui a brisé la disposition existante, nécessitant un retour manuel. Et lors d'une session particulièrement longue, l'acceptation d'une variante a écrit la modification dans le mauvais fichier dans un monorepo et j'ai perdu environ dix minutes à récupérer.
Si vous considérez le mode live comme un outil d'esquisse fonctionnel (itération rapide, attente de casse, validation fréquente), il est puissant. Si vous le considérez comme une fonctionnalité terminée, cela vous frustrera. L'auteur a publié des correctifs chaque semaine et la trajectoire semble correcte, mais fin avril 2026, elle est toujours en phase alpha.
Le piège Mood-Board - pourquoi les prompts détaillés battent l’inspiration visuelle
Voici une découverte à laquelle je ne m'attendais pas. Impeccable accepte les entrées de mood-board - vous pouvez insérer des images de référence et demander à la compétence d'en extraire une direction visuelle. J'ai testé cela à deux reprises par rapport à des invites de texte détaillées sur le même projet.
Les invites textuelles détaillées ont gagné les deux fois.
La raison est mécanique. Lorsque la compétence ingère un mood board, elle doit interpréter les images et les traduire dans le même vocabulaire que le reste de la compétence utilise. Cette étape d’interprétation ajoute du bruit. Lorsque vous écrivez la réponse avec des mots : "Je veux une typographie discrète, un espacement généreux, une seule couleur d'accent, pas de décoration" - vous sautez l'interprétation et le modèle s'exécute contre votre intention directe.
Les moodboards fonctionnent toujours. Ils ne sont pas inutiles. Mais les personnes qui tirent le meilleur parti de cette compétence sont celles qui peuvent décrire ce qu’elles veulent avec des mots. Si votre vocabulaire de conception est faible, les moodboards combleront le vide. Si votre vocabulaire de conception est fort, les mots sont plus rapides et plus précis.
Ce compromis a une implication utile : cette compétence est un entraîneur de vocabulaire. Plus vous l’utilisez, mieux vous parvenez à décrire le design avec des mots et meilleurs sont vos résultats. Ce n'est pas seulement un outil, c'est une pratique.
Modification de sites existants – Où j'ai obtenu le score 25/40
Passons maintenant à la partie qui a meurtri mon ego. J'ai exécuté impeccable document sur mon propre portefeuille sur mejba.me. Cette commande procède à l'ingénierie inverse d'un design.md à partir d'une base de code existante, en lisant les styles, composants et modèles réels pour produire un document qui décrit ce qu'est actuellement le site - et non ce que vous souhaiteriez qu'il soit.
Ce document est brutal. C'est un miroir honnête.
Ensuite, j'ai exécuté impeccable critique. La compétence a renvoyé un score d'intégrité de conception de 25 sur 40. Le seuil pour "slop limite AI" est de 26. J'étais à un point en dessous.
Problèmes spécifiques signalés :
- Charge cognitive sur la page d'accueil. Trois accents visuels concurrents au-dessus de la ligne de flottaison. L’œil ne savait pas où aller en premier. J'avais défendu cela dans les revues de conception en le qualifiant de « riche » – la compétence l'appelait « dispersé ».
- Hiérarchie visuelle sur l'index du blog. Les titres des articles et les méta-informations présentaient un contraste de taille insuffisant. Je l'ai livré avec du CSS personnalisé dont j'étais fier. La compétence identifiait correctement que la fierté d’être l’auteur primait sur la clarté. - CTA ambigus. Trois boutons dans l'en-tête, aucun d'entre eux n'est clairement l'action principale. Le modèle l’a dénoncé et a recommandé d’en rétrograder deux vers des liens texte. - Utilisation excessive du glassmorphisme. Deux cartes sur la page du projet utilisaient des effets de flou de fond sans raison fonctionnelle. Je les avais ajoutés parce qu'ils « avaient l'air modernes ». Ils avaient l'air modernes en 2022. - Polices inutilisées chargées. La page a chargé trois familles de polices. Deux ont été utilisés.
L’un était un reste d’une itération précédente que je n’ai jamais supprimé. Du pur déchet, tant visuellement que sur le poids des pages.
Je n'ai pas réparé les cinq en même temps. J'ai choisi les deux qui comptaient le plus – le problème de la charge cognitive et les CTA ambigus – et j'ai reconstruit le héros de la page d'accueil avec impeccable craft fonctionnant sur un nouvel ensemble de réponses d'entretien. Réexécution de critique. Le nouveau score était de 32 sur 40. Solide, mais pas parfait.
Ce qu’il faut retenir honnêtement : le score n’est pas le point important. Le fait est que la compétence identifie des problèmes spécifiques et réalisables avec un raisonnement attaché, et les problèmes sont généralement corrects. J'ai arrêté de me fier à mes propres goûts sur les mises en page que je regardais depuis trop longtemps. Je lance critique à la place.
decoration discipline et delight — Les deux commandes dont personne ne parle
Les commandes largement discutées sont craft, polish, live et critique. Les deux qui ont discrètement changé ma façon d'écrire du CSS sont decoration discipline et delight.
decoration discipline audite un composant ou une page pour toute décoration visuelle inutile. Chaque ombre, dégradé, bordure, coin arrondi et éclat de couleur est évalué par rapport à la question : « est-ce que cela mérite sa place ? Des choses qui ne sont pas supprimées. La sortie est généralement 30 à 40 % plus pauvre que l’entrée. Confiant. Restreint. Le genre de design qui fait penser à l'utilisateur « c'est la meilleure version de ce produit » plutôt que « c'est un produit sophistiqué ».
delight fait le contraire. Une fois qu'une section a été disciplinée, vous exécutez delight pour y ajouter de la personnalité, mais plus précisément, uniquement dans les moments où elle sert l'utilisateur. Un état de survol qui fait quelque chose d'inattendu. Un état vide avec du caractère. Un squelette de chargement qui ne s'excuse pas pour le temps de chargement. Les règles de la compétence delight sont explicites : jamais décoratives, toujours fonctionnelles, toujours rares.
L’ordre compte. Disciplinez d'abord, delight ensuite. Si vous delight avant de discipliner, la personnalité est ensevelie sous le bruit. Si vous disciplinez sans delighting, le résultat est compétent mais froid. Les deux commandes forment une paire et la plupart des didacticiels que j'ai vus les traitent séparément.
C’est le genre de nuance qui me fait penser que la compétence a été développée par quelqu’un qui a réellement expédié un produit, et pas seulement écrit sur le design. D'autres compétences Claude Code qui valent la peine d'être installées ont tendance à se concentrer sur la vitesse du flux de travail ; Impeccable se concentre sur l'artisanat.
Résultats communs sur cinq sites que j'ai testés
Après la démo Lighthouse et mon propre site, j'ai exécuté la compétence sur quatre autres bases de code : deux projets clients (avec autorisation), un dépôt open source auquel je contribue et un démarreur dérivé d'un modèle Vercel. Cinq sites au total, dont le mien.
Certains résultats se répètent dans chacun d’entre eux :
- Maquettes clip-art de téléphones ou d'ordinateurs portables dans la section héros. Quatre sites sur cinq en disposaient. La compétence le signale car elle ajoute de la complexité visuelle sans rien communiquer sur le produit réel. - Surutilisation du glassmorphisme. Trois sur cinq. Flou de fond sur les cartes, sur les modaux, sur les superpositions. La compétence recommande d'utiliser le glassmorphisme uniquement lorsqu'il sert la signification de la surface (une info-bulle flottante, un panneau de survol) et jamais comme décoration. - Polices inutilisées chargées. Les cinq sites avaient au moins une famille de polices chargée mais inutilisée sur la page rendue. Il s’agit à la fois d’un problème de poids de page et d’un problème de cohérence visuelle. - Marque personnelle manquante. Quatre sur cinq n'avaient aucune signature visuelle distinctive. Il aurait pu s’agir de n’importe quel produit de sa catégorie.
Le flux de travail craft de la compétence s'oppose spécifiquement à cela en demandant des anti-références (à quoi vous ne voulez PAS ressembler), ce qui force la différenciation. - CTA en concurrence les uns avec les autres. Chaque site avait au moins deux CTA de poids visuel égal sur la page d'accueil. La compétence le signale systématiquement et recommande une hiérarchie claire entre les niveaux primaire, secondaire et tertiaire.
Si vous créez ou gérez actuellement une base de code frontale et que vous souhaitez savoir ce qu'un évaluateur externe détecterait, ce sont les cinq éléments à rechercher en premier. Vous n'avez même pas besoin de compétences pour les trouver : vous avez besoin de quelqu'un prêt à être honnête avec vous sur ce qui se trouve réellement sur la page.
Les limitations sur lesquelles je devrais être honnête
J'ai été positif tout au long de ce post et la compétence l'a mérité. Mais il y a de vraies limites.
Cela fonctionne mieux avec les conventions de conception occidentales et modernistes. Les données de formation et les fichiers de référence s'appuient fortement sur une tradition esthétique spécifique : caractères épurés, espace généreux, couleurs sobres, ornement minimal. Si votre projet nécessite une tradition visuelle différente (très ornementale, culturellement spécifique ou délibérément maximaliste), la compétence repoussera. Parfois, cette réticence est juste. Parfois, ce n'est pas le cas. Il faut savoir quand l'ignorer.
Cela ne peut pas remplacer le jugement de conception sur de nouvelles décisions. La compétence est excellente pour appliquer les principes de conception connus au travail exécuté. Il est moins efficace pour créer une direction visuelle que personne n'a essayée auparavant. Si vous construisez quelque chose de véritablement nouveau, la compétence vous aide à en proposer une version propre, mais l'étincelle doit venir de vous.
Le mode Live est alpha. J'en ai parlé ci-dessus, mais cela mérite d'être répété. Si vous adoptez cette compétence en espérant que le mode live fonctionne parfaitement, vous vous heurterez à des murs. Les commandes non live sont stables et excellentes. Le mode Live est un aperçu de la direction que prend le projet.
Cela augmente l'utilisation du contexte. Le chargement de 23 commandes et 7 fichiers de référence dans une session Claude Code utilise plus de contexte que l'exécution sans la compétence. Sur les grandes bases de code, cela est important. J'ai commencé à utiliser impeccable de manière sélective – chargé pour les sessions axées sur la conception, déchargé pour les sessions de refactorisation – afin de maintenir l'équilibre des dépenses contextuelles.
L'extension Chrome et la CLI sont intéressantes mais facultatives. Le site compagnon d'impeccable.style fournit des outils de support, mais la valeur fondamentale est la compétence elle-même. Ne vous laissez pas distraire par les infrastructures environnantes. Installez la compétence, exécutez craft, exécutez critique, expédiez de meilleurs frontaux. Tout le reste est un bonus.
Ce que je recommanderais de faire dans la prochaine heure
Si vous avez lu jusqu'ici, vous disposez de suffisamment de contexte pour prendre une vraie décision. Voici ce que je ferais si j'étais assis à côté de vous en ce moment.
Ouvrez votre terminal. Accédez à un projet parallèle – pas le plus important, un projet où vous pouvez expérimenter sans conséquence. Installez la compétence avec npx skills add pbakaus/impeccable. Exécutez impeccable document sur la base de code existante. Lisez le résultat sans vous défendre.
Exécutez ensuite impeccable critique. Obtenez le score.
Quel que soit le score, choisissez dans la liste le problème ayant le plus grand impact et corrigez-le avec la compétence chargée dans votre session Claude Code. Un problème. N'essayez pas de tout réparer. Expédiez le correctif, exécutez à nouveau critique et remarquez l'évolution du score.
C'est la boucle. La première fois, cela prend une heure. Après cela, cela prend dix minutes. En une semaine, vous aurez suffisamment intériorisé le vocabulaire de la compétence pour commencer à écrire un meilleur code frontal, avec ou sans son chargement.
C'est l'avantage de second ordre que personne ne mentionne dans le marketing : l'utilisation de cette compétence fait de vous un meilleur concepteur, pas seulement un meilleur prompteur. Le vocabulaire est transféré. Les transferts de conscience anti-pattern. Les transferts de rythme discipline-puis-delight.
J'ai commencé ce post en disant que je ne l'avais presque pas installé. Je termine en disant que c'est la deuxième compétence que je charge dans tout nouveau projet Claude Code, juste après les définitions de mes agents. La première fois que vous regardez un score critique passer de 25 à 32 parce que vous avez réellement corrigé les bonnes choses, vous comprendrez pourquoi.
Si vous créez un travail frontal avec AI en 2026 et que vous n'exécutez pas de détection anti-pattern sur votre sortie, vous envoyez la même page de destination que tout le monde. La compétence est gratuite. L'installation prend trente secondes. L'heure que vous passez à l'exécuter sur votre base de code existante est l'heure la plus efficace dont vous disposerez ce mois-ci.
Ce qui est sur votre écran en ce moment aurait probablement un score inférieur à 30. Le mien l'a fait. Le prochain mouvement vous appartient.
Travaillons ensemble
Vous cherchez à créer des systèmes AI, à automatiser les flux de travail ou à faire évoluer votre infrastructure technologique ? J'aimerais aider.
- Fiverr (versions et intégrations personnalisées) : fiverr.com/s/EgxYmWD
- Portefeuille : mejba.me
- Ramlit Limited (solutions d'entreprise) : ramlit.com
- ColorPark (conception et image de marque) : colorpark.io
- xCyberSecurity (services de sécurité) : xcybersecurity.io
