Design System

Le design-system kbizien inclut toutes les ressources de l’interface utilisateur du projet. Charte graphique, architecture CSS, composants UI et documentation en tout genre concernant le design du produit ainsi que ses processus d’utilisation. Ce design-system permet de rationnaliser toutes les ressources visuelles pour que les différents intervenants du projet puissent itérer, améliorer et faire évoluer le produit de manière flexible et maintenable. Cela permet la création d’un langage visuel solide et assure sa cohérence sur le long terme. Les bonnes pratiques et utilisations techniques y sont également présentées. Les designers peuvent ainsi se concentrer sur l’experience utilisateur et intéractions, pendant que les développeurs se concentrent sur la partie ingénieurie et logique des composants.

Ce que contient ce design-system

  • Description de la charte graphique : identité, couleurs, fonts, icones…
  • Architecture et bonnes pratiques CSS : description des processus technique du design
  • Documentation de l’utilisation des composants UI

Designers

Consultez la charte graphique et les composants UI existants pour vous imprégner du langage visuel et voir les composants susceptibles d’être réutilisés dans vos créations. Retrouvez toutes les règles et principes attachés au design du produit.

Développeurs

Accédez aux ressources technique de l’interface du produit. Retrouvez les documentations des différents outils et méthodes utilisées, ainsi que celle des composants UI du produit.

Ressources

La mise en place et la maintenance d’un living styleguide permet une meilleure coordination et communication entre créatifs et ingénieurs. Fluidifier les échanges en se basant sur un document de travail identique favorise les itérations afin de se concentrer sur la valeur réèlle du produit : l’utilisation et l’expérience utilisateur. Pour une première approche, l'article Entre design et développement explique les relations entre designers et développeurs par l’intermédiaire de la maintenance d’un living styleguide. Le problème principal dans la conception d’interface est l’incompréhension entre designers et développeurs qui ont chacun des problématiques différentes. Cela provoque des incohérences dans le projet, des problèmes de maintenance et de scalabilité qui peuvent s’avérer fatales dans la progression du produit. Un bon design d’interface n’est pas seulement un design cohérent visuellement avec une bonne direction artistique. Le design d’une interface doit être intelligemment pensé à toutes les étapes de sa conception. Pour que le produit soit performant dans le temps, il est donc primordial que son architecture technique soit maintenable sur le long terme sans que l’équipe de production s’arrache les cheveux à chaque évolution.

Quelques avantages d'un living styleguide

  • Favorise le développement modulaire et la réutilisation de patterns
  • Assure la cohérence globale du langage visuel du produit
  • Fait office de documentation à destination de tous les membres de l’équipe de production et notamment les nouvelles recrues
  • Aide les membres de l’équipe à communiquer et itérer
  • Favorise l'apprentissage des problématiques de chacun et le gain de compétences
contact

Kevin Bizien

Creative developer
Consultant architecture front-end

Tu souhaites me parler de ton projet design ? Contact-moi à l'adresse bonjour@kevinbizien.com et échangeons dès maintenant !