paint-brush
Design Systems : la clé d'une mise à l'échelle efficace de vos applicationspar@elevenspace
413 lectures
413 lectures

Design Systems : la clé d'une mise à l'échelle efficace de vos applications

par Eleven Space8m2023/04/27
Read on Terminal Reader

Trop long; Pour lire

Un système de conception est un ensemble de règles de conception, de modèles d'interaction, de directives, de composants réutilisables et de documentation. Il s'agit d'un document évolutif qui fournit la base pour concevoir et développer de nouvelles fonctionnalités, ainsi que pour maintenir celles qui existent déjà. Il favorise une meilleure communication entre les concepteurs et les développeurs, garantissant un temps d'itération plus rapide, une réduction des coûts et une cohérence de conception.
featured image - Design Systems : la clé d'une mise à l'échelle efficace de vos applications
Eleven Space HackerNoon profile picture
0-item
1-item


L'extension des fonctionnalités de votre application est à la fois passionnante et stimulante. Cela nécessite beaucoup de préparation, de recherche, d'embauche de nouveaux membres d'équipe, de gestion de la collaboration entre les départements et d'investissement de ressources financières considérables pour construire une nouvelle architecture pouvant accueillir une large base d'utilisateurs et de nouvelles fonctionnalités.


Avant de décider de vous lancer dans ce voyage, assurez-vous d'avoir épuisé toutes les opportunités de mise à l'échelle.

Croître tout en maintenant les coûts au minimum

De nombreux entrepreneurs confondent "évoluer" avec "croissance" et utilisent les termes de manière interchangeable, manquant l'énorme potentiel commercial qui consiste à atteindre plus d'utilisateurs et à augmenter les revenus tout en maintenant les coûts et les ressources au minimum. Une façon d'y parvenir consiste à intégrer un système de conception dans le cycle de développement de votre application.


Même si les systèmes de conception ont gagné en popularité ces dernières années, il semble toujours y avoir une certaine confusion autour du concept, en particulier pour ceux qui ne sont pas des spécialistes du domaine.


Commençons donc par les bases.

Qu'est-ce qu'un système de conception ?

Un système de conception est un ensemble de règles de conception, de modèles d'interaction, de directives, de composants réutilisables et de documentation qui peuvent être utilisés lors de la création de produits numériques. Il s'agit d'un document évolutif qui fournit la base pour concevoir et développer de nouvelles fonctionnalités, ainsi que pour maintenir celles qui existent déjà.


En conséquence, il favorise une meilleure communication entre les concepteurs et les développeurs, garantissant un temps d'itération plus rapide, une réduction des coûts et une cohérence de conception. Ceux-ci contribueront à une expérience utilisateur transparente.

Composants du système de conception

Chaque système de conception est différent mais, en général, il abrite 4 piliers principaux :


  • Les jetons de conception sont tous les éléments visuels qui définiront les composants du système tels que la couleur, la typographie et le système de grille. Ils sont utilisés par l' équipe produit pour maintenir une conception cohérente et servent de base pour créer les propriétés de la bibliothèque de composants.


  • La bibliothèque de composants réunit des éléments interactifs qui seront utilisés pour créer l'interface de l'application, tels que des avatars, des boutons, des badges, des cases à cocher, des sélecteurs de date, des éléments d'entrée, des boutons radio et des barres de progression, pour n'en nommer que quelques-uns. Comme mentionné ci-dessus, ils sont conçus avec des propriétés spécifiques basées sur les éléments du langage de conception qui les rendent dynamiques. Ils sont particulièrement importants pour les programmeurs pendant la phase de développement.


  • Les bibliothèques de modèles englobent les composants et les jetons de conception utilisés dans les chemins communs à l'intérieur d'une application, tels que les menus de navigation et les formulaires. Communément implémenté avec la méthodologie de conception atomique , cela montre quand et comment les composants doivent être utilisés et leurs différents états (survol, clic, transition, etc.). Cela garantit une expérience cohérente pour l'utilisateur final de l'application.


  • Les directives sont toutes les règles et principes que les utilisateurs du système de conception doivent prendre en compte lorsqu'ils travaillent avec le système. Il sert de manuel qui montre le comportement et l'interaction du composant tout en rendant l'intégration des nouveaux membres plus efficace.


Maintenant que nous avons couvert les bases, voyons comment un système de conception peut être exploité pour faire évoluer une application sans avoir à investir un grand nombre de ressources.

