2021 - Product Design • Process

Design System multiproduit

Création et mise en place du Design System multiproduit Swibeco (Web, app, icones).

Design system - first image

Équipe

1 Product Designer
1 Lead Développeur Front
2 Développeurs Front

Mon role

Product Designer Lead sur le projet

Outils

Figma

Durée

Mise en place: 2 mois

Introduction

A mon arrivée chez Swibeco, j’ai identifié le besoin d’un Design System pour structurer et optimiser la conception et faciliter les échanges avec les Développeurs. Avoir des standards design définis permet à l’équipe produit de grandir sainement tout en maintenant un design cohérent sur l’écosystème Swibeco et les nouveaux produits développés.

Objectifs du projet

  • Structurer et optimiser la conception
  • Faciliter les échanges avec les Développeurs
  • Augmenter la vélocité des Développeurs Front
  • Augmenter la qualité des livrables

Méthodologie

1

Inventaire des composants existants

2

Identification des composants à intégrer dans le Design System

3

Collaboration avec le Développeur Lead Front pour la mise en place de composants afin de garantir une bonne reutilisabilité en développement

4

Création de 2 Design System majeurs (app et web) connectés à une bibliothèque d’icones.

5

Mise à jour régulière en incluant les nouveaux composants utilisés
CTA Desktop

Règles de conception dédiées aux Développeurs Front leur indiquant les bonnes pratiques à suivre pour respecter les critères d’accessibilité et garantir une bonne lisibilité en marque blanche.

Input desktop

Différents états pour les champs de formulaires dans le but de garantir un maximum de fléxibilité en conception et gagner en rapidité de production.

Footer

Footer de la plateforme et ses variants

Résultats

  • Design System utilisé par 1 Product Designer, 8 Développeurs Front, 3 Product Owner, 1 Head of Product
  • Design System intégré aux tickets créés par les Product Owner permettant aux Développeurs d’avoir un accès rapide aux composants concernés
  • Réduction du temps dédié à la Design Review
  • Gain en qualité de Développement
  • Identification de 2 Développeurs Front comme étant responsable de l’intégration et la mise à jour des composants web et app.

Collaborons ensemble

Me contacter

avatar

Temps de réponse

1-2 jours ouvrés

Où me trouver ?