Qu’est-ce qu’un « design system » ?
Comment va-t-on d’une conception d’interface ou de projet à un développement ? Comment passe-t-on de l’infographiste ou designer au développeur ?
Ce sont les thèmes abordés par Jason Beres dans cette présentation. Pour en savoir plus vous pouvez aussi consulter ce livre.
Session que je préfère vous envoyer regarder que résumer car Jason explique très bien son propos et reste compréhensible pour des non anglophones (enfin, il faut quand même savoir lire ou comprendre l’anglais).
Quand même en bref : mettre en place un « design system » c’est mettre en place des procédures et des outils permettant de fluidifier le travail entre créatifs et codeurs, s’assurer que la création est bien réalisée et que les intervenants arrivent à discuter ensemble.
Se concentrer sur l’expérience utilisateur plutôt que la mise en forme (notamment les couleurs, le cauchemar de beaucoup de développeur).
Ce qui caractérise les « design system » c’est d’avoir tous les éléments permettant de visualiser les composants d’une interface utilisateur, comprendre leur comportement attendu et éventuellement également avoir le détail de leur implémentation pour les développeurs.
Après les définitions Jason est passé à la pratique et a partagé un certain nombre de sites. En voici une partie.
Exemples de systèmes de design (me demande quel est le terme officiel en français) :
- Material design de Google
- Fluent design de Microsoft
- Indigo design de Infragistics
On peut également en trouver des tonnes sur Dribble.
Zeplin propose une application en ligne permettant de créer un design et le partager.
Suggestion de logiciel : un truc qui prendrait en entrée un design provenant de Zeplin et en ressortirait un style VCL ou un style FMX. Ce serait un début dans la mise en pratique de ces notions. On pourrait aussi se greffer sur le système de synchronisation d’Indigo Design et son App Builder.
Bon, franchement, regardez cette présentation et ses Q&A.
