GitHub propulse sa culture de la collaboration dans une nouvelle dimension

Les fonctionnalités mentionnées dans cette publication nécessitent un Forfait Organisation de Figma. En savoir plus.

Où vont les développeurs pour créer des logiciels ? Sur GitHub, bien sûr, qui rassemble plus de 31 millions de développeurs du monde entier. Fondée en 2008 et intégrée à Microsoft depuis 2018, la plateforme de développement GitHub permet aux développeurs de se former, de partager et de collaborer pour créer les logiciels de demain.

Sur la plateforme, les développeurs travaillent ensemble, résolvent des problèmes complexes et construisent des technologies essentielles. Pour faciliter cela, GithHub encourage cette communauté collaborative à se réunir, qu'il s'agisse de personnes ou d'équipes, afin de bâtir les logiciels qui vont changer le monde.

« La culture de la collaboration est très développée chez nous », déclare Diana Mounter, design ops manager chez GitHub. « Mais nous sommes aussi une société où l’on travaille beaucoup à distance, avec des designers, développeurs, products managers et autres collaborateurs répartis dans le monde entier. Nous cherchions un moyen d'éliminer les obstacles à la collaboration et à la créativité qui apparaissent lorsque l'on ne travaille pas dans le même espace. »

Développer un design system et une équipe pour le gérer

Quand Diana Mounter a rejoint GitHub en 2015, la société n’avait personne de mobilisé à temps plein sur la gestion d'un design system. « Les designers devaient sans cesse recréer les mêmes éléments, la documentation était incomplète, les modèles étaient obsolètes et il existait d'autres problèmes que les gens tentaient de résoudre dans leur coin », se souvient Diana. « Nous avons décidé de lancer une initiative interne visant à rationaliser nos processus avec un design system et un workflow documenté. » Dans les six mois qui ont suivi le début de ce projet, une équipe dédiée a été formée, composée de Diana et d'une autre personne.

