Le webdesigner
Son rôle
Un webdesigner est un designer spécialisé dans la création d’interfaces web (sites vitrines, applications, dashboards, e-commerces, SaaS, etc.).
Son travail consiste à imaginer et à concevoir l’apparence et l’expérience utilisateur d’un produit digital.
On peut distinguer deux grandes expertises principales dans ce domaine : l'UX design et l'UI design.
Un webdesigner peut décider de se spécialiser uniquement dans l’un ou l’autre. Mais souvent, ces deux domaines sont très liés, on parle alors de UX/UI design, tout simplement.
La finalité principale de son travail sera souvent la livraison d'une maquette. C’est-à-dire un livrable visuel et non fonctionnel du produit. J'y reviens plus tard.
Il existe d'autres types de profils : Motion designer, Designer d'interaction, etc. Même s'ils font aussi partie de la grande famille des webdesigner, je ne vais pas les aborder ici.
Revenons rapidement sur le rôle de l'UX et de l'UI designer :
L’UX Designer
L’UX Designer (User Experience) se concentre sur la structure et le fonctionnement de l’interface pour garantir une expérience utilisateur fluide, simple et intuitive.
Son travail inclut :
- Comprendre les besoins des utilisateurs et définir leurs parcours.
- Organiser les informations pour que la navigation soit claire et logique.
- Créer des wireframes ou prototypes pour valider l’ergonomie d’un produit.
- Tester des interfaces et analyser des données pour améliorer l’expérience.
L’objectif principal de l’UX Designer est de s’assurer que le produit ait une navigation simple, facile à utiliser, et qu'elle réponde efficacement aux attentes des utilisateurs.
L’UI Designer
L’UI Designer (User Interface) se concentre sur l’aspect esthétique et l’interaction visuelle de l’interface.
Son travail inclut :
- Définir ou respecter l’identité visuelle du produit (couleurs, typographies, icônes, illustrations).
- Travailler sur la mise en page et la hiérarchie des informations.
- Concevoir des designs adaptés aux différents formats d'écran.
- Imaginer des éléments interactifs (boutons, transitions, animations).
- Garantir la cohérence graphique à travers un design system.
L’objectif principal de l’UI Designer est de créer une interface visuellement attrayante et cohérente.
C'est quoi une maquette ?
Une maquette, c’est une représentation visuelle fictive d’un site ou d’une application.
J’ai un client, consultant digital, qui résume souvent ça en disant : “c’est du photoshop”.
Et c'est pas faux ! Même si c'est un peu plus subtil que ça.
Elle peut prendre différentes formes (wireframes, prototypes cliquables ou maquettes graphiques détaillées).
Parfois extrêmement réaliste (cliquable, voire animée), elle reste pourtant non fonctionnelle.
Qu'est-ce que j'entends par "non fonctionnelle" ?
- Un formulaire sur une maquette ne permet pas de soumettre de données.
- Les boutons ou animations ne fonctionnent pas comme sur un site en production.
- Les contenus peuvent être fictifs, etc.
C’est pour cette même raison que tout ce qui est produit en maquette n’est pas toujours facilement réalisable en code. Un design complexe ou mal pensé peut poser des problèmes lors de l’intégration ou du développement.
Un bon webdesigner réfléchit donc à la fois à l’esthétique, à l’expérience utilisateur, et aux contraintes techniques que ses collègues rencontreront ensuite. Sachant que le meilleur moyen de faire ça bien, c'est encore de travailler main dans la main avec l'équipe d'intégrateurs et de développeurs.
Tout ça pour dire, qu'une maquette n’est pas le produit final. En gros, ce n'est qu'un support de création pour travailler, tester et valider une idée et un idéal visuel à atteindre à un moment T. Parfois, des contraintes techniques obligeront à revoir certains choix par la suite.
On peut produire une maquette sans savoir coder ou avoir des bases en code. Mais c'est évidemment un énorme avantage pour collaborer efficacement avec les intégrateurs et développeurs. Sans parler de l'efficacité du webdesign qui sera forcément plus simple à intégrer et à optimiser ensuite.
Ce que vous pouvez demander au webdesigner
- Imaginer et tester l'utilisation et l'aspect d'interfaces web à travers des workshops et des maquettes.
- Construire et/ou faire évoluer un design system clair (typographies, couleurs, boutons, icônes) en accord avec le positionnement et l'image du client.
- Designer des éléments sous différents formats ou formes pour voir leurs comportements (ou de vous les décrire ou de vous donner des exemples).
- Optimiser la navigation et le parcours utilisateur.
- Réfléchir à des alternatives en cas de contraintes techniques.
- Donner des conseils esthétiques pour améliorer la perception visuelle d’un site.
Ce qui n’est pas de son ressort
- Rédiger ou choisir les contenus définitifs (texte, images, vidéos).
- Définir le positionnement, la stratégie marketing ou l'image de marque d'un projet
- Optimiser les performances techniques du site.
- Transformer la maquette en code fonctionnel (intégration ou développement).
Figma, Adobe XD, Sketch, Photoshop, Illustrator, Axure, Miro…
Bref, tout ce qui permet de visualiser, tester des interfaces et interagir avec les utilisateurs et les clients.
L’intégrateur web
Son rôle
L’intégrateur est celui qui transforme les maquettes en pages web interactives disponible en ligne grâce à du code (HTML, CSS et JavaScript).
En gros, il traduit visuellement les idées du designer en lignes de code. Une fois chargées dans un navigateur, elles donneront l’apparence et le comportement voulu. Il joue aussi un rôle crucial dans l’optimisation d’un site.
Son travail se concentre principalement sur quatre points :
- L'intégrité visuelle : respect des couleurs, typographies, et alignements définis dans la maquette.
- L’adaptabilité : rendre le site accessible sur tous types d’appareils (ordinateur, tablette, smartphone).
- L’interactivité basique : intégrer des animations légères ou des comportements simples (menus déroulants, boutons qui réagissent au clic, etc.).
- L’accessibilité : s’assurer que le site est navigable et compréhensible pour tous, y compris les personnes en situation de handicap.
Même si ce n’est souvent pas ce qui est mis en avant, je rajouterai le rôle majeur de l’intégrateur lorsque l’on veut éco-concevoir un produit digital. Malheureusement, tous les intégrateurs ne sont pas formés (ou ne s’intéressent pas) à ça. Pourtant, c'est idéal pour créer un site rapide, efficace et favoriser son référencement.
Même si certains intégrateurs peuvent avoir des bases en développement ou de design, leur mission principale est d’assurer un respect parfait de la maquette, tout en garantissant une navigation fluide et une bonne optimisation.
Ce que vous pouvez demander à l’intégrateur
- Traduire une maquette graphique en pages HTML/CSS fonctionnelles.
- Vous conseiller dans le choix d’un CMS adapté
- Appliquer des effets légers ou des animations simples (hover sur un bouton, transitions fluides).
- Assurer le bon affichage du site (compatibilité avec les différents navigateurs, format responsive, etc.)
- Gérer l’inclusion d’éléments techniques de base, comme des balises pour le SEO ou l’accessibilité (balises ARIA).
Ce qui n’est pas de son ressort
- Créer le design ou choisir les éléments graphiques (ça, c’est le travail du webdesigner).
- Développer des fonctionnalités complexes ou des interactions dynamiques poussées (ce sera pour le développeur).
- Travailler sur les aspects backend ou les bases de données.
- Optimiser les performances côté serveur (cela dépasse généralement ses attributions).
Éditeurs de code comme VS Code, Sublime Text, ou Atom.
Frameworks CSS comme Bootstrap, Tailwind CSS, ou Foundation.
CMS comme Wordpress ou Kirby
Navigateurs pour tester le rendu (Chrome, Firefox, Safari).
Pour résumer
Le webdesigner
- Un webdesigner travaille la structure (UX) et l’apparence graphique (UI) d'interface web.
- Il livre des maquettes non fonctionnelles, mais essentielles pour valider l’interface avant de passer à la phase technique.
- Il connait les bonnes pratiques web pour produire des designs qui simplifieront le travail des intégrateurs et des développeurs.
- Il assiste l'équipe technique pour répondre à leurs questions ou faire évoluer l'UX/UI design durant la phase d'implémentation.
- Son travail n'est qu’une étape parmi d’autres dans le processus de création d’un produit digital.
L’intégrateur
- Un intégrateur donne vie aux maquettes en HTML/CSS.
- Il veille au respect de l’apparence et des comportements basiques définis par le designer.
- Il rend les pages web adaptatives (responsive) et accessibles.
- Il facilite la transition entre la maquette statique et les fonctionnalités complexes que le développeur ajoutera ensuite.
- Il ne crée ni le design, ni les fonctionnalités avancées, mais il est un maillon essentiel pour transformer une idée en réalité web.
Voilà, j’ai bien rangé tout le monde dans des petites cases !
Mais soyons honnêtes : dans la vraie vie, les frontières entre les rôles sont souvent bien plus floues.
Un webdesigner peut être spécialisé uniquement en design UX ou UI. Mais il peut aussi maîtriser l’intégration, voir un langage de dev (ou pas).
Un intégrateur peut avoir des bases solides en webdesign ou, au contraire, ne pas du tout s’y intéresser.
En gros, tout dépend des compétences de chacun, de leurs expériences, et des besoins spécifiques du projet. Ce qui compte, c’est de bien définir les rôles et les attentes dès le départ pour s’y retrouver et tirer le meilleur de chacun.
Cécile Uzel, webdesigner UX/UI
Je vous aide à réaliser des interfaces simples et efficaces.