Concevoir un design system pour un client : cinq conseils pour prendre un bon départ

1. Un design system, vraiment ?

La question peut paraître élémentaire mais elle est pourtant bien légitime. Entre l’effet de mode, l’envie d’innover et parfois la pression client, il est très facile de se jeter tête baissée dans une telle entreprise alors que ce n’est pas toujours nécessaire, ou même possible. Il faut donc se poser la bonne question.

Un design system va-t-il vraiment me faciliter la vie ?

OUI, dans 95% des cas un design system vous fera gagner du temps en apportant de la consistance et de la fluidité dans tous vos processus de design, de la phase de conception à la phase de développement. Mais ce sera seulement suite à la mise en ligne de votre dispositif que les choses sérieuses commenceront : évangélisation, formation des équipes, maintiens et mise à jour des éléments, partage avec les collaborateurs, gestion de la gouvernance etc. seront autant de missions que vous aurez à gérer au quotidien. C’est pour cela qu’il faudra décider en amont si le temps passé et les ressources qui seront affectées à votre design system sont à votre portée et ne transformeront pas votre projet en un gouffre financier et temporel oblitérant tous les avantages cités plus haut.

Il n’est cependant pas nécessaire d’abandonner complètement l’idée d’un design system si vous ne pensez pas être en mesure de le faire vivre, mais peut-être simplement de revoir vos ambitions à la baisse en dimensionnant correctement votre outil. 

2. Bien dimensionner son design system

Couleurs, styles de texte, iconographie, guidelines, composants, interactions, accessibilité son, spécifications fonctionnelles, code : les éléments qui peuvent composer un design system sont aussi nombreux que variés mais suis-je obligé de tous les intégrer ? Bien sûr que non, mais plus votre design system sera riche, plus il sera solide et plus il sera à même de remplir sa fonction fédératrice. 

Il faudra commencer très tôt à lister l’ensemble des éléments que vous souhaitez intégrer, puis les prioriser tout en y associant les ressources (humaines, matérielles, temporelles) nécessaires à leur mise en place. En procédant ainsi vous aurez une première feuille de route suffisamment précise qui vous permettra d’aborder le projet sereinement. 

Le design system étant un dispositif évolutif il est tout à fait possible de commencer modestement et de petit à petit venir l’enrichir jusqu’à obtenir le résultat escompté. Si vous travaillez par exemple sur Sketch, le simple fait d’utiliser la méthode Atomic Design et d’organiser correctement votre fichier source constitue déjà une première version de design system.

3. Dispositif final et design system: deux projets différents

Même s’ils sont étroitement liés, un dispositif et son design system (quelles que soient leurs tailles) sont deux éléments bien distincts et doivent donc être traités comme tels. C’est un projet à part entière qui si comme nous, vous utilisez la méthode Design Thinking, devra suivre les mêmes étapes : Exploration –> Cadrage –> Conception –> Développement.

Cette mise en parallèle est importante et permettra d’allouer plus facilement les ressources aussi bien humaines que matérielles. Elle permettra également de faire avancer les deux projets de manière indépendante : une pause sur le projet principal n’empêchera pas de continuer à enrichir le design system et inversement.

4. Choisir les bons outils

De plus en plus d’outils permettent de faciliter la mise en place des designs systems, mais tout comme pour les outils de design (Sketch, Figma, Photoshop, etc.) la bataille fait rage et le choix est de plus en plus difficile. Cependant, pas d’inquiétudes nous allons passer en revue quelques-unes des options qui s’offrent à vous.

Les outils payants qui proposent des solutions clés en main

InvisionDSM, Zeroheight, Lingo sont autant de qui plateformes qui proposent des solutions d’hébergement prêtes à l’emploi.
Moyennant un coût mensuel/annuel ces plateformes proposent en général : 

• Une structure “prémâchée” permettant d’accueillir les divers éléments de votre dispositif (gabarits, modules, code, documentation, etc)
• Des outils de synchronisation avec les logiciels de design (Sketch, Figma, XD etc.) permettant de faciliter le maintien à jour du Design System pour des profils non-développeur
• La gestion utilisateurs (gestions des droits, autorisations etc.)
• Un back-office prêt à l’emploi
• Des coûts pouvant être assez élevés pour les versions “Entreprises” (plusieurs milliers d’euros par an, mais assez fluctuant d’une plateforme à l’autre).
• Les plateformes ne sont pas ou peu personnalisables (structure du Design system, Branding etc.)
• Dépendance forte à la plateforme (mise à jour, fonctionnalités etc.)

Le dispositif ex nihilo

La deuxième alternative consiste à développer une plateforme propriétaire permettant de répondre à l’ensemble de ses besoins. 

• Grande liberté : fonctionnalités, structure, hébergement, gestion des droits. Aucune dépendance.
• Plateforme sur-mesure et évolutive selon les besoins
• Pas de synchronisation avec les outils de design (à moins de mettre en place son propre outil…)
• Si pas de back-office dédié, la mise en place des évolutions est plus compliquée
• Efforts de mise en place initial très importants si l’on souhaite utiliser des fonctionnalités avancées telles qu’un back-office ou un outil de synchronisation etc.

Ces deux propositions représentent les “extrêmes” mais il existe évidemment une myriade de solutions intermédiaires qui pourront sûrement correspondre à vos besoins, mais que nous vous laissons découvrir par vous-même…

5. S’adresser aux bonnes personnes

En tant qu’agence, le design system ne s’adressera pas uniquement à nos collaborateurs, mais bien au client qui devra finalement le prendre en main et le faire vivre. Il est donc très important d’identifier et d’inclure dès le début du processus toutes les personnes qui seront de près ou de loin en contact avec le design system.

La logique de celui qui a mis en place le design system doit être partagée et comprise dès les prémices du projet et inclure le plus de profils possible : chefs de projet, designers UX/UI, développeurs etc...).
Des incompréhensions et des zones de flou conduiront inévitablement à des frictions dès que le projet commencera à être bien avancé.

Des points d’avancement pourront être mis en place régulièrement afin que tout le monde soit toujours en phase avec la vision du design system, l’idée étant qu’à la livraison tout le monde soit à même d’utiliser ces merveilleux outils dans les meilleures conditions.