Depuis, un long chemin a été parcouru. Aujourd'hui, l'équipe en charge des design systems compte sept personnes (sur les 25 membres de l'équipe product design) qui se consacrent à la fourniture de composants réutilisables et interchangeables pour garantir un processus de design efficace, répétable et évolutif. « Les design systems sont désormais au cœur du design et de la création chez GitHub », explique Diana dans un article publié par ses soins.

Corriger les bugs du workflow de design

Bien qu'une équipe dédiée à la création et à la gestion du design system ait contribué à la résolution de certains problèmes d'efficacité et de cohérence au sein de l'équipe design, le workflow et les outils nécessaires à la prise en charge du design system empêchaient l'équipe d’être efficace et de travailler en collaboration sur les principaux composants.

« Notre workflow comportait des étapes fastidieuses, ce qui le rendait contraignant et déroutant pour les contributeurs qui voulaient itérer ou mettre à jour des éléments, tels que les icônes de notre bibliothèque d'icônes SVG », explique Jon Rohan, développeur et designer responsable du design system  chez GitHub. « Les utilisateurs devaient installer des logiciels spécifiques et maîtriser certains outils pour contribuer. »

Pour résoudre les problèmes de mise à jour de la bibliothèque d'icônes, appelée « Octicons », GitHub a lancé une expérience avec Figma. « Nous avons été conquis par Figma, car le workflow de mise à jour des icônes ne nécessitait pas de télécharger et d'installer de logiciels », déclare Diana.

Pour Jon Rohan, c'est la combinaison de Figma et de l'API Figma qui a permis à GitHub de  rendre l'expérience de contribution aussi fluide que possible. « En faisant migrer la bibliothèque Octicons vers Figma et en utilisant l'API Figma, nous avons pu automatiser le workflow, de façon à permettre aux équipes de participer au design system à l'aide d'outils de design puissants, sans contrainte de plateforme ni configuration complexe. » Pour en savoir plus sur Octicons, consultez le blog GitHub.

Lorsque l'équipe en charge des design systems a pris la mesure de l'impact que Figma pouvait avoir sur son workflow,  elle a également commencé à faire migrer ses composants UI vers Figma. « Désormais, presque tout ce dont les designers et développeurs ont besoin pour créer et designer GitHub se trouve sur Figma », souligne Diana.

Création d'un « DesignHub » pour la collaboration à distance

Bien que l'équipe ait toujours souhaité rester libre dans le choix de ses outils, l'utilisation de Figma s'est répandue comme une traînée de poudre. Le design basé sur le web de Figma a permis à cette équipe de surmonter les problèmes inhérents au télétravail pour  collaborer de manière concrète et efficace.

« Pouvoir rejoindre quelqu'un sur un fichier compense l'impossibilité de se réunir autour d'un tableau blanc. Figma l’a remplacé », affirme Diana.

Kathy Zheng, product designer senior chez GitHub, est du même avis. « Pour la toute première fois depuis mes débuts chez GitHub, je profite d'une véritable expérience de collaboration autour du design, ainsi que de tous les avantages du travail d’équipe en présentiel. Cet outil est peut-être même plus ludique qu'un tableau blanc classique, car il a des fonctionnalités puissantes. »

Pour Kathy, Figma remet la créativité au centre. « À toute étape du design, j’ai besoin de laisser libre cours à ma créativité en “bricolant” mon fichier, jusqu’à ce que de nouvelles idées jaillissent. », dit-elle. « Dès que j'ai commencé à tester des idées avec d'autres designers dans des fichiers Figma, j'ai redécouvert cette impression de créer une dynamique autour d'une nouvelle idée. »

Aujourd'hui, Kathy utilise Figma pour « tout ce qui a trait au storytelling. » Le processus de design permet de raconter une histoire, tandis que le prototypage la rend réelle. « Désormais, le prototypage fait partie intégrante de mon workflow, car c’est devenu très facile à faire », affirme-t-elle. « Je peux rapidement faire glisser des objets pour montrer le flow que j’ai en tête, sans changer d'outil. »

Accélérer les boucles de retours et les cycles de livraison ou shipping

Les designers tels que Kathy Zheng apprécient la façon dont Figma améliore et accélère les sprints, ce qui facilite la participation de collaborateurs issus d’autres équipes. « Chez GitHub, nous collaborons toujours étroitement avec nos équipes de projet et de développement », déclare Kathy. « Plus nous invitons les développeurs  à faire des retours, plus les deux parties gagnent en efficacité avec un cycle global raccourci. »

Ash Guillaume, graphiste chez GitHub, partage cet avis. « Je peux instantanément créer un lien vers mon design et le partager avec n'importe quel membre de mon équipe », se réjouit-il. « La personne peut alors l'ouvrir dans Figma et me faire part de ses suggestions à l'aide du système de commentaires, accélérant ainsi la boucle des retours. »

Jon Rohan, de l'équipe en charge du design system, estime qu'il est essentiel de partager plus qu'une simple capture d'écran pour communiquer et recevoir des commentaires. « Les gens peuvent visualiser le vrai design, ce qui est très précieux pour nous, car nous procédons par ajouts incrémentaux.  Un rythme soutenu est donc nécessaire pour apporter des changements rapidement », dit-il. « En général, les développeurs apprécient de pouvoir visualiser directement des designs et des prototypes via un lien Figma. »

Un succès qui gagne toute l'entreprise

Pour Diana, le succès qu'a rencontré Figma chez GitHub s'explique avant tout par l'aide que cet outil apporte à l'équipe en charge des design systems. « Figma facilite la mise à jour de notre design system », précise-t-elle. « Je pense aussi qu'on peut attester de cette réussite par le nombre croissant de développeurs et de product managers qui nous rejoignent sur Figma et apprécient ce que l’outil apporte à la collaboration avec les designers. Enfin, le succès se mesure par la popularité de Figma, qui gagne toute l'entreprise GitHub. »

Figma aide les designers de GitHub à mieux montrer les étapes entre les prémices d'une idée et le design fini. Selon Diana, « il est plus facile d'accéder aux projets en cours pour les personnes extérieures à l'équipe design, ce qui veut dire que plus de monde est impliqué et qu’il y a plus d'innovation ».

Cette façon de collaborer est au cœur de l'esprit même de GitHub : développer des projets ambitieux en rassemblant les gens.