REX — Constitution d’un Design System

Accueil > Blog > Nos Meetups > REX — Constitution d’un Design System

Vous n’avez pas pu assister au dernier meetup Vue.js Paris ? Voici un récap’ de la présentation faite par Sophie Moustard, Ingénieur développeur chez Alenvi ! 
Pour visionner le meetup en entier, ça se passe juste ici.

Exemple : Github

Exemple : ?

Exemple : Github

Design System — Kesako ?

Référentiel UX / UI évolutif : il est constitué d’une bibliothèque de composants, de visuels, de couleurs et de tout élément contribuant à l’identité visuelle et interactive de l’application.

REX — Premiers pas

• Duplication du code
• Copier / coller
• Risque d’incohérence et d’erreur
• Manque de lisibilité

Création d’une bibliothèque de composants

• Select
• Input
• DateTime

• Adresse
• Tableau — liste
• Modal
• DatRange — DateTimeRange

Evolutions apportées au fur et a mesure de la multiplication des usages

• Meilleure communication
• Rapidité de développement
• Responsive

Rex — Appronfondissement

• Entêtes

• Affichage des textes / heures / chiffres

→ Beneficiaire : NOM P.
→ Auxiliaire : Prénom M.

• Meilleure expérience utilisateur
• Meilleure compréhension et prise en main de l’outils

Rex — Avantages

• Meilleure communication dans l’équipe
• Lisibilité du code
• Efficacité / rapidité de développement
• Responsive
• Meilleure expérience utilisateur
• Meilleure compréhension et prise en main de l’outils
• Simplification de la css

Rex — Points clés

• Au bon rythme et au bon moment
• Référentiel partagé par toutes les parties prenantes
• Évolutif

Permet de donner une identité visuelle propre VOTRE l’application !

Retrouvez toutes nos offres !

Date de publication : 24 mars 2020