TPC
    TPC
    Design

    Design & IA : le process qui change tout

    Floran (Senior Product Designer, Bitstack) partage comment l'IA a transformé chaque étape de son workflow : vibe-coding sans handover, agent d'insights utilisateurs, refinement en solo avec Claude, et les trois phases pour trouver sa posture face au code.

    9 min de lecture
    Floran

    Floran est Senior Product Designer chez Bitstack (épargne Bitcoin), après trois ans et demi chez Qonto. Il partage dans ce live comment il a intégré l'IA dans son workflow au fil de trois contextes différents : une scale-up, une startup à vélocité élevée, et des projets personnels. De la feature vibe-codée sans handover à l'agent connecté à tous les canaux utilisateurs, ce retour terrain touche chaque étape du métier de designer.

    1. Introduction

    Il n'y a pas une seule vérité sur comment intégrer l'IA dans le design. Floran le dit d'emblée : ce qu'il partage, c'est sa vérité, construite dans des contextes très différents. Une scale-up avec une grosse code base, une process rigoureuse et une forte culture qualité. Une startup de dix à quinze personnes en product & engineering où les priorités changent tous les matins. Et des projets personnels où il a traversé trois phases d'adoption successives — apprentissage, délégation du futile, puis lâcher prise total.

    2. Trois appétences, une même valeur ajoutée

    Floran observe que le titre "product designer" a toujours regroupé des profils très différents. L'IA l'a rendu encore plus visible. Il distingue trois grandes orientations.

    Craft / UI

    Les designers qui ont une appétence pour la partie graphisme, les micro-interactions, le motion, le delight dans l'app. Avant, ils exploraient manuellement et passaient du temps à itérer sur Figma. Maintenant, ils peuvent générer des directions rapidement, se concentrer sur le jugement esthétique, et faire de la veille beaucoup plus vite.

    Product management

    Les designers orientés research, priorisation, stratégie produit. L'IA leur permet de challenger leurs propres décisions plus facilement, d'aller plus vite en solo, et d'automatiser la recherche d'insights utilisateurs.

    Engineering / Design Ops

    Les designers qui ont une appétence pour le design system, l'automatisation, les specs. Avant, maintenir un design system et documenter des composants était redondant. Maintenant, on peut automatiser ses specs, ses tokens, voire vibe-coder des features.

    "L'IA, ça a de la valeur ajoutée à toutes les étapes du product design, et peu importe les appétences qu'on a."

    Floran, Senior Product Designer, Bitstack

    3. J'ai designé une feature et je l'ai codée. Le dev n'avait pas de handover à faire.

    Le raccourci Tap to Pay chez Qonto

    Premier exemple concret : chez Qonto, une feature de raccourci natif sur iOS. Un widget accessible depuis l'écran de verrouillage ou le centre de contrôle pour lancer directement le mode Tap to Pay. Les marchands qui utilisent cette feature jusqu'à cinquante fois par jour évitaient ainsi de déverrouiller le téléphone, ouvrir l'app, naviguer jusqu'à la bonne page.

    Pourquoi Floran l'a codée lui-même

    Deux raisons. Les devs étaient concentrés sur des features à forte valeur ajoutée. Et la feature était un "quick win bonus" — le genre de chose qui peut être dépriorisée indéfiniment dans une grosse roadmap.

    Pourquoi c'était possible

    D'autres équipes avaient déjà implémenté des raccourcis natifs sur d'autres features. "Je n'ai rien créé de nouveau, j'ai juste fait une déclinaison. C'était totalement à la portée d'un designer." Le résultat : deux heures de dev, une feature shippée la semaine suivante, des métriques d'appétit utilisateur mesurées rapidement.

    La limite assumée

    "Ça n'aurait pas été à la portée de coder une feature entière. Mais un petit truc comme ça, une extension de quelque chose qui existait déjà, c'était possible."

    4. Du UI et de la donnée déjà disponible

    Deux cas chez Bitstack, dont la stack est en Flutter.

    Mise à jour de la bannière carte

    Le lancement de la carte Bitstack approchait. La bannière promotionnelle était visible sur le site mais absente de l'app. "C'est clairement vibecodable. C'est juste de l'esthétique, il n'y a pas de fonctionnel derrière." Floran a fait la modification, créé une pull request, les devs ont reviewé le code avant de le merger. "L'histoire d'un ou deux jours. Là où un dev aurait été bloqué sur des trucs plus importants."

    Affichage du total cashback

    Une amélioration constamment demandée par les utilisateurs : voir le total de Bitcoin gagné via les arrondis et le cashback. Constamment déprioritée car l'équipe travaillait sur des sujets plus lourds. Floran l'a vibe-codée seul avec Cursor.

    Condition préalable indispensable

    "L'info était déjà disponible par le backend. Les ingénieurs backend avaient rendu cette donnée disponible, l'application mobile pouvait la consommer. J'ai juste fait de l'affichage." Si la logique backend n'avait pas été implémentée, ce n'aurait pas été possible.

    Double bénéfice

    Pas de défocus sur le dev qui était sur une feature plus grosse, et pas de handover à faire. "Faire les specs, expliquer l'intention aux développeurs — ça prend du temps. En le faisant de bout en bout tout seul, on a économisé pas mal de temps."

    5. Automatiser la research pour ne plus squeezer la discovery

    L'agent d'insights utilisateurs

    Chez Bitstack, Floran a créé un skill Claude connecté à tous les canaux où les utilisateurs s'expriment : le chat support, le Discord, le Telegram, les messages internes sur Slack, et Linear (l'outil de gestion de projet où l'équipe logue les retours et améliorations). Via des MCPs, Claude peut interroger l'ensemble de ces sources.

    La commande : slash bitstack user insight

    Il pose sa question — quels sont les principaux problèmes remontés sur telle feature, quelles sont les idées d'action ? — et obtient un document de synthèse.

    Le gain par rapport à avant

    "Avant, je triais à la main. Je faisais des exports de tickets dans le chat, je regardais ce que les gens disaient. C'était super utile, mais ça prenait du temps juste pour faire du tri." Maintenant, c'est le point de départ de toute session de research. Il creuse ensuite là où c'est nécessaire, recontacte des utilisateurs, deep dive dans les messages du support.

    Le message de fond

    "Il y a un mindset en ce moment à vouloir squeezer la research et partir directement dans les solutions parce qu'on peut coder vite. Mais si on peut intégrer l'IA dans sa research, au moins, on a des bases solides. Et puis, ça aide à la priorisation aussi."

    "Pour éviter le contre-argument de 'la research, ça prend du temps', automatisons la research."

    Floran, Senior Product Designer, Bitstack

    6. Remplacer quatre-vingts pour cent du workshop design-dev

    Claude comme copilote technique

    Le refinement — la phase où le designer confronte sa solution aux contraintes techniques — se faisait traditionnellement en workshop avec les développeurs. Chez Qonto, scale-up avec des processus rigoureux, c'était la norme. En startup, "on n'a pas trop le temps de faire ça."

    Le principe

    Floran donne ses designs à Claude, qui a accès à la code base. Il lui explique ce qu'il prévoit de faire ou dans quelle partie de l'app. Claude va fouiller et remonte les edge cases qu'il n'aurait pas vus.

    Un exemple concret

    "Par exemple, je ne sais pas — si tu fais un flow long et qu'au fur et à mesure, tu enregistres ce que l'utilisateur a tapé. Claude va peut-être me dire : qu'est-ce qui se passe si l'utilisateur ferme l'app au milieu du flow ? Est-ce qu'on enregistre les infos ou pas ? Ça change complètement l'expérience."

    Le résultat

    Des specs beaucoup plus clean, beaucoup plus tôt. "Ça me fait gagner quatre-vingts pour cent du temps que je devrais passer avec les devs à refine les petits détails."

    Les limites reconnues

    "Ça ne remplace pas la collaboration avec un dev, qui est hyper importante. Ce qui est important dans l'échange design-dev, ce n'est pas juste que le résultat est plus qualitatif, c'est aussi que la cohésion d'équipe, c'est important." Trois choses perdues au passage : le relationnel design-dev, la sérendipité dans les échanges, et les workshops collaboratifs. "Donc il faut adapter le process à ce qu'on a envie d'avoir dans sa boîte."

    7. Trois postures, trois résultats différents

    Floran a traversé trois phases successives sur ses projets personnels, qui illustrent les différentes postures possibles face au code.

    Phase 1 : apprendre avec l'IA comme tuteur

    Il a utilisé ChatGPT pour lui expliquer comment faire son code, en continuant à coder lui-même. "J'avais peur que l'IA écrive à ma place — c'est une peur assez légitime." Résultat : bonne maîtrise, mais plus lent.

    Phase 2 : déléguer le futile

    Il a installé Cursor et commencé à lui déléguer des choses qu'il savait déjà faire, ou des choses qu'il ne voulait pas comprendre à l'instant T (le backend, notamment). "Je savais déjà le faire, donc peu importe si c'est l'IA qui le fait."

    Phase 3 : lâcher prise

    Avec Claude Code, il a laissé l'IA coder entièrement une app mobile, sans chercher à comprendre. "En trois prompts, il m'avait fait un truc super quali." Conséquence : sur ce projet en React Native, "c'est une boîte noire totale et je suis dépendant de Claude. Je ne peux même pas modifier une ligne."

    Pas de réponse universelle

    Dans une grosse boîte où tout est siloté, rester dans la posture traditionnelle du designer (research, design, utiliser l'IA pour augmenter ses capacités) est pertinent. En startup, vibe-coder avec l'IA est cohérent avec la vélocité attendue.

    Le minimum à savoir

    "Je pense qu'il faut à minima garder la force mentale d'apprendre. Et apprendre au moins les basiques du code — les concepts, l'algorithmie, ce qu'on appelle la coding littératie. Comprendre comment un code fonctionne, les conditions, les logiques. Apprendre comment fonctionne GitHub aussi — ce que c'est qu'une branche, une pull request. Ça, c'est la base."

    Sur le rapport learning / IA

    "L'IA amplifie ce qu'on comprend déjà. Si tu as une meilleure compréhension, tu peux challenger l'IA et tu as de meilleurs outputs. Si tu ne comprends pas ce que tu fais, l'IA va faire. Tu n'es pas en capacité de challenger."

    Sur le vibe-coding en équipe

    "Quand les designers commencent à vibe coder, il y a des devs qui n'aiment pas trop ça. Je pense qu'il faut accepter que le code ne sera pas parfait quand il est fait par le designer. Il fera des erreurs, il apprendra, il aura de meilleurs réflexes la fois d'après. Et les PR sont là pour ça."

    "L'IA amplifie sur tout ce qu'on comprend déjà. Donc si tu as une meilleure compréhension, tu peux challenger l'IA et tu as des meilleurs outputs. Si tu ne comprends pas ce que tu fais, ça ne veut pas dire que ça ne marchera pas, mais ça va être plus de travail pour les devs dans la PR."

    Floran, Senior Product Designer, Bitstack

    8. Replay du live

    Vous recrutez ce profil ?

    TPC vous accompagne pour trouver des profils adaptés à vos besoins.

    Découvrez aussi notre pôle Design et son accompagnement dédié.