Les ingénieurs logiciels ont besoin de systèmes de conception pour créer des produits dotés d’une expérience utilisateur de qualité

Aujourd’hui, bon nombre d’équipes produit continuent de créer des interfaces utilisateur originales et de concevoir des expériences numériques entièrement inédites. Ce faisant, elles négligent les avantages de l’utilisation de modèles de conception existants et éprouvés. Cela se traduit bien souvent par un manque de convivialité, des incohérences visuelles et comportementales, ainsi que des cycles de conception plus longs. Pour améliorer la qualité globale de l’expérience utilisateur, les responsables de l’ingénierie logicielle devraient déployer un système de conception : un ensemble de ressources de conception réutilisables et de composants de code de la couche de présentation régis par des normes claires pour créer divers produits numériques.

« Les systèmes de conception constituent l’un des actifs stratégiques les plus importants pour votre entreprise. En tant que produits numériques en constante évolution, ils requièrent une équipe, une planification et un ensemble d’outils spécialisés », explique Brent Stewart, directeur principal et analyste chez Gartner.

Télécharger dès maintenant : Améliorer la qualité des logiciels en créant un environnement numérique immunisé

Quelle est la valeur ajoutée d’un système de conception ?

Un système de conception permet de créer un référentiel unique : un langage de conception central pour les concepteurs des expériences utilisateur qui leur permet de créer des expériences cohérentes au sein de diverses équipes, plateformes et divers canaux. La proposition de valeur d’un système de conception repose sur les éléments suivants :

• Rapidité : il réduit considérablement le temps de conception et de codage en tirant parti des modèles de conception de l’expérience utilisateur éprouvés au lieu de tout créer à partir de zéro.
• Extensibilité : il permet aux concepteurs et aux développeurs de partager des ressources de conception et des composants de code communs et approuvés sur l’ensemble d’un portefeuille de produits numériques.
• Conformité à la marque : il permet de s’assurer que chaque élément de conception est conforme aux attributs de la marque d’une organisation, tels que la couleur, le logo, la typographie, la voix, le ton, etc. 
• Réduction des défauts : au fil du temps, les composantes du code d’un système de conception sont consolidées, de sorte que les défauts de production sont rares au niveau de la présentation.

De quoi est constitué un système de conception ?

Un système de conception idéal comprend des jetons de conception, des modèles de conception des interfaces utilisateur personnalisables, des codes adaptés à la production et des instructions permettant de fournir en toute efficacité des produits numériques performants. Voici les quatre composantes d’un système de conception :

Ressources stylistiques

Les attributs visuels, écrits et comportementaux tels que les logos, la palette de couleurs, l’iconographie, la typographie, la voix ou le ton entrent dans le cadre des éléments stylistiques.

Les systèmes de conception avancés utilisent des jetons de conception pour centraliser la gestion des couleurs, des styles de texte, des icônes et autres. Les jetons de conception sont des entités indépendantes de la plateforme qui stockent les variables de conception et sont utilisés à la place des valeurs codées en dur telles que les valeurs pixel ou hexadécimales pour maintenir la cohérence de l’interface et de l’expérience utilisateur lorsque les systèmes de conception évoluent.

Ressources structurelles

Les ressources structurelles sont un assemblage d’éléments de conception de l’expérience utilisateur (boutons spécifiques, modèles de page, etc.) permettant de créer des présentations graphiques conviviales dans un délai plus court. 

L’approche de conception par atomes est l’un des moyens les plus répandus permettant de décrire la hiérarchie des ressources structurelles. Voici un aperçu général :

• Atomes : un atome est l’unité de base d’une interface utilisateur. Un champ de formulaire unique, un menu déroulant, un bouton ou une icône sont tous des atomes. 
• Molécules : une molécule est un petit groupe d’éléments d’interface utilisateur qui fonctionnent ensemble pour former une unité, un groupe de plusieurs atomes. Un ensemble de champs de formulaire ou un bouton d’envoi connexe peuvent constituer un excellent exemple de molécule.
• Organismes : un organisme est une entité plus complexe dans la hiérarchie de la conception de l’expérience utilisateur, une agrégation de molécules et d’atomes. Les exemples d’organismes comprennent la navigation utilitaire, la navigation globale, l’espace de haut de page et le pied de page.
• Modèles : un modèle est une structure réutilisable ou un agencement de conception formé par l’agrégation d’atomes, de molécules et d’organismes. Les modèles standard comprennent la page d’accueil, la page de la liste des produits, la page des informations détaillées sur les produits et le panier d’achats.
• Pages : une page est une version entièrement développée et optimisée d’un modèle. Lorsqu’un modèle est enrichi d’espaces réservés ou de contenu réel tel que du texte, des images ou des unités publicitaires, il devient une page.

Composantes du code

Les composantes du code sont un inventaire de codes prêts pour la production dans la structure sélectionnée. Ils sont organisés en utilisant la hiérarchie de la méthodologie de conception par atomes. Chaque atome, molécule, organisme et modèle de conception sont associés à une composante de code. Les systèmes de conception sophistiqués utilisent les composantes de code pour mettre à jour les couleurs, la typographie, l’espacement, etc., de manière centralisée.

Normes

Des principes directeurs, des directives d’utilisation et des politiques de gouvernance applicables doivent être mis en place pour créer des systèmes de conception efficaces.

Les principes directeurs garantissent que les ressources de conception et les composantes du code sont modulaires, configurables, génériques, flexibles et accessibles. Les directives d’utilisation comprennent les règles relatives à la typographie, à la palette de couleurs, aux dimensions et à l’espacement, à la grammaire, aux rapports d’aspect, au style d’écriture, etc.

Les politiques de gouvernance sont nécessaires pour pérenniser les normes données dans le temps. Au lieu de mettre en œuvre un modèle de gouvernance informatique classique, les responsables du génie logiciel peuvent utiliser une approche de type wiki. Elle peut donner aux contributeurs la liberté de créer, mettre à jour et supprimer les ressources de style, les ressources structurelles et les composantes de code sur une base ponctuelle, permettant aux équipes de produits d’améliorer le système de conception « à la volée ».

Pour garantir la crédibilité du système de conception, l’équipe de direction peut examiner les ajouts, les modifications et les suppressions lors de la publication de versions importantes, en plus de ses examens trimestriels.

Utiliser les systèmes de conception de l’expérience utilisateur existants 

Au fil des ans, divers systèmes de conception basés sur des plateformes et des systèmes open-source ont été lancés pour garantir une ergonomie optimale aux utilisateurs. Pour créer des applications sur les principales plateformes, il est fortement recommandé de réutiliser autant que possible ces systèmes de conception existants. Les ressources de conception et les composantes de code de ces systèmes s’appuient sur des recherches approfondies sur l’expérience utilisateur dans des catégories de produits telles que la gestion de la relation client (customer relationship management ou CRM) et les progiciels de gestion intégrés (enterprise resource planning ou ERP). 

Affectez une équipe aux systèmes de conception 

Traitez votre système de conception comme un produit numérique en établissant une équipe de gestion du produit composée d’un responsable du produit, d’un responsable de l’expérience utilisateur et d’un responsable du développement. 

Les trois responsables peuvent améliorer le système de conception en apportant des conseils opérationnels, conceptuels et techniques. L’équipe peut également compter sur des collaborateurs tels que des concepteurs de l’expérience utilisateur, des spécialistes de la stratégie de contenu, des développeurs front-end et des spécialistes de l’accessibilité pour gérer chaque version du système de conception.