Luca Mele
Luca Mele

AI & Engineering

Développement assisté par IA : comment j'ai construit ce site avec Claude et Figma

Développement assisté par IA : comment j'ai construit ce site avec Claude et Figma
Retour aux articles
·8 min de lecture
Écouter le podcast généré par IA

Ce site que vous lisez a été construit presque entièrement avec l'assistance de l'IA. Pas généré aveuglément, pas copié-collé depuis ChatGPT, mais développé dans une véritable collaboration entre un ingénieur senior et un partenaire de code IA. Je veux partager comment cette expérience s'est réellement déroulée — le workflow, les surprises et les compromis honnêtes.

J'ai utilisé Figma pour le design system et la direction visuelle, et Claude (l'IA d'Anthropic) comme mon partenaire de code principal via Claude Code. L'ensemble du stack — Next.js 14, Tailwind CSS, i18n en quatre langues, optimisation SEO, déploiement Vercel — a été construit dans un workflow conversationnel où je dirigeais les décisions d'architecture et de contenu tandis que l'IA gérait l'implémentation à grande vitesse.

Le workflow : diriger, pas dicter

Voici ce que la plupart des gens comprennent mal dans le développement assisté par IA : ils s'attendent soit à ce que l'IA fasse tout de manière autonome, soit ils la traitent comme un autocomplete glorifié. La réalité est plus nuancée. Je travaille avec Claude de la même façon que je travaillerais avec un développeur junior très rapide et très compétent — un qui ne se fatigue jamais, n'oublie jamais le contexte, et peut basculer entre TypeScript, CSS, SEO et i18n sans sourciller.

Mon processus : je conçois la direction visuelle dans Figma, définis l'architecture des composants et prends les décisions stratégiques. Puis je décris ce que je veux à Claude en langage naturel — « construis la page about avec une section hero, une grille photo et des cards de valeurs en utilisant nos tokens de design existants » — et j'itère sur le résultat. L'IA écrit le code. Je le revois, j'ajuste et je déploie en production.

Ce n'est pas de l'abdication. C'est un effet de levier. Je prends toujours chaque décision architecturale, chaque choix UX, chaque décision de contenu. Mais au lieu de passer 45 minutes à câbler une grille responsive avec une optimisation d'images correcte, je passe 2 minutes à décrire ce que je veux et 3 minutes à revoir le résultat.

Figma comme source de vérité

Figma reste essentiel dans ce workflow. L'IA peut écrire du code excellent, mais elle ne peut pas remplacer la pensée visuelle. J'utilise Figma pour explorer des layouts, établir des rythmes d'espacement, tester des combinaisons de couleurs et définir le ton émotionnel de chaque page. Le design system vit là — l'échelle typographique, les tokens de couleur, les patterns de composants.

Ce qui change, c'est la rapidité avec laquelle je peux aller d'un frame Figma à la production. Il n'y a pas de traduction manuelle fastidieuse de pixels en CSS. Je décris l'intention du design, référence les tokens, et l'IA produit du code qui correspond. Quand ça ne correspond pas parfaitement, j'ajuste — mais la boucle de feedback est en minutes, pas en heures.

Cette combinaison — le jugement visuel humain dans Figma plus la vitesse d'implémentation de l'IA — crée un workflow qui est véritablement meilleur que l'un ou l'autre seul. Je conçois plus ambitieusement parce que le coût d'implémentation est plus bas. Et l'IA produit un meilleur code parce qu'elle a une direction de design claire à suivre.

Ce que l'IA fait bien

Le contenu multilingue répétitif : j'écris la version anglaise, puis l'IA produit des traductions allemandes, françaises et italiennes qui sont naturelles et contextuellement appropriées — pas rigides comme de la traduction automatique, mais véritablement lisibles.