Coûts d'extension des fonctionnalités de l'application

Prenons l'exemple d'une entreprise technologique B2C en phase de démarrage qui fait face au défi de ne pas respecter les délais de développement des fonctionnalités de son produit et doit trouver une solution afin de répondre aux attentes de ses parties prenantes et de ses investisseurs.


Leur équipe produit est composée de 1 x Product Owner, 1 x Designer, 5 x Développeurs (Front et Back end) et 1 x Assurance Qualité.


Nous explorerons plus en détail les scénarios potentiels que les décideurs envisageraient normalement de mettre en œuvre, en couvrant les coûts et l'allocation des ressources pour chaque option. ‍

Option A : dans ce cas, ils peuvent affecter des membres de l'équipe existante pour prendre en charge la nouvelle fonctionnalité en plus de leurs tâches quotidiennes et embaucher des spécialistes basés sur des projets pour gérer la charge de travail supplémentaire. Cela nécessite des ressources financières considérables pour supporter le coût de la main-d'œuvre supplémentaire, en plus du temps considérable nécessaire pour intégrer les nouveaux membres.


L'alternative à tout cela est d'investir dans un système de conception.


Option B : externaliser le développement du système de conception à une agence de conception dédiée et concevoir le parcours d'abonnement en interne une fois le système en place.


Variante A

Variante B

Main-d'œuvre supplémentaire

1 x Concepteur UX ( moy. salaire/h: 49$ )
2 développeurs ( moy. salaire/h : 57 $ Développeur front-end )

