# Ingénieur design front-end — Design d'interface en code assisté par IA URL: https://indiecrafts.dev/fr Ingénieur design front-end freelance dans les Alpes françaises — UX design, UI design, design produit et design systems. Je conçois et développe sites et interfaces numériques directement en code, accéléré par l'IA. - **Eyebrow**: Template piloté par la configuration ### Livrez des sites clients en un week-end Une base Next.js modulaire avec i18n, SEO, accessibilité et Tailwind — modifiez la config, pas le code. ## Blocks #### L'Atelier Web Des Alpes - **Location**: Grenoble, Annecy, Genève #### La génération directe d'interface avec un pilotage expert de l'IA J'utilise mes sens créatif et critique pour itérer avec un agent IA : comme si je le faisais à la main, en plus rapide. Ce temps gagné est réinvesti dans les finitions de vos projets. #### Steps ###### 1. Cadrer, puis prototyper Nous validons vos objectifs et la complexité technique. Je structure ensuite rapidement un prototype fonctionnel sur la base de nos échanges et vos contenus, en évitant la phase de maquette. ###### 2. Itérer rapidement Vous réagissez à un prototype interactif, consultable en ligne. Après chaque itération, la logique des parcours, l'architecture de l'information et le ressenti s'améliorent, jusqu'à validation de la structure. ###### 3. Styliser et optimiser L'image de marque, le design et les interactions sont peaufinés sur une structure solide et cohérente pour une conversion maximale. On optimise également vitesse, SEO, accessibilité avant la mise en ligne. #### Illustrations - **Project**: Aura Website - **Task1**: Présentation de l'activité - **Task2**: Une image moderne - **Task3**: Devis en ligne - **Task4**: Chargement rapide - **Task5**: Optimisé pour le SEO - **Feedback1**: J'adore la structure 🔥 - **Feedback2**: On peut accentuer un peu le "Devis Gratuit" ? - **Brand**: Aura - **Nav1**: Offres - **Nav2**: Tarifs - **Nav3**: Clients - **Nav Cta**: Essayer - **Badge**: Rapport Tendances 2026 - **Headline**: Le savoir-faire BigTech, désormais le vôtre - **Subhead**: Les compétences, les standards et la finition BigTech — transmis à votre équipe. - **Cta**: Devis gratuit - **Cta Secondary**: Démo - **Feature1**: Automatisation - **Feature2**: Cloud - **Feature3**: Design produit - **Feature4**: Data & IA - **Feature Desc1**: Les tâches répétitives gérées de bout en bout. - **Feature Desc2**: Une infrastructure évolutive et sécurisée. - **Feature Desc3**: Des interfaces que vos clients adorent utiliser. - **Feature Desc4**: Transformez vos données en décisions, avec l'IA. - **Audit Seo**: Référencement - **Audit Performance**: Performance - **Audit Accessibility**: Accessibilité #### Les questions qu'on me pose le plus. Comment je travaille, avec quels outils, et à quoi ressemble un projet — la version courte. #### Items ##### Q1 - **Q**: Qu'est-ce qu'un « ingénieur design front-end », exactement ? - **A**: Un profil hybride, à la frontière du design et du développement front-end, souvent décrit comme un « designer qui code » ou un « UX Unicorn ». ##### Q2 - **Q**: Vous parlez d'IA — qui fait réellement le travail ? - **A**: Moi. J'utilise l'IA comme un outil, pas comme un pilote automatique : je garde le sens créatif et le regard critique, je dirige et corrige chaque itération. ##### Q3 - **Q**: Comment se déroule un projet ? - **A**: Trois temps : cadrage et prototype directement en code (sans maquette), itérations sur un prototype interactif en ligne, puis stylisation et optimisation (vitesse, SEO, accessibilité). ##### Q4 - **Q**: Prenez-vous le projet en entier, ou travaillez-vous avec mon équipe ? - **A**: Les deux, en fonction de sa complexité. Je mène des projets de bout en bout, ou j'interviens en binôme avec vos développeurs et votre équipe produit. ##### Q5 - **Q**: Combien coûte un projet, et comment facturez-vous ? - **A**: Chaque projet est chiffré individuellement, après un court échange, selon le travail, sa complexité et votre calendrier. ##### Q6 - **Q**: Où êtes-vous basé, et travaillez-vous à distance ? - **A**: Je suis basé dans les Alpes françaises et je travaille à distance partout en France et en Suisse — et peux me déplacer sur site à la demande. #### Dites-moi ce que vous souhaitez construire. - **Intro**: Un court message suffit — la nature du projet, l'objectif visé, et le timing. Je réponds sous deux jours ouvrés avec quelques questions et un créneau pour un appel de 30 minutes. - **Linkedin Label**: Me contacter sur LinkedIn ##### Name - **Label**: Votre Nom - **Placeholder**: Votre nom ##### Email - **Label**: Votre Email - **Placeholder**: vous@exemple.com ##### Message - **Label**: Votre brief - **Placeholder**: Que prévoyez-vous ? Scope, budget et timing — et le meilleur moyen de vous joindre. - **Submit**: Envoyer le brief - **Sent**: Message envoyé — merci, je reviens vers vous rapidement. - **Error**: L'envoi a échoué. Réessayez ou écrivez-moi directement. #### Ils ont fait confiance à Indiecrafts. Un grand merci aux équipes et aux dirigeants qui m'ont accordé leur confiance et fait progresser professionnellement. #### Items - **Text**: Son approche du design incluant le code très tôt dans le processus s'est parfaitement intégrée à notre workflow Agile, il a permis d'améliorer la qualité des livrables sans ralentir la cadence. Sa compréhension des objectifs métiers a permis de livrer des solutions haut de gamme qui ont satisfait nos utilisateurs. ###### Julien Laure ###### Partner @ Theodo - **Text**: Si vous cherchez quelqu'un capable de développer et faire évoluer votre système de design tout en parlant le langage de votre équipe d'ingénierie, contactez Thibault. Bien qu'il ait travaillé comme prestataire, j'ai particulièrement apprécié sa capacité à piloter son travail de manière autonome. ###### Robert Kortenoeven ###### Design Leader, Miro, ex-Zalando - **Text**: Thibault a fait un travail formidable pendant les 4 dernières années à BNPP CIB. De l'idéation à la production, ses connaissances, son savoir-faire et son expertise ont permis de créer rapidement des produits et services bien conçus, actuellement utilisés par des milliers d'utilisateurs au quotidien. ###### Julien Veybel ###### Executive Leader · BNP Paribas CIB #### Pour ceux qui désirent un expert autonome et efficace. Les petites structures apprécient mon ingéniosité et mes solutions accessibles ; les porteurs de projets ambitieux, ma vitesse et mon expérience. #### Items ###### Les nouvelles entreprises et associations qui veulent une première vitrine performante. Vous démarrez et chaque semaine compte. Je livre vite un site clair et crédible, facile à mettre à jour vous-même, de l'idée à la mise en ligne en quelques semaines. Créé avec des outils modernes que vos équipes sauront maîtriser. ###### Indépendants qui ont besoin d'une vitrine d'activité professionnelle Votre prochain client est souvent déjà à moitié convaincu par une recommandation — le site doit juste le garder. Je crée une vitrine qui donne à votre activité l'image d'une structure établie et de confiance et crée une marque personnelle qui vous ressemble, facile à maintenir et à faire évoluer. ###### Équipes qui lancent un événement, un festival, un produit Des expériences en ligne qui donnent envie de réserver. Formé au motion design, à la 3D et concevant de manière interactive, je livre un site événementiel vivant, soigné avec réservation en ligne — des expériences riches, graphiques, animées et mobiles pour plus de conversion. ###### Entreprises et associations qui vendent en ligne Vous voulez vendre des produits ou collecter des dons, et éviter la lourdeur d'un Shopify ou WooCommerce. Je construis des boutiques légères et sur-mesure qui vous aideront à convertir, sur mobile notamment. Rapides et économiques à faire tourner avec des solutions serverless et headless. ###### Équipes qui veulent moderniser un produit numérique existant En préservant l'existant, je migre votre produit vers des technologies modernes et performantes afin de gagner en termes d'image, d'expérience mobile, d'accessibilité et de vitesse de chargement. ###### Équipes techniques qui ont besoin de design d'interface directement en code Renfort design senior pour des produits complexes, tableaux de bord, applications internes ou prototypes pour levée de fonds. Design et développement ultra-rapides en Next.js, Shadcn/ui servant de démo fonctionnelle et de base technique pour vos développeurs en interne. #### Réalisations récentes. Un aperçu des sites internet et interfaces applicatives que j'ai conçus et développés récemment. - **Nda Note**: NDA · image d'illustration - **See More**: Voir plus - **See Less**: Voir moins #### Items ###### Siemens AG ###### Cinélangues ###### Yak Architecture ###### La Grange aux Skis #### Les expériences qui ont marqué mon parcours technique et créatif. Une sélection de missions qui m'ont poussé à grandir techniquement, à m'adapter et à apprendre sans cesse. - **Nda Note**: NDA · image d'illustration #### Items ###### Fondateur & Développeur - **Meta**: Déc 2024 — aujourd'hui · Europe Wahio.design, mon projet personnel full-stack — j'y explore les derniers outils de génération de designs web, l'IA générative, le Vibe Coding et l'infrastructure Edge. Ce projet m'a servi à perfectionner et valider mes récents acquis en termes de processus de production assistés par l'IA. Conçu et développé en solo, de bout en bout. Le service transforme une idée en vêtement : décrivez simplement votre idée et un pipeline génératif, avec 200 styles graphiques et 400 thématiques, produit un visuel unique imprimable sur une trentaine de produits — imprimé en Europe et livré en quelques jours. ###### Design & Développement indépendant - **Meta**: 2012 — aujourd'hui · Alpes françaises, Remote Freelance indépendant depuis 15 ans et formé à l'ingénierie de l'image et du web, j'interviens en conseil, design et développement d'interfaces et de produits numériques complets. Mon expertise se concentre en particulier sur les enjeux de design front-end. Je réalise des produits numériques complètement ou partiellement, en binôme avec vos équipes. Au fil des années, j'ai travaillé avec des organisations de toutes natures — BNP Paribas IP et BNP Paribas CIB, Groupe BNP Paribas, L'Institut Français, SeLoger, Vente Privée, Theodo, le Conseil Régional du Lot-et-Garonne, ainsi qu'avec de plus petites structures et associations, avec le même plaisir. ###### Design Systems & Design Operations - **Meta**: Fév 2024 — Sep 2024 · Munich, DE Siemens est un conglomérat mondial présent dans l'industrie, l'énergie, la santé et les infrastructures, dans plus de 200 pays — avec une douzaine de systèmes de design construits en interne et des centaines de designers. J'ai proposé des solutions pour optimiser la gestion des systèmes de design et le partage de connaissances entre de nombreuses équipes. J'ai proposé différents scénarios pour l'évolution des systèmes de design internes, ainsi que des solutions pour rapprocher les équipes design faisant face aux mêmes problématiques, permettant ainsi la mise en place de pratiques communes et standardisées. ###### Design Systems & Design de Produits - **Meta**: Août 2022 — Fév 2024 · Paris, FR / London, UK Shipfix est une plateforme de données et processus métier, dopée à l'IA, dans le secteur du fret maritime — elle transforme la surcharge d'e-mails de commandes quotidienne en une vue de marché puissante pour les armateurs, traders et courtiers. J'ai optimisé le système de design produit en y intégrant le langage de marque et les éléments mobiles. Un inventaire plus clair, une restructuration complète des bibliothèques dans Figma et l'introduction d'une classification des composants par domaine métier ont permis un workflow plus rapide et des mises à jour de fichiers plus sûres — j'ai aussi accompagné l'équipe produit sur des projets design stratégiques. ###### zDirect — Design System Manager - **Meta**: Juin 2021 — Avr 2022 · Berlin, DE Zalando est le premier acteur européen de la mode en e-commerce ; zDirect est la porte d'entrée des marques partenaires qui y vendent directement. J'ai optimisé le système de design de la marketplace zDirect pour la performance et l'utilisabilité, au service des équipes comme des partenaires. J'ai accompagné une équipe de 20 designers et une équipe UI de 10 développeurs, en optimisant les passations entre les équipes design et développement et en mettant en place un process agile dual-track. J'ai amélioré la documentation avec des exemples prêts à l'emploi, fluidifié la publication des composants, et optimisé la bibliothèque Figma — structure, auto-layout et dépréciation. ###### Digital Marketplace — Design System Engineer - **Meta**: Juil 2015 — Juil 2019 · 4 ans 1 mois · Paris, FR Le Digital Marketplace est la plateforme unifiée de BNP CIB pour sélectionner, commander, livrer et superviser produits cloud et services métier — un hub collaboratif pour l'offre numérique de la banque. L'équipe technique s'est classée 2ᵉ aux Banking Technology Awards 2018. J'en ai construit le système de design atomique en ReactJS et Styled Components, en collaboration avec 20 développeurs front-end et 50 experts métier — documenté dans Storybook, avec des contraintes structurelles pour une construction standardisée et rapide, limitant la dette technique. Sprints de design et prototypage itératif rapide, jusqu'au refactoring complet de l'interface. ###### Design de produit en code - **Meta**: Sep 2012 — Juil 2015 · Paris, FR Le groupe Theodo, en pleine expansion, est dédié au développement de produits numériques complexes. J'ai apporté mon expertise design aux équipes techniques avec la méthode du Design Thinking appliqué aux méthodes Agile / Lean, notamment pour BNP IP, Safran et Dassault Systèmes. La méthode de production, extrêmement rapide, reposait sur des itérations courtes : prototypes interactifs et design produit itératif en cycle court, en lien étroit avec des développeurs aguerris et des product owners sur des projets aux contraintes exigeantes. Livraison des designs réalisés sous forme de merge requests. ###### Aviation Civile — Design en Code - **Meta**: 2013 · via Theodo · Paris, FR Participation à la conception et au développement d'une interface d'analyse de données de vol en temps réel, dans le secteur de l'aviation civile. Cassiopé transforme la donnée brute enregistrée en information exploitable — cartes, courbes, rejeu de trajectoire 3D et suivi en temps réel. Le travail s'est fait directement en code avec l'équipe de 10 développeurs de Theodo — améliorations livrées via Git et méthode Agile. Production en HTML, CSS et JavaScript et méthode d'améliorations rapides et successives de prototypes, constamment ajustés avec les retours métiers et respectant les contraintes techniques. ###### Support Avionique — Design en Code - **Meta**: 2014–2015 · via Theodo · Paris, FR Participation à la conception et au développement de l'interface de support automatique avionique de Safran, dans le secteur militaire et défense. Ce système de support automatique couvre les casques pilotes, le calcul embarqué et les dispositifs connectés. Même cadre que pour Cassiopé : un flux de design en code avec Theodo, des itérations rapides en amélioration continue, livrées via Git au sein d'une équipe agile de 10 développeurs, en HTML, CSS et JavaScript. ###### Co-fondateur & Designer numérique - **Meta**: 2009 — 2012 · Paris, FR Co-fondateur et designer numérique de Spin Interactive, une agence digitale parisienne qui conçoit des sites et des expériences interactives pour de grands médias et marques. Réalisation de plateformes éditoriales sur-mesure, d'outils de publication, de campagnes multi-canaux et de sites de marque. Nous avons conçu et réalisé des produits numériques pour des clients comme TV5 Monde, Le Monde, France 24, Canal+, Arte, Le Coq Sportif et Siaci Saint Honoré. ###### Designer Motion/3D - **Meta**: 2009 · Apprentissage · Los Angeles, CA Fisheggs crée des systèmes visuels à fort impact pour la télévision, le streaming et les marques — alliant des décennies de savoir-faire à un workflow moderne, axé sur l'exploration, qui offre clarté, rapidité et une créativité qui se démarque. Mise en pratique réelle de techniques avancées de 3D et de compositing numérique pour les médias américains. Réalisation de planches de concepts, réalisation de scènes 3D animées et compositing final. Déclinaison en différents formats et langues pour la diffusion TV et les habillages de plateaux de tournage. - **Text**: Expert en design numérique et systèmes de design, je conçois directement en code des sites internet et des interfaces modernes. Je met en place des solutions intelligentes qui apportent un vrai gain d'image et de performance en ligne aux entreprises et associations. #### Thibault Montaufray #### Ingénieur Front-end Design · 27 ans de Web Design - **Linkedin Label**: LinkedIn #### Des fondations sûres, qui s'adapteront à vos besoins Des outils modernes, éprouvés et l'IA, sous mon contrôle expert, pour accélérer la construction et la qualité du langage graphique. #### Items ###### React La bibliothèque d'interface la plus adoptée, avec un immense écosystème et vivier de talents. ###### Next.js Des pages rapides et bien référencées, sur une base solide portée par une forte communauté. ###### TypeScript Du code typé qui détecte les bugs tôt, pour moins de régressions et des évolutions plus sûres. ###### Sanity Studio Un studio de contenu flexible où votre équipe met à jour le contenu sans jamais toucher au code. ###### Shadcn/ui Des composants d'interface accessibles et personnalisables pour un rendu cohérent et soigné. ###### Storybook Une large bibliothèque de composants réutilisables sur laquelle votre équipe peut bâtir à la demande. ###### Netlify Un hébergement performant et fiable, avec des déploiements instantanés et un coût quasi nul. ###### Claude Code L'assistant IA de ma chaîne d'outils, moderne et performant, toujours sous mon contrôle. #### Du design moderne qui convertit. Du code moderne qui dure. Mon expertise me permet de livrer rapidement des produits efficaces, modernes et faciles à utiliser. En fonction des besoins, je peux tout prendre en charge, seul ou avec vos équipes. #### Items ###### Des sites internet qui aident vraiment votre activité Sites d'entreprise, refontes de marque, pages d'événement, portfolios, boutiques en ligne simples. Beaux, rapides et faciles à utiliser sur mobile — pensés pour faire bonne impression et transformer les visiteurs en clients. ###### Mentions ###### Optimisé SEO & SAIO Pensé pour être bien classé sur Google et visible dans les moteurs IA. ###### Haut niveau d'accessibilité Construit avec des composants accessibles par défaut. ###### Facile à mettre à jour Modifiez votre contenu vous-même — sans code ni développeur. ###### Des interfaces soignées pour des produits complexes Les tableaux de bord où votre équipe ou vos clients se connectent chaque jour. Je facilite des processus métiers complexes et la productivité grâce à des interfaces numériques bien conçues, en binôme avec votre équipe pour le back-end. ###### Mentions ###### Interactivité et données denses Tableaux de bord vivants et écrans à forte densité d'information. ###### Codée directement Construit avec vos données, temps de développement accéléré. ###### Des expériences fluides Plus d'efficacité et moins de friction pour des actions rapides. ###### Un système de design pour des réalisations ultra-rapides. Un processus de création moderne couplé à une librairie personnelle, issue de mon expérience en design system et en design produit. Une construction accélérée pour dégager plus de temps sur le rendu final. ###### Mentions ###### Qualité et flexibilité Niveau de réalisation et possibilités de changements élevés. ###### Transférable à vos équipes À la demande, cette librairie et cette méthode peuvent vous être transmises. ###### Compatible Vibe Coding Pensé pour fonctionner avec des workflows de code assistés par l'IA. #### Réseau logistique Routes nationales #### Stats - **Hubs**: Hubs - **Active**: Actives - **Delayed**: Retardées #### Groups - **Transport Mode**: Mode de transport - **Status**: Statut - **Region**: Région #### Modes - **Air**: Aérien - **Air Freight**: Fret aérien - **Ground**: Routier #### Statuses - **Active**: Active - **Delayed**: Retardée #### Regions - **West**: Ouest - **Midwest**: Midwest - **South**: Sud - **Northeast**: Nord-Est #### Region Icons - **West**: O - **Midwest**: MW - **South**: S - **Northeast**: NE #### Summary - **Label**: Résumé - **Shipments**: Colis - **Routes**: Routes #### Legend - **Hub**: Hub #### Tooltip - **Shipments**: {count} colis