Le boilerplate avec précision : métadonnées SEO, tags Open Graph, sitemaps, URLs canoniques, alternates hreflang — toutes les choses qui sont critiques à bien faire mais fastidieuses à écrire à la main. L'IA les gère de manière cohérente sur des dizaines de pages sans les erreurs de copier-coller qu'un humain ferait.

L'optimisation des performances : quand mes scores Lighthouse ont montré un problème de blocking time, j'ai décrit le problème et l'IA a identifié la cause (chargement eager des animations canvas), proposé le fix (lazy loading via next/dynamic), et l'a implémenté sur chaque composant affecté en un seul passage.

Les refactors transversaux : renommer un concept, changer une surface d'API, mettre à jour des imports entre fichiers — le type de travail qui est mécanique mais sujet aux erreurs pour les humains. L'IA le fait parfaitement parce qu'elle ne perd pas son attention.

Ce que l'IA ne fait pas

Elle ne prend pas de décisions produit. Quand j'ai construit le système de blog, l'IA n'a pas décidé quels posts publier, quel ton ils devaient avoir, ou si les affirmations étaient exactes. J'ai trouvé du contenu trop spécifique, des chiffres inexacts, et un cadrage qui ne représentait pas mon expérience réelle. La couche de jugement humain est non-négociable.

Elle ne remplace pas le goût. Le design visuel, la stratégie de contenu, l'architecture de l'information, la décision de ce qu'il faut construire et de ce qu'il faut ignorer — ce sont des décisions humaines. L'IA est un outil d'implémentation puissant, mais elle optimise pour ce que vous lui dites, pas pour ce dont vos utilisateurs ont réellement besoin.

Elle ne comprend pas votre marque. J'ai dû corriger le ton, adoucir des affirmations, supprimer des détails inexacts et m'assurer que la personnalité ressortait. L'IA écrit de la prose compétente, mais de la prose compétente générique si vous ne la façonnez pas activement.

L'esprit d'ingénieur compte toujours

Voici ce qui surprend les gens : utiliser l'IA efficacement requiert plus de compétences en ingénierie, pas moins. Vous devez comprendre l'architecture pour la diriger. Vous devez lire le code de manière critique pour le revoir. Vous devez savoir à quoi ressemble une bonne performance pour repérer quand elle manque.

Je ne confierais pas ce workflow à quelqu'un qui ne pourrait pas construire le site lui-même. L'IA amplifie les capacités — elle ne les crée pas. Un ingénieur senior avec l'IA se déplace à 5-10x la vitesse. Un junior avec la même IA produit du code qui a l'air correct mais casse en production, parce qu'il ne peut pas évaluer ce qu'il reçoit.

Cela correspond à ma façon de recruter : je cherche des ingénieurs qui réfléchissent de manière critique aux compromis, pas des fanboys d'un outil particulier. L'IA n'est qu'un outil de plus — incroyablement puissant, mais toujours un outil. Les ingénieurs qui réussissent avec sont ceux qui avaient déjà un bon jugement.

Ce que cela signifie pour l'industrie

Je crois que le développement assisté par IA est la nouvelle norme. Pas un gadget, pas un raccourci pour les ingénieurs paresseux, mais un véritable multiplicateur de capacités pour ceux qui savent déjà ce qu'ils font. Les développeurs qui résistent livreront plus lentement. Ceux qui s'y engagent de manière réfléchie construiront des choses qui étaient auparavant trop coûteuses.

Ce site — multilingue, performant, optimisé SEO, avec un blog, un formulaire de contact et un design soigné — aurait pris des semaines de travail solo. Cela a pris des jours. Pas parce que l'IA l'a fait pour moi. Mais parce que l'IA m'a permis de me concentrer sur les décisions qui comptent tandis qu'elle gérait l'implémentation à la vitesse machine.

L'avenir du développement logiciel, ce n'est pas l'IA qui remplace les ingénieurs. Ce sont les ingénieurs qui savent collaborer avec l'IA qui tournent en rond autour de ceux qui ne le font pas.