Aller au contenu
Manuel García-Llera Añón / Product Designer · Design EngineerContact

Démarche

Ma façon de travailler, étape par étape.

Je travaille avec méthode pour qu’une intuition puisse être expliquée, testée et améliorée sans perdre sa dimension humaine.

Je ne suis pas ces étapes comme une recette figée. Je les utilise pour libérer mon attention : lorsque le répétitif est structuré, je peux consacrer plus de temps à écouter, interpréter et prendre les décisions qui changent réellement le produit.

Chaque étape laisse des éléments probants et une justification. Je peux ainsi discuter du travail avec d’autres personnes, le reprendre plusieurs mois après et reconnaître honnêtement ce que nous savons, ce que nous supposons et ce qui reste à vérifier.

Les six étapes

01

Cadrage

Définir le problème, le public et la contrainte réelle avant de dessiner quoi que ce soit.

Décisions humaines
Le problème, le périmètre, les critères de réussite et ce qui en est exclu.
Appui de l’IA
Recueil du contexte et synthèse des documents existants.
Éléments probants
Un énoncé du problème et des critères d’acceptation écrits.

02

Recherche

Confronter mes premières impressions au contexte et aux besoins des personnes.

Décisions humaines
Ce que je dois apprendre, avec qui le confronter et quelle technique de recherche UX peut m’aider.
Appui de l’IA
Préparation de guides d’entretien et organisation de documents autorisés, avec vérification des sources. Cela ne remplace pas les participants humains.
Éléments probants
Questions, méthode choisie et constats reliés à leur origine. Je distingue observations, interprétations et hypothèses encore à tester.

03

Système

Définir une base de typographie, de couleurs, d’espacement et de composants qui reste maintenable en grandissant.

Décisions humaines
Direction artistique, hiérarchie, échelle typographique et caractère du mouvement.
Appui de l’IA
Mise en place des variables et des états des composants, vérification des contrastes.
Éléments probants
Une collection de tokens et de composants dont tous les états sont définis.

04

Prototype

Des écrans assemblés à partir d’instances du système, navigables dès le premier jour.

Décisions humaines
Composition, parcours et éléments à tester avant de programmer.
Appui de l’IA
Assemblage des variantes, adaptation aux tailles d’écran et documentation des états.
Éléments probants
Un prototype navigable qui s’adapte aux tailles d’écran convenues.

05

Transmission

Maintenir un lien reconnaissable entre les composants Figma et leur implémentation.

Décisions humaines
Ce qui relève du contrat et ce qui est laissé à l’implémentation.
Appui de l’IA
Lecture structurée du design, génération de composants et tests.
Éléments probants
Des composants en code qui reflètent la hiérarchie du système de design.

06

Vérification

Tester le résultat dans le navigateur et examiner ce qu’un test automatique ne peut pas apprécier.

Décisions humaines
Le seuil de qualité acceptable et la dette à signaler.
Appui de l’IA
Tests, audit d’accessibilité et mesure des performances.
Éléments probants
Une suite de tests réussie, des contrastes validés et une comparaison entre design et navigateur.

La place de l’IA

Expliciter la frontière entre jugement et exécution.

Ce que décide la personne

Je définis le problème, les priorités et les critères de qualité. L’IA peut proposer des alternatives, mais il me revient d’évaluer leur pertinence pour l’utilisateur et d’assumer la décision prise.

Ce qu’exécute l’IA

Je l’utilise pour explorer des variantes, préparer des composants, relire du code et proposer des tests. Je lui donne un contexte et des limites précis, puis je compare le résultat au design et au comportement attendu.

Comment je garde le contrôle

Je consigne ce que chaque outil peut faire, ce qui demande mon accord et comment je vérifierai le résultat. Lorsqu’une décision est importante, je cherche une relecture indépendante et conserve la raison du changement.

Principes

Le système avant l’écran

Je souhaite qu’une bonne décision puisse être reproduite. Je relie donc les écrans à des composants, des états et des règles communs, et je revois le système lorsqu’un nouveau besoin apparaît.

Des preuves plutôt que des affirmations

J’essaie de montrer comment je suis arrivé au résultat : le prototype, les composants et les vérifications disponibles. J’explique aussi ce qui est en développement ou n’a pas encore été validé.

L’esthétique a une fonction

Je soigne la typographie, les espaces et le mouvement parce qu’ils influencent la compréhension de l’interface. Si un effet distrait ou qu’une composition gêne la lecture, je revois ma décision même si elle me plaît visuellement.

Élaguer ce qui n’aide pas

J’adapte la méthode au problème. Je documente ce qui facilite le travail et l’apprentissage, sans ajouter d’étapes dont l’équipe n’a pas besoin.

Voir la mise en pratique

Dans chaque étude de cas, j’explique ce que j’ai pu appliquer, les décisions que j’ai prises et ce qui reste à vérifier.

Explorer les études de cas