Méthode
Expertises
- Recherche utilisateur
Entretiens, tests modérés et synthèses actionnables pour décider avec des faits, pas des opinions.
Lire la section - UI & design system
Interfaces soignées, composants documentés et cohérence visuelle sur le long terme.
Lire la section - Développement front
Intégration moderne, performance et maintenabilité — du prototype à la prod.
Lire la section - Lois UX & bonnes pratiques
Loi de Fitts, Hick, Miller, loi de Jakob, proximité (Gestalt), heuristiques de Nielsen — appliquées concrètement en UI et en front.
Lire la section
Recherche utilisateur
Exemple interactif
Trois façons d’avoir des réponses — selon ce que vous voulez savoir
| Méthode | Ce qu’on observe | Ce qu’on obtient à la fin |
|---|---|---|
| Discussion guidée avec des utilisateurs | Ce qui les motive, les mots qu’ils emploient, leur quotidien | Phrases reprises telles quelles, thèmes qui reviennent |
| Test : on regarde quelqu’un utiliser le produit | Est-ce qu’il arrive au bout ? combien de temps ? où il hésite | Liste des endroits où ça bloque, extraits vidéo si besoin |
| Revue par une grille de bon sens (checklist) | Écart par rapport aux habitudes du web (navigation, formulaires…) | Liste de corrections classée du plus urgent au moins urgent |
Passez la souris sur une ligne pour la surligner. En pratique, on combine souvent au moins deux de ces approches selon l’avancement du projet.
Je combine entretiens semi-directifs, observation de tâches et tests d’utilisabilité modérés selon vos objectifs (validation d’un parcours, priorisation d’une roadmap, préparation d’une refonte).
Chaque phase se termine par une synthèse lisible par produit, marketing et tech : citations anonymisées, schémas de parcours et recommandations priorisées (impact / effort).
Pas de recherche pour la recherche : on définit ensemble les questions auxquelles il faut répondre et le niveau de preuve suffisant avant de mobiliser des participants.
UI & design system
Exemple interactif
Sur un téléphone fictif : les boutons apparaissent un par un, toujours dans le même style
Même famille de boutons
L’idée : sur tout le site, un bouton « important » a toujours la même allure, les mêmes marges — comme une recette de cuisine partagée par toute l’équipe, designers et développeurs compris.
Du sprint UI ponctuel à la structuration d’un design system, l’objectif est le même : des écrans qui servent vos utilisateurs et une bibliothèque que les équipes peuvent réellement réemployer.
Je travaille avec des tokens sémantiques, des variantes de composants explicites (états, tailles, thèmes) et une documentation qui relie intention design et contraintes techniques.
Le handoff vers le front inclut les comportements attendus (focus, responsive, animations légères) pour éviter les interprétations coûteuses en intégration.
Développement front
Exemple interactif
Vitesse ressentie : la page se remplit, puis on peut cliquer sans que le texte bouge
Exemple simplifié (ce n’est pas une mesure réelle de votre site)
Quand la page « saute » sous vos yeux
Imaginez que vous lisez ce paragraphe. Si une image ou une bannière publicitaire arrive après coup tout en haut, le texte descend d’un coup : c’est frustrant et on peut même cliquer à côté sans le vouloir.
Appuyez sur le bouton pour voir la différence. En création de site, on peut éviter ce genre de saut en prévoyant la place de la pub ou de l’image à l’avance, au lieu de la coller quand elle arrive du serveur.
J’intègre des interfaces en m’appuyant sur votre stack (React, Next.js, etc.) avec une attention aux performances perçues, à la stabilité visuelle et aux usages clavier / lecteurs d’écran lorsque le périmètre l’exige.
Les composants sont découpés pour coller au design system : props claires, tests visuels ou Storybook lorsque c’est pertinent, et revues avec vos devs en interne.
Je documente les zones sensibles (API, règles métier, dette connue) pour que la suite du projet soit plus claire à reprendre, y compris par une autre personne.
Lois UX & bonnes pratiques
Exemple interactif
Quatre repères classiques en UX — le tableau ci-dessus est complété par deux illustrations
| Nom (référence) | En clair | Sur votre site, ça donne quoi ? |
|---|---|---|
| Fitts | Plus un bouton est gros et proche du curseur, plus il est facile et rapide à viser | Mettre les actions importantes en grand et près les unes des autres |
| Hick | Plus il y a de choix à la fois, plus le cerveau met de temps à décider | Éviter les menus géants : montrer moins d’options à chaque étape |
| Miller | On retient difficilement plus d’une poignée d’éléments en même temps dans la tête | Découper en petites étapes, titres clairs, listes pas trop longues |
| Jakob | Les gens aiment retrouver ce qu’ils ont l’habitude de voir ailleurs (panier, menu…) | Ne pas réinventer la roue : s’inspirer des sites qu’ils connaissent déjà |
Loi de Hick — illustration : même tâche, densité de choix différente
Hick relie le nombre d’alternatives au temps de décision : ici, six actions concurrentes au même niveau augmentent la charge avant le clic — le principe vaut surtout quand les options se valent visuellement.
Loi de Fitts — distance et taille de la cible (schéma animé)
Fitts modélise le temps pour atteindre une cible en fonction de sa taille et de la distance à parcourir : la grande zone à gauche est acquise plus vite que la petite à droite. En conception, on en déduit des choix de dimensionnement et de placement pour les actions critiques — sans confondre avec la seule « taille du bouton » : le contexte (où part l’utilisateur, ce qu’il fait juste avant) compte autant.
La loi de Fitts guide le placement et la taille des cibles (boutons, zones tactiles, éléments cliquables) : moins de distance, plus de surface utile, moins d’erreurs. La loi de Hick rappelle qu’augmenter le nombre de choix ralentit la décision — je l’utilise pour simplifier menus, formulaires et parcours. La loi de Miller et le chunking structurent l’information en blocs mémorisables : titres, listes, étapes numérotées, regroupements visuels cohérents.
La loi de Jakob (« les utilisateurs préfèrent votre site à ce qu’ils connaissent déjà ») évite les innovations gratuites sur les patterns établis (navigation, panier, recherche). Les principes de Gestalt — proximité, similarité, continuité — servent à hiérarchiser sans surcharger. Côté développement, la loi de réponse dans les ~400 ms (seuil de Doherty) et la stabilité du layout (limiter le Cumulative Layout Shift) renforcent la sensation de contrôle.
En mission, je relie ces repères aux heuristiques de Nielsen, aux checklists produit et au contexte métier : priorisation (impact / effort), revue d’écrans ou audit rapide, et ateliers pour aligner design, marketing et tech sur un langage commun — sans remplacer la recherche utilisateur quand il faut des preuves terrain.
Parler de votre contexte
Un cas qui mélange plusieurs de ces blocs ? Écrivez-moi par e-mail avec un lien vers le produit ou une brève description du besoin : ouvrir votre messagerie.