Design Tokens, pourquoi les Devs et les Designers vont devenir encore plus potes

Un titre un peu provocateur car j’en ai juste assez que l’on « entre en dur » des valeurs dans des fichiers css qui ne correspondent pas aux prototypes. BOUH !

Tiens et si je mettais un petit padding de 5px sur ce bouton et une petite valeur hexa approximative (avec la pipette de VS Code quand même) pour le background parce que j’aime bien ce bleu en fait…

Je plaisante bien sûr, mais il y a parfois une part de vérité dans l’humour. Ceci étant dit, j’ai toujours eu de très bonnes relations avec mes collègues développeur•euse•s, nous sommes déjà très potes. Ayant moi-même un background technique et une certaine affinité / sensibilité avec le monde du développement, je peux le dire, les devs sont géniaux et j’aime travailler dans leur équipe.

Plus sérieusement, lorsque Figma a lancé les Design Tokens j’y ai vu une formidable opportunité de travailler tous ensemble. Fini les MAJ manuelles et remplacement de toutes les occurences d’une même valeur dans son fichier design ou fichier css, fini le temps où l’on ne sait plus qu’elle est la valeur de gris à utiliser pour la bordure d’un input (grey-10 ?, grey-20 ?), etc. Avec les design tokens (variables dans Figma), de par leur nature et fonctionnement, le travail collaboratif devient plus simple, le maintien et la cohérence d’un système également.

C’est à la fois super cool pour les designers mais pour toute la « chaine produit » : product manager, marketing manager, product owner, développeur, etc.

Pour une définition et fonctionnement des Design Tokens, je vous invite à consulter cet article, Définir ses design tokens pour son Design System de Xavier Bellion sur Medium.