
Portfolio UX UI Designer : Exemples, Structure et Preuves qui Convainquent
Un guide concret pour construire un portfolio UX UI designer crédible, orienté étude de cas, impact métier et conversion.
L'UX (User Experience) optimise le parcours et la satisfaction de l'utilisateur sur un produit numérique. L'UI (User Interface) conçoit l'interface visuelle, couleurs, boutons, typographie, qui rend ce parcours intuitif. Ensemble, ces deux disciplines transforment un simple site en machine à conversions.
L'UX désigne l'expérience globale d'un utilisateur sur un produit numérique, tandis que l'UI concerne la couche visuelle et interactive de ce produit. Selon Forrester Research (2024), chaque euro investi en UX génère 100 € de retour, un ROI de 9 900 %.
Pourtant, 70 % des PME françaises confondent encore ces deux disciplines et sous-investissent dans l'une ou l'autre. Si votre site affiche un taux de rebond supérieur à 55 %, le problème vient souvent d'un déséquilibre entre UX et UI. Comprendre cette différence vous permet d'allouer votre budget design là où il a le plus d'impact sur vos conversions et votre chiffre d'affaires.
9 900 %
ROI moyen de l'UX design (Forrester, 2024)
88 %
Des visiteurs ne reviennent pas après une mauvaise expérience (NNGroup, 2024)
38 %
Des utilisateurs quittent un site au design peu attractif (Adobe, 2024)
+200 %
Croissance des entreprises investissant en design (McKinsey, 2024)
L'UX Design englobe tout ce que ressent un visiteur lorsqu'il navigue sur votre site : fluidité du parcours, rapidité de chargement, facilité à trouver une information, satisfaction globale. Un UX designer mène des recherches utilisateurs, construit des wireframes et teste des prototypes avant la moindre ligne de code. Son objectif : supprimer chaque friction entre le visiteur et la conversion.
Selon NNGroup (2024), 88 % des utilisateurs ne reviennent jamais sur un site après une mauvaise expérience. Pour une PME, chaque visiteur perdu représente un prospect en moins. Un cabinet comptable de 8 salariés a investi 4 500 € dans un audit UX : le temps moyen de session est passé de 45 secondes à 3 min 20, et les demandes de devis ont augmenté de 120 % en 3 mois. Pour approfondir cet impact, consultez notre article sur l'importance de la refonte UX.
L'UI Design se concentre sur tout ce que l'utilisateur voit et touche à l'écran : palette de couleurs, typographie, boutons, icônes, animations et disposition des éléments. L'objectif d'un UI designer est de créer une interface esthétique, cohérente et alignée avec l'identité de marque tout en guidant le regard vers les actions clés.
Selon Adobe (2024), 38 % des visiteurs quittent un site dont le design est jugé peu attrayant. Le travail UI va au-delà de l'esthétique : chaque choix visuel, contraste d'un bouton CTA, taille d'une police, espacement entre les blocs, influence directement le taux de clic. Un design de site web professionnel réduit la charge cognitive du visiteur et renforce la crédibilité de votre marque dès les premières secondes.
UX vs UI : les 5 différences fondamentales entre les deux disciplines
| Critère | UX Design | UI Design |
|---|---|---|
| Focus | Expérience globale et parcours utilisateur | Interface visuelle et éléments graphiques |
| Objectif | Résoudre un problème utilisateur | Créer une interface attractive et fonctionnelle |
| Outils | Wireframes, user flows, prototypes, tests A/B | Maquettes HD, design systems, bibliothèques de composants |
| Livrables | Personas, parcours utilisateur, rapports de tests | Maquettes haute fidélité, guidelines visuelles, UI kit |
| Compétences clés | Recherche utilisateur, psychologie cognitive, architecture de l'information | Graphisme, typographie, théorie des couleurs, micro-interactions |

