Je suis le fondateur d\u2019OnTheGoSystems. Cette semaine, j\u2019ai personnellement proc\u00e9d\u00e9 \u00e0 la refonte de l\u2019interface d\u2019administration de WPML, notre produit phare. Je n\u2019ai pas g\u00e9r\u00e9 le projet. Je n\u2019ai pas r\u00e9vis\u00e9 le travail de quelqu\u2019un d\u2019autre. Je me suis assis avec Claude Code et j\u2019ai effectu\u00e9 moi-m\u00eame le travail de conception proprement dit. <\/p>\n\n
Deux raisons.<\/p>\n\n
Premi\u00e8rement<\/strong>, une administration plus claire et plus intuitive est la demande num\u00e9ro un de nos clients. Depuis des ann\u00e9es, ils nous disent que WPML comporte trop d\u2019\u00e9crans, que les r\u00e9glages sont r\u00e9partis dans des zones sans rapport entre elles et que les fonctionnalit\u00e9s importantes sont difficiles \u00e0 trouver. Quand quelque chose compte autant pour les clients, je veux le diriger de mes propres mains \u2014 pas \u00e0 distance. <\/p>\n\n Deuxi\u00e8mement<\/strong>, je voulais apprendre de premi\u00e8re main \u00e0 quoi ressemble aujourd\u2019hui la cr\u00e9ation d\u2019un produit r\u00e9el avec l\u2019IA. Pas ce que montrent les d\u00e9mos. Pas ce que pr\u00e9tendent les leaders d\u2019opinion. Le travail concret sur le produit, sur une base de code que les vrais clients verront, avec toute la complexit\u00e9 que cela implique. Je pr\u00e9f\u00e8re d\u00e9couvrir ce qui fonctionne en faisant le travail moi-m\u00eame plut\u00f4t que de me faire faire un rapport. <\/p>\n\n Ce que j\u2019ai d\u00e9couvert m\u2019a surpris dans les deux sens. Certaines choses que je pensais faciles se sont av\u00e9r\u00e9es difficiles \u2014 en particulier maintenir l\u2019IA align\u00e9e sur la r\u00e9alit\u00e9 lorsqu\u2019elle \u00e9tait tent\u00e9e d\u2019inventer des fonctionnalit\u00e9s qui semblaient plausibles mais ne figuraient pas dans notre produit. D\u2019autres choses que je pensais difficiles se sont av\u00e9r\u00e9es presque triviales \u2014 comme produire treize fichiers HTML coh\u00e9rents pour une nouvelle section en moins d\u2019une heure, chacun avec un JavaScript fonctionnel pour les bascules d\u2019\u00e9tat et l\u2019indexation de recherche, et chacun d\u2019entre eux utilisable comme r\u00e9f\u00e9rence de conception pour l\u2019\u00e9quipe impl\u00e9mentant la version r\u00e9elle. <\/p>\n\n La rapidit\u00e9, honn\u00eatement, a \u00e9t\u00e9 la plus petite surprise. La plus grande a \u00e9t\u00e9 de voir \u00e0 quel point la m\u00e9thode<\/em> importe. Adoptez la bonne m\u00e9thode et vous obtiendrez des r\u00e9sultats exponentiels \u2014 de meilleurs r\u00e9sultats, plus rapidement, avec une documentation pr\u00eate \u00e0 \u00eatre transmise. Trompez-vous de m\u00e9thode et vous atteindrez simplement la m\u00e9diocrit\u00e9 plus vite. <\/p>\n\n Ce qui suit est la m\u00e9thode compl\u00e8te que j\u2019ai utilis\u00e9e \u2014 les invites qui ont fonctionn\u00e9, les erreurs que j\u2019ai commises, les cycles de r\u00e9vision qui ont permis de d\u00e9tecter les fonctionnalit\u00e9s invent\u00e9es par l\u2019IA avant qu\u2019elles ne soient livr\u00e9es. Ce texte est \u00e9crit principalement pour les d\u00e9veloppeurs d\u2019OTGS qui souhaitent mener eux-m\u00eames des projets de ce type, mais toute personne cr\u00e9ant une interface utilisateur avec l\u2019IA aujourd\u2019hui peut probablement en tirer profit. <\/p>\n\n Planifiez par \u00e9crit avant de produire du code.<\/strong><\/p>\n\n Claude Code construira volontiers du HTML d\u00e8s que vous le lui demanderez. Il construira \u00e9galement le mauvais HTML, poliment, rapidement et en grandes quantit\u00e9s. Chaque fois que vous gagnez du temps en sautant une phase de planification, vous payez le double en retravail \u2014 et le retravail est plus difficile que la planification initiale car il y a maintenant du code que vous ne voulez pas jeter. <\/p>\n\n Chaque branche r\u00e9ussie de la session WPML pr\u00e9sentait la m\u00eame structure :<\/p>\n\n Chaque fois que cette structure a \u00e9t\u00e9 rompue, nous avons d\u00fb revenir en arri\u00e8re. Si vous ne devez retenir qu\u2019une chose de ce guide, retenez les six \u00e9tapes ci-dessus. <\/p>\n\n Commencez par la douleur ressentie par l\u2019utilisateur, pas par l\u2019\u00e9cran que vous voulez changer.<\/p>\n\n Mauvaise approche :<\/strong><\/p>\n\n \u00ab Ajouter une nouvelle page de r\u00e9glages pour la facturation de la traduction par IA. \u00bb<\/p>\n<\/blockquote>\n\n Bonne approche<\/strong> (comment la session WPML a r\u00e9ellement commenc\u00e9) :<\/p>\n\n \u00ab Les utilisateurs signalent que WPML semble accablant et peu intuitif en raison de :<\/p>\n\n\n\n La seconde version donne \u00e0 Claude un p\u00e9rim\u00e8tre sur lequel raisonner. Il conna\u00eet la douleur de l\u2019utilisateur, il peut rep\u00e9rer d\u2019autres \u00e9l\u00e9ments qui y contribuent et il peut s\u2019opposer si la solution que vous proposez ne s\u2019attaque pas \u00e0 la cause profonde. La premi\u00e8re version r\u00e9duit Claude \u00e0 un simple dactylo. <\/p>\n\n Dans la session WPML, le cadrage du probl\u00e8me a men\u00e9 directement \u00e0 des d\u00e9cisions que Claude n\u2019aurait pas pu prendre seul : que \u00ab Paiements et maintenance \u00bb \u00e9tait l\u2019\u00e9cran de trop, que les \u00ab Paquets \u00bb ne devraient pas \u00eatre au premier niveau, que le journal de communication n\u2019\u00e9tait pas dans le bon menu, que le Glossaire n\u2019\u00e9tait ni un r\u00e9glage ni un \u00e9l\u00e9ment de facturation. Rien de tout cela n\u2019aboutit si vous commencez par \u00ab refaire les R\u00e9glages \u00bb. <\/p>\n\n Mettez tout ce dont l\u2019IA a besoin dans le r\u00e9pertoire de travail avant de lancer l\u2019invite :<\/p>\n\n Claude travaille mieux lorsqu\u2019il peut voir la source de v\u00e9rit\u00e9. Les captures d\u2019\u00e9cran lui permettent de v\u00e9rifier les affirmations par rapport \u00e0 la r\u00e9alit\u00e9. Les liens externes lui permettent d\u2019effectuer des recherches via des sous-agents (voir phase 8) sans vous solliciter pour obtenir des informations de base. <\/p>\n\n C\u2019est la phrase qui a le plus d\u2019impact dans ce guide. Chaque ensemble d\u2019instructions de la session WPML se terminait par une version de : <\/p>\n\n \u00ab Avant de commencer la conception, examine tout, cr\u00e9e une liste de questions et pose-les-moi. Ne fais pas de suppositions. \u00bb<\/p>\n<\/blockquote>\n\n Sans cela, Claude se contente d\u2019agir directement sur votre briefing. Avec cela, Claude prend un tour pour identifier ce qu\u2019il ne sait pas et vous interroge. Ce tour permet de gagner des heures. <\/p>\n\n Lorsque Claude pose des questions en retour, r\u00e9pondez-y de mani\u00e8re concise. Vous ne lui devez pas des paragraphes entiers. Exemple tir\u00e9 de la session WPML : <\/p>\n\n Q : \u00ab Libell\u00e9 du menu \u2014 conserver ‘Paiement pour la traduction par IA’ ? (un peu maladroit) \u00bb Q : \u00ab Structure de la page \u2014 une seule longue page avec des sections, ou des sous-pages ? \u00bb Des r\u00e9ponses d\u2019une ligne suffisent. Des phrases compl\u00e8tes conviennent aussi. Les paragraphes entiers sont g\u00e9n\u00e9ralement le signe que vous faites le travail de Claude \u00e0 sa place. <\/p>\n\n La section Facturation de la session WPML est pass\u00e9e par deux cycles complets de questions<\/strong> avant qu\u2019une seule ligne de HTML ne soit \u00e9crite.<\/p>\n\n Cycle 1<\/strong> \u2014 8 questions couvrant : le libell\u00e9 du menu, la structure de la page, les variations d\u2019\u00e9tat, le compteur redondant des sites connect\u00e9s, l\u2019emplacement du Glossaire, l\u2019emplacement de \u00ab Qui peut utiliser \u00bb, le p\u00e9rim\u00e8tre de facturation, la gestion des actions r\u00e9serv\u00e9es au propri\u00e9taire.<\/p>\n\n Cycle 2<\/strong> \u2014 7 questions plus cibl\u00e9es : vue d\u2019ensemble vs index, l\u2019appel \u00e0 l\u2019action \u00ab Fatigu\u00e9 d\u2019attribuer des cr\u00e9dits \u00bb, le contenu des rapports d\u2019utilisation, l\u2019exp\u00e9rience utilisateur du transfert de cr\u00e9dits, les champs d\u2019\u00e9tat actif du Paiement \u00e0 l\u2019utilisation, l\u2019\u00e9tat actif pr\u00e9pay\u00e9, le p\u00e9rim\u00e8tre r\u00e9serv\u00e9 au propri\u00e9taire.<\/p>\n\n Ce n\u2019est qu\u2019apr\u00e8s ces deux cycles que Claude a propos\u00e9 le plan de fichiers. Ce n\u2019est qu\u2019apr\u00e8s la confirmation du plan de fichiers que le HTML a \u00e9t\u00e9 \u00e9crit. Temps de planification total \u00e9coul\u00e9 : peut-\u00eatre quinze minutes d\u2019\u00e9changes. Nombre total de fichiers produits : cinq, tous corrects d\u00e8s la premi\u00e8re fois. <\/p>\n\n Le contre-exemple est de s\u2019engager sur le r\u00e9sultat apr\u00e8s un seul cycle, puis de r\u00e9g\u00e9n\u00e9rer chaque fichier deux ou trois fois parce que les contraintes n\u2019avaient pas \u00e9t\u00e9 totalement identifi\u00e9es. Ce chemin semble plus rapide jusqu\u2019\u00e0 la troisi\u00e8me heure. <\/p>\n\n Les maquettes doivent souvent montrer plusieurs \u00e9tats d\u2019un m\u00eame \u00e9cran \u2014 vide vs rempli, s\u00e9curis\u00e9 vs avertissement, forfait actif vs forfait inactif. Deux mod\u00e8les ont bien fonctionn\u00e9 lors de cette session : <\/p>\n\n La bascule d\u2019\u00e9tat de Facturation.<\/strong> La page d\u2019accueil de la Facturation comporte un contr\u00f4le La bascule d\u2019avertissements de D\u00e9pannage.<\/strong> Sans cela, vous livreriez deux fichiers HTML distincts pour chaque \u00e9cran pr\u00e9sentant une transition d\u2019\u00e9tat. Avec cela, un seul fichier d\u00e9montre toute la surface de conception. Les r\u00e9viseurs en voient plus, plus rapidement. <\/p>\n\n Dans la mise \u00e0 jour du ticket YT, signalez-les explicitement :<\/p>\n\n \u00ab Il y a une bascule en haut : ‘\u00c9tat de l\u2019aper\u00e7u : Aucun forfait \/ Paiement \u00e0 l\u2019utilisation actif’. Utilisez-la pour voir les deux \u00e9tats. Bien entendu, cela ne fait partie que de la maquette et non de l\u2019interface utilisateur r\u00e9elle.<\/em> \u00bb <\/p>\n<\/blockquote>\n\n La clause en italique est importante. Sinon, un d\u00e9veloppeur demandera pourquoi le produit comporte une bascule d\u2019\u00e9tat. <\/p>\n\n Une fois que tout est construit, avant de vous engager dans la transmission, effectuez un cycle de r\u00e9vision. Dans cette session, il s\u2019agissait d\u2019une seule invite : <\/p>\n\n \u00ab Tout semble correct. Fais un cycle de r\u00e9vision : <\/p>\n\n\n\n Claude a r\u00e9examin\u00e9 chaque capture d\u2019\u00e9cran, les a compar\u00e9es \u00e0 chaque fichier produit et a renvoy\u00e9 un rapport structur\u00e9. Extrait de la r\u00e9vision du D\u00e9pannage de WPML : <\/p>\n\n Chaque \u00e9l\u00e9ment a pu \u00eatre corrig\u00e9 en un seul tour de suivi. Aucun n\u2019aurait \u00e9t\u00e9 d\u00e9tect\u00e9 sans l\u2019invite de r\u00e9vision. L\u2019IA a ici un avantage sur vous \u2014 elle peut relire chaque page et chaque capture d\u2019\u00e9cran simultan\u00e9ment en un seul tour. <\/p>\n\n Faites-le syst\u00e9matiquement. Ne le consid\u00e9rez pas comme facultatif. <\/p>\n\n La mise \u00e0 jour du ticket YT dans la session WPML est pass\u00e9e par plusieurs it\u00e9rations pendant<\/em> la session \u2014 affin\u00e9e au fur et \u00e0 mesure de l\u2019\u00e9volution de la conception, et non assembl\u00e9e dans l\u2019urgence \u00e0 la fin. Lorsque PostHog a \u00e9t\u00e9 renomm\u00e9 en \u00ab Suivi et rapports d\u2019utilisation \u00bb, la mise \u00e0 jour du ticket l\u2019a refl\u00e9t\u00e9 au cours du m\u00eame tour. <\/p>\n\n Une bonne mise \u00e0 jour de ticket pour une transmission de refonte d\u2019interface comprend :<\/p>\n\n La mise \u00e0 jour r\u00e9elle du ticket WPML fait environ 2 500 mots et couvre trois menus de premier niveau (R\u00e9glages \/ Facturation de la traduction par IA \/ D\u00e9pannage). C\u2019est plus long que la plupart des tickets car la surface de changement est vaste \u2014 n\u2019ayez pas peur de la longueur lorsque le changement est complexe, mais soyez rigoureux sur ce qui appartient au tableau (chemins et destinations) par rapport \u00e0 ce qui appartient \u00e0 la prose (principes et raisonnement). <\/p>\n\n Lorsque vous voulez que Claude actualise le ticket \u00e0 mesure que la conception \u00e9volue, une invite structur\u00e9e fonctionne mieux :<\/p>\n\n \u00ab J\u2019ai besoin que tu mettes \u00e0 jour mon message qui explique les changements effectu\u00e9s.<\/p>\n\n\n\n C\u2019est sp\u00e9cifique, structur\u00e9, et cela indique \u00e0 Claude ce qu\u2019il doit pr\u00e9server par rapport \u00e0 ce qu\u2019il doit changer.<\/p>\n\n Lorsque Claude a besoin d\u2019informations provenant de l\u2019ext\u00e9rieur du r\u00e9pertoire de travail \u2014 documentation fournisseur, articles de blog, pr\u00e9requis minimaux \u2014 d\u00e9l\u00e9guez \u00e0 un sous-agent. Ne faites pas de copier-coller manuel. <\/p>\n\n L\u2019invite qui a lanc\u00e9 la recherche pour le D\u00e9pannage de WPML :<\/p>\n\n \u00ab Recherche les fonctionnalit\u00e9s de d\u00e9pannage\/d\u00e9bogage de l\u2019extension WPML sur wpml.org (le site de documentation officiel) et renvoie un r\u00e9sum\u00e9 concis de ce que fait chaque fonctionnalit\u00e9 et de la mani\u00e8re dont l\u2019\u00e9quipe de soutien de WPML demande g\u00e9n\u00e9ralement aux utilisateurs de l\u2019utiliser. [\u2026] Merci de consulter la documentation pour chacun des \u00e9l\u00e9ments suivants et de m\u2019indiquer : <\/p>\n\n\n\n Ce sous-agent a renvoy\u00e9 un r\u00e9sum\u00e9 structur\u00e9 avec des liens sources qui ont directement fa\u00e7onn\u00e9 l\u2019organisation en trois niveaux (s\u00e9curis\u00e9 \/ journaux \/ soutien uniquement) de la refonte du D\u00e9pannage. Sans cela, nous aurions soit devin\u00e9 qui utilise quoi, soit interrompu le flux pour lire la documentation nous-m\u00eames. <\/p>\n\n Lorsque vous d\u00e9l\u00e9guez \u00e0 un sous-agent, dites-lui :<\/p>\n\n La m\u00e9thode est l\u2019\u00e9l\u00e9ment principal. Mais quelques principes sont revenus assez souvent pour m\u00e9riter d\u2019\u00eatre connus d\u00e8s le d\u00e9part \u2014 ils vous \u00e9pargneront un cycle de questions ou deux. <\/p>\n\n La page de d\u00e9pannage actuelle de WPML est un d\u00e9filement g\u00e9ant d\u2019environ 25 outils, m\u00e9langeant \u00ab Vider le cache \u00bb avec \u00ab R\u00e9initialiser enti\u00e8rement WPML \u00bb avec le m\u00eame poids visuel. Les clients ne peuvent pas savoir ce qui est s\u00fbr. Les assistants ne peuvent pas pointer vers une URL. <\/p>\n\n La refonte classe chaque outil dans l\u2019un des trois niveaux avec des badges de couleur :<\/p>\n\n Si vous vous retrouvez \u00e0 refaire une page technique dense, demandez-vous \u00ab quel est le rayon d\u2019action de chaque outil ? \u00bb avant de vous demander \u00ab \u00e0 quel sujet chaque outil appartient-il ? \u00bb.<\/p>\n\n Pour qu\u2019un outil fonctionne en libre-service, son texte doit indiquer \u00e0 l\u2019utilisateur :<\/p>\n\n L\u2019outil WPML \u00ab Corriger post_parent dans les traductions \u00bb est pass\u00e9 de la description concise du produit actuel \u00ab Corrige les relations parentales des publications traduites \u00bb \u00e0 :<\/p>\n\n \u00ab Lie \u00e0 nouveau les pages enfants traduites (ou tout contenu hi\u00e9rarchique) \u00e0 la version traduite de leur parent, au lieu de pointer vers le parent en langue originale. Utile apr\u00e8s des migrations ou des importations massives. \u00bb<\/p>\n<\/blockquote>\n\n M\u00eame outil, 3 fois plus utile car l\u2019utilisateur sait maintenant quand<\/em> y recourir.<\/p>\n\n Toutes les actions destructives n\u2019ont pas besoin du m\u00eame mod\u00e8le de confirmation. La session WPML a abouti \u00e0 trois niveaux : <\/p>\n\n Diff\u00e9rents niveaux de risque, diff\u00e9rents niveaux de friction.<\/p>\n\n Lorsqu\u2019un outil chevauche un r\u00e9glage, faites un lien plut\u00f4t que de vous l\u2019approprier. La page D\u00e9pannage \u2192 Rapports d\u2019utilisation renvoie vers R\u00e9glages \u2192 Traduction par IA \u2192 \u00ab Qui peut utiliser la traduction automatique \u00bb plut\u00f4t que de r\u00e9impl\u00e9menter ce contr\u00f4le. Une seule source de v\u00e9rit\u00e9, un seul endroit \u00e0 maintenir, une exp\u00e9rience coh\u00e9rente. <\/p>\n\n Les noms de fournisseurs internes ou les acronymes n\u2019ont pas leur place dans les textes destin\u00e9s aux clients. Dans cette session : <\/p>\n\n L\u2019index des r\u00e9glages de WPML comporte 16 sections ; la page de d\u00e9pannage compte environ 25 outils. Attendre d\u2019un utilisateur qu\u2019il balaie du regard et trouve le bon est irr\u00e9aliste. Une recherche pro\u00e9minente et cibl\u00e9e avec indexation des sous-\u00e9l\u00e9ments \u2014 de sorte que taper \u00ab fant\u00f4me \u00bb saute directement \u00e0 l\u2019ancre de l\u2019outil des entr\u00e9es fant\u00f4mes \u2014 r\u00e9sout mieux la d\u00e9couvrabilit\u00e9 que n\u2019importe quel nettoyage de navigation. <\/p>\n\n La section Facturation \u00e9tait diff\u00e9rente : 4 sous-pages, toutes avec des libell\u00e9s en langage clair. Nous avons ajout\u00e9 la recherche au d\u00e9part, puis l\u2019avons supprim\u00e9e apr\u00e8s avoir \u00e9valu\u00e9 la densit\u00e9 r\u00e9elle. Le principe : <\/p>\n\n Si une page comporte \u2264 6 \u00e9l\u00e9ments de premier niveau avec des libell\u00e9s en langage clair, n\u2019ajoutez pas de recherche. Si elle comporte > 10 \u00e9l\u00e9ments techniques, la recherche vaut presque toujours la peine. <\/p>\n<\/blockquote>\n\n Si votre site ne r\u00e9pond pas \u00e0 une exigence connue, dites-le \u00e0 l\u2019utilisateur en haut de la page \u2014 n\u2019attendez pas qu\u2019il le d\u00e9couvre par un \u00e9chec. La page d\u2019accueil du D\u00e9pannage ex\u00e9cute chaque v\u00e9rification de la liste des pr\u00e9requis minimaux de WPML et affiche les \u00e9checs dans un panneau jaune au-dessus de la recherche. Lorsque tout est conforme, le panneau est enti\u00e8rement masqu\u00e9. <\/p>\n\n Voici les formulations exactes qui ont permis de maintenir la session WPML sur les rails. Reprenez-les. <\/p>\n\n \u00ab Avant d\u2019aller plus loin, v\u00e9rifie tout et demande-moi des clarifications. Ne fais pas de suppositions. \u00bb<\/p>\n<\/blockquote>\n\n \u00ab Si tu as d\u2019autres questions, pose-les. \u00bb<\/p>\n<\/blockquote>\n\n \u00ab Compile le mat\u00e9riel et pose-moi des questions avant de produire le r\u00e9sultat. \u00bb<\/p>\n<\/blockquote>\n\n \u00ab Fais un cycle de r\u00e9vision :<\/p>\n\n\n\n \u00ab En fait, je vois que la fonctionnalit\u00e9 de recherche pour la section facturation n\u2019est pas requise. Merci d\u2019\u00e9valuer et de me dire s\u2019il y a un besoin, en fonction du contenu des sous-pages. \u00bb<\/p>\n<\/blockquote>\n\n Demander \u00e0 Claude d\u2019\u00e9valuer<\/em> avant d\u2019impl\u00e9menter<\/em> est le moyen d\u2019\u00e9viter d\u2019avoir \u00e0 annuler quelque chose trois modifications plus tard. Dans la session WPML, cette invite a permis de supprimer proprement la recherche de la Facturation en une seule \u00e9tape, au lieu qu\u2019elle soit \u00e0 moiti\u00e9 impl\u00e9ment\u00e9e puis retir\u00e9e. <\/p>\n\n \u00ab V\u00e9rifie la coh\u00e9rence et les conflits. Produis une version mise \u00e0 jour exempte de conflits et d\u2019ambigu\u00eft\u00e9s. Avant de le faire, pose-moi des questions pour ne pas avoir \u00e0 supposer ou inventer. \u00bb<\/p>\n<\/blockquote>\n\n Lorsqu\u2019on lui a demand\u00e9 cela, Claude a renvoy\u00e9 une liste structur\u00e9e de contradictions dans un projet de mise \u00e0 jour de ticket (\u00ab des \u00e9l\u00e9ments list\u00e9s comme supprim\u00e9s sont \u00e9galement list\u00e9s comme d\u00e9plac\u00e9s \u2014 qu\u2019en est-il ? \u00bb, \u00ab ‘ATE’ est ambigu : \u00c9diteur de traduction avanc\u00e9 ou moteur de traduction automatique ? \u00bb). Chacune a pu \u00eatre r\u00e9solue en une seule r\u00e9ponse. Sans cette invite, ces contradictions auraient \u00e9t\u00e9 livr\u00e9es. <\/p>\n\n \u00ab Renomme ‘X’ en ‘Y’ dans tous les fichiers de d\u00e9pannage. \u00bb<\/p>\n<\/blockquote>\n\n \u00ab D\u00e9place le bloc jaune des pr\u00e9requis minimaux pour qu\u2019il soit au-dessus de la recherche dans troubleshooting.html. \u00bb<\/p>\n<\/blockquote>\n\n C\u2019est chirurgical. Sp\u00e9cifique. Cela fonctionne toujours \u2014 tant que le changement est r\u00e9ellement m\u00e9canique. Pour tout ce qui n\u00e9cessite du jugement, revenez au mod\u00e8le de planification. <\/p>\n\n Si vous avez lu jusqu\u2019ici, voici l\u2019ensemble du flux de travail condens\u00e9 :<\/p>\n\n Pr\u00e9voyez du temps pour les \u00e9tapes 3 \u00e0 5 et l\u2019\u00e9tape 8 \u2014 le reste n\u2019est principalement que de l\u2019ex\u00e9cution.<\/p>\n\n La plus grande le\u00e7on de la session WPML est que Claude Code n\u2019est pas un designer ; c\u2019est un b\u00e2tisseur disciplin\u00e9 capable d\u2019ex\u00e9cuter un plan bien sp\u00e9cifi\u00e9 \u00e0 une vitesse inhabituelle.<\/strong> Votre valeur dans la boucle r\u00e9side dans le jugement, pas dans la saisie. Donnez le probl\u00e8me \u00e0 Claude, exigez qu\u2019il pose des questions, insistez sur un plan \u00e9crit, r\u00e9visez le r\u00e9sultat par rapport \u00e0 la source de v\u00e9rit\u00e9 et pr\u00e9parez la transmission au fur et \u00e0 mesure. <\/p>\n\n Si vous faites cela, la vitesse que vous obtiendrez n\u2019est pas une am\u00e9lioration de 2 fois par rapport au travail UX manuel. Elle est proche d\u2019un ordre de grandeur \u2014 et la qualit\u00e9 du r\u00e9sultat est sup\u00e9rieure, car la discipline de r\u00e9vision est int\u00e9gr\u00e9e au flux de travail au lieu d\u2019\u00eatre quelque chose que vous devriez vous rappeler de faire. <\/p>\n\n Cette mise \u00e0 jour de conception sera int\u00e9gr\u00e9e \u00e0 WPML 4.10. \u00c0 l\u2019instar de la conception pilot\u00e9e par l\u2019IA, nous impl\u00e9menterons cette mise \u00e0 jour majeure en d\u00e9ployant des agents d\u2019IA pour travailler de mani\u00e8re autonome, en \u00e9quipe. Si vous \u00eates int\u00e9ress\u00e9 par un aper\u00e7u, voici une courte vid\u00e9o : <\/p>\n\nLa r\u00e8gle unique qui permet d\u2019y parvenir <\/h2>\n\n
\n
Les huit phases d\u2019une session <\/h2>\n\n
1. Cadrez le probl\u00e8me, pas la solution <\/h3>\n\n
\n
\n
\n
2. Rassemblez votre mat\u00e9riel avant le d\u00e9but de la session <\/h3>\n\n
\n
Current\/<\/code> \u2014 WPML settings.jpg<\/code>, debug-main.jpg<\/code>, td-invoices.jpg<\/code>, td-translators.jpg<\/code>, etc. Une dizaine de JPG couvrant tout le p\u00e9rim\u00e8tre. <\/li>\n\n\n\ninstructions.txt<\/code><\/strong> \u00e9non\u00e7ant le probl\u00e8me, le p\u00e9rim\u00e8tre et les attentes en mati\u00e8re de r\u00e9sultats. Voir ..\/instructions.txt<\/code> pour le document r\u00e9el \u2014 remarquez comment il s\u2019est \u00e9toff\u00e9 au fil de trois passages (--- 1 ---<\/code>, --- 2 ---<\/code>, --- 3 ---<\/code>) \u00e0 mesure que de nouveaux \u00e9l\u00e9ments \u00e9taient ajout\u00e9s, plut\u00f4t que d\u2019\u00eatre r\u00e9\u00e9crit \u00e0 chaque fois. <\/li>\n\n\n\nalready-updated\/<\/code>. La session WPML a commenc\u00e9 avec un fichier ai-translation.html<\/code> stylis\u00e9 que Claude a utilis\u00e9 comme mod\u00e8le visuel pour tout le reste produit durant la session \u2014 la configuration Tailwind, la classe de carte, le mod\u00e8le de lien de retour, l\u2019animation flash pour les sauts d\u2019ancrage. Ce seul fichier a permis d\u2019\u00e9conomiser environ 30 minutes de d\u00e9cisions relatives au syst\u00e8me visuel. <\/li>\n\n\n\nwpml.org\/home\/minimum-requirements\/<\/code>) a guid\u00e9 la conception du panneau d\u2019avertissement. <\/li>\n<\/ul>\n\n3. Terminez chaque briefing par \u00ab pose-moi des questions, ne fais pas de suppositions \u00bb <\/h3>\n\n
\n
\n
\n
4. Encha\u00eenez les cycles de questions avant toute impl\u00e9mentation <\/h3>\n\n
5. D\u00e9signez explicitement les fonctionnalit\u00e9s r\u00e9serv\u00e9es \u00e0 la maquette <\/h3>\n\n
Preview state: No plan | PAYG active<\/code> en haut \u00e0 droite. Cliquer sur l\u2019un ou l\u2019autre fait basculer le panneau de vue d\u2019ensemble entre les deux \u00e9tats \u2014 \u00ab aucun forfait \u00bb affiche les deux cartes d\u2019acquisition, \u00ab Paiement \u00e0 l\u2019utilisation actif \u00bb affiche le panneau unique \u00ab Votre forfait de paiement \u00e0 l\u2019utilisation \u00bb avec les d\u00e9tails de la carte. Libell\u00e9 \u00ab \u00c9tat de l\u2019aper\u00e7u : \u00bb pour que les r\u00e9viseurs comprennent qu\u2019il s\u2019agit d\u2019une fonctionnalit\u00e9 de maquette, et non de l\u2019interface du produit. <\/p>\n\nPreview state: Has warnings | All OK<\/code> affiche ou masque le panneau jaune des pr\u00e9requis minimaux. M\u00eame libell\u00e9, m\u00eame raison. <\/p>\n\n\n
6. Effectuez un cycle de r\u00e9vision en comparant les maquettes \u00e0 la source <\/h3>\n\n
\n
\n
\n
7. R\u00e9digez la transmission aux d\u00e9veloppeurs en parall\u00e8le, pas \u00e0 la fin <\/h3>\n\n
\n
WPML \u2192 Translation Dashboard \u2192 Payments & Maintenance \u2192 Advanced Translation Editor \u2192 Overview \u2192 Who can use Automatic Translation?<\/code> \u2014 pas de r\u00e9sum\u00e9s, pas de paraphrases. <\/li>\n\n\n\n\n
\n
8. Utilisez des sous-agents pour la recherche externe <\/h3>\n\n
\n
\n
\n
\n\nPrincipes UX critiques issus du travail <\/h2>\n\n
Organisez par risque, pas par sujet <\/h3>\n\n
\n
Chaque outil r\u00e9pond \u00e0 trois questions <\/h3>\n\n
\n
\n
Contr\u00f4les de s\u00e9curit\u00e9 gradu\u00e9s <\/h3>\n\n
\n
RESET WPML<\/code> doivent toutes deux \u00eatre correctes.<\/li>\n<\/ul>\n\nFaites des liens crois\u00e9s, ne dupliquez pas <\/h3>\n\n
Renommez pour les clients <\/h3>\n\n
\n
La recherche l\u2019emporte sur la navigation pour les surfaces denses <\/h3>\n\n
\n
Avertissements proactifs plut\u00f4t que r\u00e9glages passifs <\/h3>\n\n
\n\nMod\u00e8les d\u2019invites qui ont fonctionn\u00e9 <\/h2>\n\n
Forcer les cycles de questions <\/h3>\n\n
\n
\n
\n
Piloter la r\u00e9vision <\/h3>\n\n
\n
\n
\u00c9valuer avant d\u2019agir <\/h3>\n\n
\n
Faire \u00e9merger l\u2019ambigu\u00eft\u00e9 <\/h3>\n\n
\n
Renommages et d\u00e9placements cibl\u00e9s <\/h3>\n\n
\n
\n
\n\nPi\u00e8ges \u00e0 \u00e9viter <\/h2>\n\n
\n
href<\/code> et le ticket YT doivent tous \u00eatre mis \u00e0 jour. Dites \u00e0 Claude de propager \u2014 ne le faites pas fichier par fichier. <\/li>\n\n\n\n
\n\nExemple de structure de session <\/h2>\n\n
\n
instructions.txt<\/code> qui se termine par \u00ab examine tout, pose-moi des questions, ne fais pas de suppositions. \u00bb<\/li>\n\n\n\n
\n\nConclusion <\/h2>\n\n