Le design fait partie intégrante de tout processus de création de valeur. Il est, de ce fait, important de trouver des moyens efficaces pour produire rapidement des conceptions de qualité. Le design system intervient ainsi pour épauler les designers et les développeurs à réunir leurs efforts et à contribuer à la réussite de leur entreprise ou de leur produit.
Cet outil de travail se présente comme un facteur clé de différenciation, notamment en matière d’amélioration de l’expérience utilisateur. Les entreprises, contraintes d’accélérer leur cadence de production tout en fournissant la meilleure qualité possible, encouragent davantage leurs équipes à suivre des formations au design system.
Ceci dit,il est pertinent d’uniformiser le langage de conception interne de l’entreprise, ce pourquoi il faut apprendre à créer un design system complet et fonctionnel. Voici, alors, quelques pistes qui pourront vous aider à concevoir le vôtre.
Qu’est-ce qu’un design system ?
Outil à destination des UX/UI designers et des développeurs, le design system est une bibliothèque de ressources et de composants graphiques qui permet la création d’interfaces utilisateur et de prototypes. C’est un kit conçu de façon collaborative qui est constamment mis à jour par ses éditeurs, et ce dans le but d’accélérer le processus de conception tout en garantissant un haut niveau de qualité.
Un design system comporte des composants sur-mesure, des éléments graphiques, du code, des symboles et des règles UX. Il doit être évolutif dans le temps, réutilisable, ergonomique et adaptable aux différents supports d’utilisation (mobile, web, objets connectés, etc.).
Pourquoi les entreprises créent un design system ?
Le design ne s’adapte pas facilement aux nouvelles tendances et aux exigences du marché. Pour une entreprise, faire évoluer ses conceptions en embauchant des designers, sans mettre en place de normes, n’est qu’un mythe. Chaque nouvelle recrue apporte ses idées et augmente ainsi l’entropie du design. Par ailleurs, chaque nouveau projet fait émerger de nouvelles exigences (palettes de couleurs, typographie et motifs), ce qui augmente l’incohérence et le coût de maintenance.
Il n’y a qu’un seul moyen de mettre fin à ce chaos, c’est de s’engager dans la création d’un design system. Ainsi, le modèle de conception de l’entreprise s’alimente régulièrement et se développe progressivement, tout en évoluant avec les normes et les innovations du moment. En agissant de la sorte, les entreprises seront en mesure de proposer une meilleure expérience utilisateur dans chacun de leur produit, soit de quoi épater leurs clients tout en limitant leurs dépenses.
7 règles d’or pour créer un design system fonctionnel
Le premier objectif d’un design system est de simplifier le travail collaboratif entre les UX/UI designers et les développeurs. Sa création doit prendre en considération les besoins de chaque partie prenante pour aboutir à un contenu fonctionnel. En général, il est nécessaire de respecter les règles suivantes :
- Créer l’inventaire de l’interface utilisateur
Commencez par établir un catalogue de tous les composants réutilisables de votre produit. Cela inclut les motifs, les couleurs, les typographies, les icônes et même les systèmes de grille. La création d’un inventaire des composants de l’interface utilisateur révélera, le cas échéant, les incohérences graphiques et permettra d’uniformiser la vision collective à propos du design du produit final.
- Faites accepter vos idées par tout le monde
Il est important de rallier les parties prenantes et l’équipe de conception avant de commencer à élaborer un design system. Expliquez-leur les incohérences que vous avez découvertes lors de votre inventaire et comment elles affectent l’expérience utilisateur. Lancez le débat autour de vos propositions et prenez des notes pour perfectionner votre plan de design system
- Constituez une équipe multidisciplinaire
Vous avez besoin d’une équipe pour mettre en œuvre et gérer un design system tout au long du cycle de conception du produit. La plupart de ces équipes se composent :
- d’UI designers : pour créer les éléments visuels
- d’UX designers : pour s’assurer de la compatibilité des ressources crées aux objectifs UX et aux normes de l’ergonomie.
- de développeurs front-end : pour créer les composants et les templates.
- d’un chef de projet : pour veiller au respect des objectifs du projet
- d’un rédacteur UX : pour créer une charte éditoriale en fonction des besoins du client final.
Commencez par identifier les compétences dont vous avez besoin, puis choisissez les personnes à qui vous faites confiance. Le but ultime étant de générer des parcours utilisateur de qualité destinés à vos clients. N’oubliez pas de tester les aptitudes créatives des personnes à intégrer dans votre équipe de création du design system.
- Etablissez un document de référence
Pour que vous puissiez créer un design system de qualité, il est important d’instaurer des principes de conception à respecter. En réalisant une veille UX, vous serez en mesure d’éditer un guide de recommandations qui servira de références aux différentes parties prenantes de votre équipe.
Ce référentiel va des spécifications à émettre aux développeurs pour concevoir des composants sur-mesure jusqu’à la charte graphique qui définit l’identité visuelle des interfaces à concevoir. En parallèle, vous devez mentionner les contraintes à prendre en compte : les supports d’utilisation, le profil de l’utilisateur cible, les attentes, etc.
- Choisissez le bon outil
Etablir les ABC du design system c’est bien, mais il faut choisir l’outil qui vous permettra de le créer. Plusieurs logiciels d’UX design comme Sketch, Figma et Adobe XD sont réputés pour la création des interfaces utilisateur dans les normes. Ces outils vous permettent de créer un design system complet, de le partager avec votre équipe et de le réutiliser.
- Créez le contenu de votre design system
Place maintenant à la partie technique où vous serez amenés à créer les éléments graphiques et les composants de votre design system. Pour ce faire, il faut mettre au point :
- Une palette de couleurs inspirée de la charte graphique du produit.
- Une échelle typographique : police de caractères, styles, couleurs du texte, etc.
- Une bibliothèque d’icônes et de formes
- Les éléments servant d’illustrations, d’animations et de sons.
- Créez le premier design system
La création de patrons d’un design system est un processus itératif. Ne vous concentrez pas sur la création de tous les modèles en une seule fois. Commencez par identifier la meilleure architecture pour chacun des composants de votre design system, puis créez-les un par un.
Une fois le premier design system créé, vous pouvez inviter vos collaborateurs pour évaluer le résultat obtenu en guise de son amélioration. Étant un outil évolutif, un design system n’est jamais fini et, de ce fait, il n’y a pas de résultat final à aller chercher.