Agence de design/indépendant ( min. 60 $/heure mais les frais dépendent de l'emplacement et de l'expertise de l'agence)

Calendrier de mise en œuvre du projet

- Recrutement : min. 1 mois (repérage, entretien, paperasse)
- Intégration : 2 semaines
Conception du parcours d'abonnement : 1 mois (recherche, wireframes, conception, tests, boucles de rétroaction et mises à jour)
- Développement du parcours d'abonnement : 2 mois
- Test et optimisation : 2 semaines

- Recrutement de l'agence UI/UX et mise en place de la collaboration : 2 semaines
- Développement du système de conception : ±2 mois
- Conception du parcours d'abonnement : 1 semaine
- Développement du parcours d'abonnement : 2 semaines
- Test et optimisation : 3 jours

Temps total

5 mois

4 mois

Coûts additionnels

40 000 $
(1 x Concepteur 8 000 $ + 2 x Développeurs 32 000 $)

± 20 000 $
(pour une moyenne de ± 60 $ / heure pour le système de conception, le chemin d'abonnement lui-même est développé par l'équipe existante, il n'est donc pas considéré comme un coût supplémentaire)

Sur la base des scénarios ci-dessus, non seulement il est beaucoup plus efficace de commencer à penser à mettre en place un système de conception pour lancer plus rapidement le parcours d'abonnement, mais il s'agit en fait d'un investissement qui portera ses fruits pendant au moins cinq ans.


Aux fins de cet exercice, nous avons proposé une analyse de base du temps et des ressources nécessaires à la mise en œuvre d'un modèle basé sur l'abonnement qui nécessite la conception et le développement d'un nouveau chemin pour les paiements des utilisateurs finaux.


Nous avons décidé d'opter pour une approche minimaliste, facilement compréhensible, afin de changer l'idée reçue selon laquelle la mise en place d'un système de conception est un travail fastidieux, nécessitant trop de temps et de ressources. Pour cette raison, de nombreux entrepreneurs ont tendance à reporter l'adoption, perdant ainsi l'opportunité d'automatiser et d'optimiser leur activité.


Bien sûr, ce calcul sera différent en fonction de chaque cas spécifique à l'entreprise et nous encourageons les entrepreneurs à examiner leurs coûts réels, au cas par cas.

Allons maintenant plus en profondeur pour voir pourquoi les start-ups en pleine croissance devraient envisager un système de conception.

Avantages d'un système de conception

D'après notre expérience, la mise en œuvre d'un système de conception a augmenté la vitesse de conception et de mise en œuvre de 65 % dans une équipe à cycle complet, réduisant le travail d'un sprint de deux semaines, de 10 jours à 3,5 jours. Il faut quelques mois pour le construire et le mettre en place, mais chaque fois qu'une équipe opte pour cette approche, elle obtient des résultats fantastiques.

  1. Réduisez la charge de travail et les coûts L'évolutivité est l'un des principaux avantages d'un système de conception. Une fois tous les composants conçus, il est facile de les dupliquer et de faire de petits ajustements en fonction des besoins spécifiques.


    De cette façon, au lieu de devoir recommencer à zéro chaque fois que votre application a besoin d'une nouvelle fonctionnalité, votre équipe peut sélectionner des parties du système de conception et les développer. Plutôt que de perdre du temps à décider de l'apparence d'un bouton, ils peuvent se concentrer sur des aspects plus importants de l'entreprise, tels que l'amélioration des flux d'utilisateurs ou la résolution de problèmes qui non seulement réduisent les coûts, mais génèrent également des flux de trésorerie supplémentaires.


  2. Améliorez la collaboration inter-équipes

    Avec un système de conception en place, les concepteurs et les développeurs peuvent collaborer plus efficacement car ils ont accès aux mêmes informations, telles que les modèles et les composants de l'interface utilisateur, sur l'ensemble des projets. Il réduit les boucles de rétroaction et les innombrables heures perdues en réunions et élimine les conjectures. Le processus devient plus prévisible et l'intégration devient plus facile. Chaque fois qu'un nouveau membre rejoint l'équipe, la documentation du système de conception permettra l'alignement de l'équipe.


  3. Déploiement rapide du produit

    Les systèmes de conception peuvent réduire le temps nécessaire à l'intégration de nouveaux concepteurs en leur fournissant des exemples et des directives. Cela signifie qu'ils peuvent commencer à contribuer plus rapidement et que votre équipe sera ainsi plus cohérente. Il vous permet de faire évoluer votre équipe en utilisant les mêmes modèles encore et encore. Cela se traduit par moins de temps consacré à la formation de nouveaux employés et plus de temps consacré à la création d'excellents produits.


    Les systèmes aident également les développeurs à comprendre à quoi les choses doivent ressembler et se sentir. Ils peuvent se référer au guide de style lors de la création de nouvelles fonctionnalités ou en apportant des modifications à celles existantes et ne pas perdre de temps sur l'esthétique. Cela garantit que tout semble cohérent sur toutes les plates-formes et tous les appareils.


  4. Augmentez la fidélisation de la clientèle

    Une expérience intuitive et bien pensée a le pouvoir d'augmenter la conversion et de fidéliser la clientèle, ce qui génère un effet composé à long terme.


    Comme le note Nielsen Norman Group : "Si une tâche était particulièrement facile à accomplir par rapport aux attentes de l'utilisateur, cette expérience peut avoir un effet positif sur le produit — l'utilisateur peut être susceptible de recommander le produit à un ami et de devenir un utilisateur de retour" .

    La cohérence, une meilleure collaboration d'équipe et une allocation intelligente des ressources contribuent à créer une expérience transparente pour vos clients sur toutes les plateformes et dans l'application, ouvrant la voie à une croissance à long terme de manière efficace.

Options d'adoption du système de conception

Si vous avez déjà commencé à réfléchir à la manière d'intégrer ces avantages dans votre entreprise, vous devez choisir entre deux options d'adoption :


  • Création d'un système de conception personnalisé

  • Adapter un existant, comme un open-source


Il est essentiel d'avoir une compréhension claire des besoins de votre organisation avant de mettre en place un projet de système de conception et d'évaluer soigneusement les compromis.


Si une organisation a des exigences spécifiques qui ne peuvent pas être satisfaites par un système de conception open source, il sera judicieux d'investir dans la création d'un système de conception personnalisé.


Pour tester un système de conception, vous pouvez consulter certains des systèmes open source les plus populaires :

Pourcentage de choix de système de conception open source utilisé ou essayé entre 2019 et 2021 | Source


Dernières pensées

Il existe de nombreuses façons d'aborder l'expansion des applications, mais les systèmes de conception fournissent une base solide pour une évolutivité efficace, représentant ainsi une solution pour pérenniser l'ensemble du système. Non seulement cela présente des avantages à long terme, mais notre calcul rapide s'avère un choix financier encore plus intelligent pour les projets immédiats.


En utilisant des systèmes de conception, nous pouvons réduire le temps passé à réinventer la roue, améliorer la cohérence entre les produits et réduire les coûts en réutilisant les composants au lieu de les construire à partir de zéro à chaque fois.


Initialement publié ici