Les deux disciplines sont indissociables. Un site peut avoir une UX irréprochable, parcours logique, architecture claire, temps de chargement rapide, mais échouer sur l'UI avec des couleurs ternes et des boutons invisibles. À l'inverse, une interface visuellement magnifique ne sert à rien si le visiteur ne trouve pas ce qu'il cherche en moins de 3 clics.
Selon McKinsey (2024), les entreprises qui investissent simultanément en UX et UI surpassent leurs concurrents de 200 % en croissance de revenus. Pour améliorer votre taux de conversion, les deux disciplines doivent avancer main dans la main dès le début du projet. Un e-commerce de prêt-à-porter (12 salariés) a combiné audit UX et refonte UI : le taux de conversion est passé de 1,2 % à 3,8 % en 4 mois, soit une hausse de 217 %.
Le marché de l'emploi UX/UI en France reste dynamique en 2026. Selon le baromètre Hays (2025), la demande de profils UX/UI a progressé de 18 % en un an, portée par la digitalisation des PME et la montée en puissance des applications SaaS. Les grilles salariales varient fortement selon l'expérience, la localisation et le statut (CDI ou freelance).
Un UX/UI designer junior (0-2 ans) débute entre 32 000 € et 38 000 € brut annuel en province, et jusqu'à 42 000 € à Paris. Les profils confirmés (3-5 ans) atteignent 45 000 à 55 000 €, tandis que les seniors (7+ ans) négocient entre 58 000 € et 75 000 €, voire davantage pour des postes de Lead Designer ou Head of Design. En freelance, les tarifs journaliers s'échelonnent de 350 € (junior) à 900 € (expert spécialisé en product design), selon Malt (2025).
L'évolution de carrière est multiple : UX researcher, product designer, design manager, directeur de la création digitale ou encore consultant UX indépendant. Les certifications Google UX Design et NNGroup UX Certification renforcent l'employabilité et justifient des prétentions salariales supérieures de 10 à 15 % selon Glassdoor (2025).
Grille salariale UX/UI en France, 2025-2026 (sources : Hays, Glassdoor, Malt)
| Profil | Salaire CDI (brut/an) | TJM Freelance | Évolution courante |
|---|---|---|---|
| Junior (0-2 ans) | 32 000 – 42 000 € | 350 – 500 € | UX/UI Designer confirmé |
| Confirmé (3-5 ans) | 45 000 – 55 000 € | 500 – 700 € | Senior Designer / Lead |
| Senior (7+ ans) | 58 000 – 75 000 € | 700 – 900 € | Head of Design / Consultant |
Le choix des outils conditionne la productivité d'une équipe design. En 2026, l'écosystème s'est consolidé autour de quelques plateformes dominantes, mais les besoins diffèrent entre UX et UI. Selon le rapport State of UX Tools (UXTOOLS, 2025), Figma reste l'outil numéro 1 pour le design d'interface, utilisé par 82 % des designers interrogés, loin devant Sketch (9 %) et Adobe XD (4 %).
Côté UX, les outils de recherche utilisateur et de test prennent une place croissante. Hotjar permet d'analyser les heatmaps et les enregistrements de sessions pour identifier les frictions. Maze automatise les tests d'usabilité sur prototypes Figma, réduisant le temps de recrutement et d'analyse de 60 % (Maze, 2024). UserTesting donne accès à un panel de testeurs en 24 heures pour des retours vidéo qualitatifs.
Côté UI, Figma centralise maquettes de sites web, design systems et handoff développeur dans un seul outil collaboratif. Ses plugins IA (Magician, Automator) accélèrent la génération de variantes et l'auto-complétion de composants. Sketch reste prisé sur macOS pour sa légèreté, tandis qu'Adobe XD, bien que moins utilisé, s'intègre nativement avec la suite Creative Cloud. Le choix dépend de votre stack existante et de la taille de votre équipe.
Comparatif des outils UX et UI les plus utilisés en 2026 (source : UXTOOLS, 2025)
| Outil | Discipline | Usage principal | Prix (2026) |
|---|---|---|---|
| Figma | UI / UX | Maquettes, prototypes, design systems, collaboration | Gratuit (starter) / 15 €/mois pro |
| Sketch | UI | Maquettes macOS, bibliothèques de composants | 12 $/mois |
| Adobe XD | UI | Prototypage, intégration Creative Cloud | Inclus CC (24 €/mois) |
| Hotjar | UX | Heatmaps, enregistrements de sessions, feedback | Gratuit (basique) / 39 €/mois |
| Maze | UX | Tests d'usabilité automatisés sur prototypes | Gratuit (limité) / 99 $/mois |
| UserTesting | UX | Panel de testeurs, retours vidéo qualitatifs | Sur devis (≈ 15 000 $/an) |
Le paysage du design numérique évolue rapidement sous l'impulsion de l'intelligence artificielle et des nouvelles réglementations européennes. Selon le rapport Trends 2026 de Figma (2025), quatre tendances majeures redéfinissent la pratique du design UX/UI cette année.
L'IA générative intégrée au workflow design. Les outils comme Figma AI, Galileo AI et Relume génèrent des layouts, des textes et des variantes de composants en quelques secondes. Selon McKinsey (2025), les équipes design qui adoptent l'IA réduisent de 40 % le temps consacré aux tâches répétitives (création de variantes, redimensionnement, rédaction de placeholders). Cela libère du temps pour la recherche utilisateur et les tests, là où la valeur ajoutée humaine reste irremplaçable.
La régulation des dark patterns. Le Digital Services Act (DSA) européen, pleinement appliqué depuis 2024, interdit les interfaces trompeuses : cases pré-cochées, parcours de désabonnement labyrinthiques, faux compteurs d'urgence. Les amendes peuvent atteindre 6 % du chiffre d'affaires mondial. En 2026, le design éthique n'est plus un choix mais une obligation légale (Commission européenne, 2024).
Micro-interactions et motion design. Les animations subtiles, feedback de bouton, transitions de page, indicateurs de progression, améliorent la perception de fluidité et réduisent le taux d'erreur de 15 % selon NNGroup (2025). Les design systems intègrent désormais des tokens d'animation standardisés pour garantir la cohérence.
Design systems à grande échelle. Même les PME adoptent des design systems légers pour accélérer le développement et assurer la cohérence visuelle. Selon Sparkbox (2025), 72 % des entreprises de plus de 10 salariés disposent d'un design system, contre 45 % en 2022. Ces bibliothèques de composants réutilisables réduisent le temps de développement front-end de 30 à 50 %.
L'accessibilité numérique n'est plus une option en France : depuis 2024, la loi impose aux entreprises réalisant plus de 250 000 € de chiffre d'affaires annuel de rendre leurs sites conformes au RGAA (Référentiel Général d'Amélioration de l'Accessibilité), aligné sur les WCAG 2.2 niveau AA. Les sanctions peuvent atteindre 50 000 € par site non conforme (DINUM, 2024).
L'accessibilité impacte chaque décision UX et UI : contrastes de couleurs suffisants (ratio 4,5:1 minimum pour le texte), navigation entièrement utilisable au clavier, textes alternatifs sur les images, hiérarchie de titres cohérente et formulaires avec des labels explicites. Selon WebAIM (2025), 96 % des pages d'accueil analysées contiennent encore des erreurs d'accessibilité détectables automatiquement, ce qui représente à la fois un problème et une opportunité de différenciation.
Le design universel va au-delà de la conformité légale. Il bénéficie à tous les utilisateurs : les sous-titres aident dans les environnements bruyants, le contraste élevé facilite la lecture en plein soleil, la navigation au clavier accélère les power users. Selon Microsoft Inclusive Design (2024), concevoir pour les cas d'usage extrêmes améliore l'expérience de 100 % des utilisateurs. En intégrant l'accessibilité dès la phase UX (et non en correctif post-lancement), le surcoût est estimé à seulement 5-10 % du budget design initial, contre 25-40 % en retrofitting.
Menez des interviews, analysez vos données analytics et créez des personas. Selon Baymard Institute (2025), 70 % des abandons de panier s'expliquent par des frictions UX identifiables dès cette phase. Objectif : comprendre qui sont vos visiteurs et ce qu'ils attendent réellement.
Structurez le contenu et les parcours de navigation avec des wireframes basse fidélité. Chaque page doit répondre à une intention précise. Une arborescence de site web bien pensée réduit le nombre de clics entre l'arrivée et la conversion.
Transformez les wireframes en maquettes haute fidélité : couleurs, typographie, composants interactifs, micro-animations. Testez au moins 2 variantes de vos pages clés (héro, formulaire, page produit) pour identifier ce qui fonctionne le mieux.
Faites tester le prototype par 5 à 8 utilisateurs cibles. Selon NNGroup (2023), 5 testeurs suffisent pour détecter 85 % des problèmes d'usabilité. Enregistrez les sessions et identifiez les points de friction récurrents.
Corrigez les frictions identifiées, validez les performances techniques (Core Web Vitals, accessibilité RGAA) et déployez. Prévoyez un responsive design dès cette étape pour couvrir mobile et desktop. Planifiez un cycle de tests post-lancement à 30 et 90 jours.
Menez des interviews, analysez vos données analytics et créez des personas. Selon Baymard Institute (2025), 70 % des abandons de panier s'expliquent par des frictions UX identifiables dès cette phase. Objectif : comprendre qui sont vos visiteurs et ce qu'ils attendent réellement.
Structurez le contenu et les parcours de navigation avec des wireframes basse fidélité. Chaque page doit répondre à une intention précise. Une arborescence de site web bien pensée réduit le nombre de clics entre l'arrivée et la conversion.
Transformez les wireframes en maquettes haute fidélité : couleurs, typographie, composants interactifs, micro-animations. Testez au moins 2 variantes de vos pages clés (héro, formulaire, page produit) pour identifier ce qui fonctionne le mieux.
Faites tester le prototype par 5 à 8 utilisateurs cibles. Selon NNGroup (2023), 5 testeurs suffisent pour détecter 85 % des problèmes d'usabilité. Enregistrez les sessions et identifiez les points de friction récurrents.
Corrigez les frictions identifiées, validez les performances techniques (Core Web Vitals, accessibilité RGAA) et déployez. Prévoyez un responsive design dès cette étape pour couvrir mobile et desktop. Planifiez un cycle de tests post-lancement à 30 et 90 jours.
Vous pouvez travailler dans une équipe où UI et UX sont des disciplines séparées, mais les meilleurs produits naissent quand les deux collaborent dès le premier jour du projet.
Nous pensions que notre site était correct, mais l'audit UX/UI a révélé 23 points de friction. Après la refonte, nos demandes de devis ont triplé en 2 mois et le taux de rebond a chuté de 34 points.
Marie Dubois
Directrice — Atelier du Web (15 salariés)
Nos experts analysent votre interface et conçoivent un parcours utilisateur qui convertit. Audit UX gratuit inclus pour chaque projet.
L'UX (User Experience) désigne l'expérience globale d'un utilisateur avec un produit numérique : fluidité du parcours, utilité, satisfaction. L'UI (User Interface) concerne l'interface visuelle : boutons, couleurs, typographie, mise en page. L'UX définit comment ça fonctionne, l'UI définit comment ça se présente. Les deux sont complémentaires et indispensables pour un site performant.
UI est l'acronyme de User Interface (interface utilisateur en français). Ce terme désigne tous les éléments visuels et interactifs par lesquels un utilisateur interagit avec un produit numérique : écrans, boutons, formulaires, menus, icônes et micro-animations. L'UI designer crée ces éléments pour guider le regard et faciliter l'action.
Oui. Selon Glassdoor (2025), un UX/UI designer en France gagne entre 35 000 € et 55 000 € brut annuel en CDI. Les profils seniors (7+ ans d'expérience) dépassent 65 000 €. En freelance, les tarifs journaliers oscillent entre 400 € et 800 € selon l'expertise et la localisation géographique.
Un designer UI junior touche environ 2 200 € net par mois en France. Avec 3 à 5 ans d'expérience, ce salaire monte à 2 800-3 500 € net/mois. À Paris, les rémunérations sont 15 à 20 % supérieures à la moyenne nationale (source : Hays, 2025).
Pour les PME, un profil UX/UI polyvalent suffit dans la majorité des cas. Selon Indeed (2025), 68 % des offres d'emploi en design numérique recherchent des profils combinés UX/UI. Séparer les rôles se justifie surtout pour les produits complexes : applications SaaS, plateformes avec plus de 50 écrans ou parcours multi-devices.
Le budget varie selon la complexité du projet : 3 000-8 000 € pour un site vitrine, 8 000-25 000 € pour un e-commerce, 15 000-50 000 € pour une application web. L'audit UX initial représente 10 à 15 % du budget total et permet d'identifier les quick wins à fort impact avant d'investir dans le design UI.

Un guide concret pour construire un portfolio UX UI designer crédible, orienté étude de cas, impact métier et conversion.

Le consultant UX analyse vos parcours utilisateurs, identifie les frictions et conçoit des interfaces qui convertissent. Découvrez ses missions, ses compétences clés et les tarifs pratiqués en 2026.

Tout savoir sur le métier d'UI designer : définition, différence avec l'UX, compétences requises, salaire par niveau d'expérience, outils indispensables et parcours de formation.
Réservez votre audit stratégique gratuit de 30 minutes.
On analyse votre site et on vous propose un plan d'action concret.