L’équipe de design de WordPress a annoncé, le 7 novembre 2024, la sortie d’une toute nouvelle bibliothèque de design system sur Figma. Cette initiative vise à offrir aux concepteurs travaillant dans l’écosystème du CMS une gamme complète d’outils pour améliorer leur efficacité et la cohérence de leurs projets au sein du logiciel de prototypage. Ce nouvel ensemble de composants, accessible directement sur Figma, permet aux utilisateurs de créer des maquettes tout en respectant les normes esthétiques et fonctionnelles de WordPress.
Qu’est-ce que la bibliothèque de design system ?
La nouvelle bibliothèque de design system pour WordPress est un ensemble complet de composants visuels et de styles, spécialement conçu pour simplifier le travail des designers de la communauté WordPress. Figma, devenu un standard pour la création de prototypes, permet à l’équipe de design de centraliser les composants et d’assurer une cohérence visuelle et fonctionnelle dans les projets.
Voici les principales caractéristiques de cet ensemble :
- Bibliothèque de composants étendue : elle inclut des éléments essentiels tels que les boutons, les formulaires, les icônes et les menus, organisés de manière à faciliter leur réutilisation dans les interfaces WordPress.
- Tokens de style : ils permettent de gérer des éléments visuels comme le rayon, l’élévation, la couleur et la typographie, assurant une uniformité dans les designs.
- Stickers pratiques : ils incluent des composants individuels, ainsi que des éléments plus complexes comme l’éditeur de plein écran et l’éditeur de site.
« L’objectif de cette ressource est de simplifier le processus de conception pour les personnes travaillant dans l’écosystème WordPress », explique James Koster, designer chez Automattic. En regroupant tous les éléments nécessaires en un seul endroit, les designers peuvent ainsi passer moins de temps sur les tâches répétitives et peuvent se concentrer davantage sur l’aspect créatif.
Pourquoi une bibliothèque WordPress sur Figma ?
Figma est un outil de conception particulièrement populaire, utilisé non seulement pour ses fonctionnalités de prototypage avancées, mais aussi pour ses capacités collaboratives en ligne. Avec cette nouvelle bibliothèque, WordPress souhaite rendre la conception plus fluide et intuitive pour les membres de sa communauté, qu’ils travaillent directement pour WordPress.org ou dans d’autres organisations. Cette nouvelle mouture doit donc permettre :
- L’optimisation des flux de travail : en centralisant les composants visuels dans Figma, les designers peuvent facilement accéder aux éléments dont ils ont besoin, les modifier ou les personnaliser en fonction de leurs besoins. Il est ainsi possible de créer des interfaces qui respectent les normes de WordPress sans avoir à repartir de zéro à chaque projet.
- La réflexion du code en place : la bibliothèque de design est alignée autant que possible avec le code de WordPress. Les éléments visuels que les concepteurs utilisent sont en cohérence avec ceux disponibles dans le code, ce qui réduit les écarts entre la conception et le développement.
- La facilité de personnalisation : Figma propose des options de personnalisation grâce aux propriétés et variantes intégrées aux composants, ce qui rend leur utilisation intuitive et rapide. La bibliothèque encourage ainsi les concepteurs à adapter les éléments sans avoir à maîtriser des outils complexes.
