Un Design System est un ensemble de normes, de principes et de composants réutilisables qui guident la conception et le développement d’une interface utilisateur cohérente et efficace. Son importance est donc essentielle au sein d’une organisation, car le système de conception (Design System) permet de gagner du temps, d’assurer une cohérence visuelle et d’améliorer l’expérience utilisateur. Aussi faut-il éviter les pièges et les erreurs lors de sa création.
Rappel : Qu’est-ce qu’un Design System ?
Sommaire
Erreur n°1 : ne pas impliquer les parties prenantes dès le début
Impliquer les parties prenantes dès le début est essentiel pour garantir que le Design System répond aux besoins de tous. Les designers, développeurs, marketeurs et même les utilisateurs finaux doivent être consultés pour s’assurer que le système est pertinent et utile.
Importance de l’implication des parties prenantes
- Obtenir une adhésion et une collaboration plus larges. En impliquant dès le départ les parties prenantes telles que les designers, les développeurs, les chefs de produit et les designers qui en seront les utilisateurs; vous recueillez leurs avis et leurs besoins dès le départ. Cela permet de créer un système qui répond réellement aux besoins de chacun et augmente les chances qu’il soit adopté et utilisé par tous.
- Identifier et éviter les problèmes potentiels tôt. En réunissant différents points de vue dès le début du processus, vous pouvez identifier les problèmes potentiels et les obstacles plus tôt. Cela permet de les résoudre de manière proactive et d’éviter des retards ou des retravaillements coûteux plus tard.
- Promouvoir une compréhension et une vision communes. Un système de conception efficace repose sur une vision et une compréhension communes de ses objectifs et de son fonctionnement. Impliquer toutes les parties prenantes dès le départ permet de s’assurer que tout le monde est sur la même longueur d’onde et qu’il partage la même vision du système.
- Encourager l’appropriation et la responsabilité. Lorsque les parties prenantes participent à la création du système de conception, elles se sentent plus investies dans sa réussite. Cela conduit à une meilleure appropriation et à un plus grand sens des responsabilités pour le maintien et l’amélioration du système au fil du temps.
- Faciliter une communication et une collaboration continues. L’établissement de relations et de canaux de communication ouverts à travers une plateforme collaborative comme Figma, par exemple, et ceci dès le début, favorise la communication et la collaboration continues entre les parties prenantes. Cela est essentiel pour assurer que le système de conception reste à jour et soit pertinent face aux besoins et aux évolutions.
Le Design System de IBM, Carbon, propose une grande variété de composants et de guidelines pour des interfaces axées sur les besoins des entreprises.
Conséquences de l’ignorance de cette étape
Si les utilisateurs ne sont pas impliqués dans la conception du système, ils risquent de ne pas comprendre son objectif, sa valeur ou son mode d’emploi. Cela conduit généralement à une faible adoption du système, à une utilisation inefficace et à une frustration générale.
Erreur n°2 : manquer de documentation complète et accessible
Une documentation claire et complète est la colonne vertébrale d’un Design System efficace. Elle doit être facilement accessible à toutes les équipes concernées et régulièrement mise à jour pour refléter les changements et les évolutions du système.
Importance de la documentation
Une documentation claire permet aux utilisateurs de se familiariser rapidement avec le système et de commencer à l’utiliser de manière productive.
En fournissant une source de référence unique pour tous les éléments de conception, la documentation contribue à garantir que tous les utilisateurs du système appliquent les mêmes principes et styles. Cela améliore l’efficacité du workflow et la productivité globale de l’équipe.
Une documentation accessible et bien rédigée rend le système de conception plus attrayant et plus facile à utiliser pour les nouveaux utilisateurs. Cela favorise l’adoption du système au sein de l’organisation et augmente sa valeur globale. Elle permet de comprendre le contexte des décisions de conception passées et de prendre des décisions éclairées pour les futures mises à jour.
La documentation établit un langage commun pour tous les intervenants impliqués dans la conception et le développement des produits. Cela facilite la communication, la collaboration et la résolution des problèmes entre les équipes.
Polaris est le Design System utilisé par Shopify. Il aide à créer des interfaces d’e-commerce efficaces avec une attention particulière envers les commerçants.
Comment bien documenter son Design System?
- Créez une structure claire et logique pour votre documentation afin que les utilisateurs puissent facilement trouver les informations dont ils ont besoin.
- Utilisez une hiérarchie de pages, des menus de navigation et une fonction de recherche.
- Divisez le contenu en sections thématiques et utilisez des titres et des en-têtes descriptifs pour faciliter la navigation.
- Utilisez un langage simple et direct, en évitant le jargon technique excessif.
- Expliquez les concepts de manière claire et concise, en fournissant des exemples concrets et des illustrations.
- Offrez des instructions étape par étape et des tutoriels pratiques pour guider les utilisateurs.
- Encouragez les utilisateurs à faire part de leurs commentaires sur votre documentation.
Erreur n°3 : négliger la cohérence et la standardisation
La cohérence garantit que tous les composants et modèles fonctionnent ensemble, offrant une expérience utilisateur fluide. Standardiser les éléments de conception et de développement permet de maintenir cette cohérence à travers tous les produits et services.
Pourquoi la cohérence d’un Design System est-elle essentielle?
La cohérence d’un Design System est un facteur clé pour créer des expériences utilisateur de qualité, améliorer l’efficacité des équipes, maintenir la qualité des produits et renforcer l’identité de la marque. En investissant dans la création et le maintien d’un Design System cohérent, une organisation peut tirer parti de nombreux avantages et ceci sur du long terme.
Développé par Salesforce, Lightning Design System fournit des composants UI et des patterns de design pour construire des interfaces conformes aux standards de l’écosystème Salesforce.
Comment maintenir la cohérence d’un Design System?
- Établir une gouvernance claire. Cela peut inclure un propriétaire de système de conception, un comité de gouvernance ou une équipe dédiée. Définissez des processus clairs pour la soumission, l’évaluation et l’approbation des modifications du système.
- Mettre en place des directives et des principes de conception solides. Documentez clairement les principes de conception. Cela inclut les règles de style typographique, les palettes de couleurs, les règles de mise en page et les directives d’utilisation des composants.
- Utiliser des outils de conception centralisés comme Figma pour créer, gérer et partager les composants du Design System. Cela permet de s’assurer que tous les utilisateurs travaillent avec la dernière version des éléments de conception et que les modifications sont appliquées de manière cohérente.
- Mettre en place des processus de révision et d’approbation rigoureux pour toutes les modifications proposées. Cela permet de garantir que les modifications respectent les principes de conception et les directives de qualité établis.
- Maintenez une documentation à jour et complète.
- Encourager l’utilisation et la contribution des utilisateurs à partager leurs commentaires et leurs suggestions. Cela permet d’identifier les domaines d’amélioration et de s’assurer que le système répond aux besoins des utilisateurs.
- Surveiller et analyser l’utilisation du système pour identifier les tendances, les problèmes potentiels et les opportunités d’amélioration. Cela permet de s’assurer que le système répond aux besoins de l’organisation.
- Organiser des ateliers et des formations pour s’assurer que tous les utilisateurs sont à jour sur les dernières modifications et qu’ils utilisent le système de manière efficace.
- Intégrer le Design System dans les workflows par la granularité, ce qui inclut l’utilisation de plugins, d’extensions ou d’outils de conception qui se connectent directement au système.
- Cultiver une culture de la cohérence, en soulignant l’importance du Design System et ses avantages pour la qualité des produits et l’expérience utilisateur.
Erreur n°4 : ne pas prévoir de mise à jour et d’évolution
Un Design System n’est pas figé. Il doit évoluer avec le temps pour s’adapter aux nouvelles tendances, technologies et besoins des utilisateurs. Planifier des mises à jour régulières et des révisions est essentiel pour maintenir sa pertinence et son efficacité.
L’importance de l’évolution d’un Design System
Les tendances technologiques et marketing du marché ainsi que les préférences des utilisateurs influencent la façon dont les produits numériques sont perçus. Un Design System évolutif peut rester pertinent en intégrant les tendances de conception émergentes, en adoptant de nouveaux styles.
En anticipant les possibles évolutions, les entreprises peuvent minimiser les coûts de maintenance et les risques de voir leur Design System devenir obsolète. Un système bien conçu peut être facilement mis à jour et adapté, ce qui permet d’éviter des refontes coûteuses et des retards de développement.
Les stratégies pour maintenir son système de conception à jour
- Définir un calendrier et un processus clairs pour la mise à jour du Design System. Cela peut inclure des mises à jour régulières, des correctifs de bugs ponctuels ou des mises à jour majeures en fonction des besoins.
- Utiliser des outils de versionnage et de contrôle de code pour suivre les modifications, identifier les conflits et maintenir l’historique des modifications.
- Suivre l’utilisation du Design System et collecter des données sur l’adoption des composants, la fréquence des mises à jour et les points de friction potentiels.
- Mesurer l’impact du Design System sur les indicateurs clés de performance (KPIs) tels que la vélocité de développement, la cohérence de la conception et la satisfaction des utilisateurs.
- Documenter les modifications apportées au Design System, y compris les descriptions détaillées, les exemples d’utilisation et les instructions de mise en œuvre.
- Créer une culture de l’innovation et de l’expérimentation, en encourageant les utilisateurs à proposer de nouvelles idées et à tester de nouvelles approches pour améliorer le Design System.
Erreur n°5 : ignorer les feedbacks des utilisateurs
Les feedbacks des utilisateurs sont une mine d’or pour améliorer un Design System. Ignorer ces retours peut conduire à des solutions obsolètes ou inefficaces. Il est important de mettre en place des mécanismes pour recueillir, analyser et intégrer ces feedbacks de manière continue.
Pourquoi les feedbacks sont essentiels?
En analysant les feedbacks sur l’utilisation des différents composants et fonctionnalités du Design System, il est possible de comprendre quels éléments sont les plus populaires, les plus utiles et les plus susceptibles d’être adoptés.
Les feedbacks des utilisateurs peuvent révéler des problèmes d’utilisabilité, des confusions dans les directives de conception ou des difficultés à utiliser certains composants du Design System.
Ces informations permettent de prioriser les efforts de développement et de s’assurer que le système se concentre sur les éléments qui apportent la plus grande valeur aux utilisateurs.
Mozaik est le Design System du groupe Leroy Merlin. Il fournit des ressources pour unifier les interfaces digitales des différentes marques au sein du groupe ADEO.
Comment intégrer les feedbacks dans l’amélioration du Design System?
En intégrant activement les feedbacks dans le processus de développement du Design System, les utilisateurs se sentent plus investis et engagés dans le succès du système. Cela encourage une adoption plus large et une utilisation plus efficace du Design System au sein de l’organisation. Pour cela, il faut utiliser des outils pour faciliter la collecte et l’analyse des feedbacks tels que UserVoice ou Feedbackly, pour centraliser la collecte, des outils d’analyse de données tels que Google Analytics ou Hotjar pour suivre l’utilisation du Design System, des outils de collaboration tels que Slack ou Figma pour faciliter la communication.
Erreur n°6 : sous-estimer l’importance des tests d’utilisation
Les tests d’utilisation sont indispensables pour évaluer l’efficacité d’un Design System. Ils permettent d’identifier les points de friction, les incohérences et les améliorations potentielles. Des tests réguliers garantissent que le système reste performant et centré sur l’utilisateur.
Rôle des tests d’utilisation
Les tests utilisateur sous-tendent la création et la vie du Design System, ils permettent :
- d’améliorer la convivialité et l’expérience utilisateur.
- d’identifier les incohérences et les problèmes de conception.
- de valider l’efficacité des composants et des directives.
- de renforcer la collaboration entre les équipes.
MAIF Design System offre des composants et des directives visant à améliorer l’expérience utilisateur sur les plateformes et applications MAIF (assurances et mutuelles). Il met l’accent sur l’accessibilité et la cohérence visuelle.
Comment bien tester son Design System
Différents tests d’usabilité peuvent être employés. Tests d’utilisabilité sur tâches, tests A/B, tests d’eye-tracking par page, tests d’utilisation à distance pour obtenir des commentaires d’un public plus large et diversifié.
L’important est de bien répartir l’intégration de ces tests dans le cycle de vie du Design System :
- intégrer les tests d’utilisation en continu dans le processus de développement itératif du Design System pour identifier les problèmes dès le départ et les corriger rapidement.
- après la mise en production pour surveiller son utilisation, identifier les nouveaux problèmes et s’assurer qu’il répond toujours aux besoins des utilisateurs.
- créer une culture de tests pour qu’ils soient considérés comme une partie essentielle du processus de conception et d’amélioration du Design System.
Erreur n°7 : ne pas former et éduquer les équipes
Un Design System ne peut être pleinement efficace que si toutes les équipes concernées sont correctement formées et éduquées à son utilisation. Des sessions de formation régulières et des ressources éducatives accessibles permettent de maximiser l’adoption et l’usage optimal du système.
Importance de la formation continue
La formation continue sur le Design System permet bien entendu de garder des équipes à niveau, d’intégrer les nouveaux venus aux équipes par l’emploi du Design System, mais également de comprendre les points de friction et les améliorations à apporter.
Decathlon Design System offre une structure complète pour concevoir des interfaces visuelles et des expériences utilisateur harmonisées sur leurs plateformes e-commerce et applications.
Méthodes pour former efficacement les équipes
Ateliers pratiques. Essentiels pour les nouvelles recrues des équipes, les ateliers pratiques permettent aux participants d’apprendre en faisant et d’acquérir une expérience concrète de l’utilisation du Design System.
Sessions de formation en ligne. Les sessions de formation en ligne offrent une flexibilité et permettent aux participants d’apprendre à leur propre rythme, c’est l’outil par excellence de la formation continue. Aussi faut-il que l’outil soit attrayant et que le temps des sessions soit en accord avec le rythme de travail.
Tutoriels et documentation. Les tutoriels et la documentation du système doivent être utilisés comme ressource première de l’apprentissage et de la formation continue.
Un Design System bien conçu – illustrations de l’article par Oh Dae-su
Conclusion
En évitant ces 7 erreurs courantes, vous pouvez créer un système de conception robuste, cohérent et évolutif qui répondra aux besoins de vos utilisateurs et facilitera le travail de vos équipes. Un Design System bien conçu est un atout précieux pour toute organisation cherchant à offrir des expériences utilisateur de haute qualité. C’est aujourd’hui le seul garant de l’identité de la marque et de l’UX sur ses interfaces.
image à la Une : les 7 erreurs du Design System – Oh Dae-su via Canva