À quoi la boucle design vers code permet d'accéder
Parce que le travail se déplace de manière plus fluide entre le code et le plan de travail, les workflows ne font pas que changer, ils convergent.
Partager À quoi la boucle design vers code permet d'accéder
Illustration principale par Kelli Anderson
Alors que la frontière entre code et plan de travail se dissout, les designers et les développeurs trouvent de nouvelles façons de concevoir ensemble. Alex Kern et Gui Seiz façonnent à quoi cela ressemble chez Figma – Alex en tant qu'ingénieur logiciel axé sur la création pilotée par l'IA, et Gui en tant que directeur du design de l'IA. Ici, ils discutent de la manière dont l'IA réduit la distance entre conception et ingénierie, et de ce qu'un mode de travail plus continu permet de réaliser.
Comment l'IA change-t-elle la relation entre design et code ?
Du point de vue de la conception, les workflows ont changé radicalement. Le code était auparavant coûteux – complexe, laborieux et difficile à réviser. En comparaison, l'exploration du design semblait bon marché. Vous pouviez voir large, avancer rapidement et converger avec le temps. L'IA a inversé cette dynamique.
Au lieu de créer 50 frames statiques, je peux construire quelque chose sous forme de wireframe fonctionnelle et commencer à itérer sur le comportement, pas seulement la mise en page. Passer du code au plan de travail permet de se libérer de cette sensation d'enfermement. Vous pouvez prendre du recul, reconsidérer votre approche et explorer d'une manière qui reste fluide.
Historiquement, il était fastidieux d'intégrer le code au processus de conception – maintenir Figma synchronisé avec la base de code, conserver une structure cohérente entre les deux et aligner les décisions entre conception et ingénierie. L'IA change la donne. Les modèles peuvent désormais utiliser le code comme un média créatif de manière fiable.
Le changement ne consiste pas uniquement à générer du code plus rapidement. Il s'agit de rendre la traduction entre le plan de travail et le code plus sémantique et moins mécanique.
Le changement ne consiste pas uniquement à générer du code plus rapidement. Il s'agit de rendre la traduction entre le plan de travail et le code plus sémantique et moins mécanique.
Qu'apporte cette nouvelle relation à la collaboration ?
Le code est bien adapté aux environnements solos, où le travail avance dans une seule direction. Mais si vous souhaitez explorer une direction très différente, le modèle est souvent influencé par ce qui existe déjà dans la base de code. Cela peut être limitant. La capacité de penser dans les deux sens sur le plan de travail Figma permet aux équipes de sortir de ce scénario.
L'ancien débat consistait à savoir si les designers devaient coder. À présent que l'IA code, une question plus intéressante est de se demander si les designers doivent demander à l'IA de coder. Et pourquoi ne le feriez-vous pas ?
L'IA change qui peut participer. Si un utilisateur n'a pas accès au design system interne, il peut toujours importer le produit en direct dans Figma sous la forme de frames éditables et commencer à travailler à partir de là. Il s'agit parfois du véritable changement : pas une philosophie, mais un simple accès. La barrière à l'entrée est à présent beaucoup plus basse.
Comment l'IA change-t-elle la courbe d'apprentissage des designers et des développeurs ?
Auparavant, la courbe d'apprentissage était énorme. L'IA donne l'impression qu'il s'agit davantage d'une rampe. Votre niveau de départ est bien plus élevé et vous êtes immédiatement plus capable. Si vous souhaitez aller plus loin, il n'y a plus d'investissement énorme. Vous pouvez apprendre sur le tas et vous perfectionner au fil du temps, et ainsi devenir un spécialiste efficace dans votre domaine de problématique ou un expert pointu dans les composants d'ingénierie spécifiques de votre produit. Tout est désormais beaucoup plus contextuel.
J'ai fait tant de bootcamps de codage et ça ne rentrait pas. Avant, tout était abstrait. Maintenant, l'inspiration vous prend au travail, et vous pouvez demander à l'IA : « Explique-moi cela dans le contexte du contenu que je suis en train de créer. » Je comprends maintenant les routes et React car j'ai du travail concret sur lequel m’appuyer. Mes idées s'arrêtaient aux limites de mes connaissances techniques. Maintenant, je m'intéresse aux shaders, je travaille en 3D et je construis mes propres outils. Avant, je n'y aurais même pas pensé.
Quel est le véritable différenciateur lorsque tous ont accès aux mêmes outils ?
La curiosité, tout autant que le goût, sera le véritable différenciateur. L'IA permet aux designers de coder d'une manière différente et agit comme un tuteur très patient. Se lancer était intense avant. Des nouveaux outils et frameworks aux environnements et à la syntaxe... tout à la fois. Maintenant, il s'agit d'une boîte de dialogue. Pour rester pertinent à l'ère de l'IA, vous devez faire évoluer votre savoir-faire, et cela n'a jamais été aussi facile. Ici, les designers curieux seront les gagnants.
Il sera plus important pour le logiciel de se démarquer par le design – non pas en copiant ce qui a été fait auparavant, mais en expérimentant ce que cela signifie même de livrer des logiciels. Des interfaces qui combinent ingénierie et design pour créer des choses que seul le logiciel peut réaliser : visualisations de données, compréhension en temps réel de l'intention, UI générative, outils éphémères et calcul à la demande n'importe où. La technologie pour le faire existe aujourd'hui, mais elle nécessite toujours un individu créatif ayant un point de vue pour définir ce qui vient ensuite.
Pour rester pertinent à l'ère de l'IA, vous devez faire évoluer votre savoir-faire, et cela n'a jamais été aussi facile. Ici, les designers curieux seront les gagnants.
Comment ce workflow aller-retour tient-il réellement la route dans la pratique ?
Commencer sur le plan de travail Figma et passer au codage était auparavant coûteux pour les ingénieurs. En effet, il ne s'agit pas simplement d'obtenir du code qui fonctionne en théorie, mais de générer du code ergonomique qui tient dans la durée. Le code ayant une durée de vie de plusieurs années voire décennies, un code désordonné devient un problème à long terme. Auparavant, l'étape de traduction du design était vraiment mécanique, fastidieuse et sujette aux erreurs. L'IA a permis une compréhension plus sémantique de cette traduction.
Du code au plan de travail, du plan de travail au code – il existe un véritable workflow aller-retour. Votre designer peut transposer le code vers le plan de travail, et votre développeur peut transposer le plan de travail vers le code, ou vice versa. Cela permet aux coéquipiers d'être plus autonomes, car de nombreux changements de design et de texte effectués dans le code peuvent désormais être effectués par les designers.
Figma était l'endroit où vous vous aligniez. Le code était la source de vérité. Les captures d'écran constituaient la passerelle reliant les deux : un utilisateur capturait son application, importait les images dans Figma, annotait les changements et indiquait « Voici ce que je pense ». Puis un autre utilisateur devait recréer le produit.
Maintenant, vous pouvez importer votre storybook, des articles de blog, des graphiques et des tableaux et intégrer de vraies données dans Figma très rapidement. Il était auparavant difficile d'atteindre ce niveau de fidélité. Désormais, beaucoup plus d'éléments se chevauchent. Vous pouvez maintenir les deux synchronisés et atteindre près de 100 % de couverture.
Que se passe-t-il avec les chronologies lorsque les modèles ne font pas l'expérience du temps ?
Pour les ingénieurs, le temps a toujours été une contrainte clé. À présent, avec les agents, les ingénieurs se lancent dans des projets qui auparavant auraient constitué un usage irrationnel de leur temps, réécrivant d'énormes projets open source dans différentes langues et différents frameworks, construisant des navigateurs à partir de zéro, parcourant les arriérés à un rythme sans précédent et entreprenant des tâches gigantesques avec de minuscules équipes, parfois même en solo. Ces agents peuvent avancer très vite, mais les modèles n'ont pas de notion du temps. C'est drôle, Claude Code estime la durée d'une tâche à trois mois. Et je me dis, « Non, tu vas faire ça en cinq minutes. »
C'est drôle parce que c'est vrai – plus personne ne fait d'estimation. Essayez tout simplement. La question n'est plus « Combien de temps cela prendra-t-il ? », mais « Que voulons-nous créer ? »
Cet article a été publié dans notre magazine imprimé annuel, Start Anywhere. Découvrez la version numérique ou achetez un exemplaire.
