Système de conception : qu'est-ce que c'est, pourquoi et comment le créer

Le sujet des systèmes de conception, semble-t-il, a déjà été abordé sous tous les angles : vous pouvez trouver de nombreux articles, publications, rapports et autres documents sur créer un système de conception. Malgré cela, tous ceux qui rencontrent ce terme se posent de nombreuses questions. Nous allons essayer de répondre en détail aux principales :

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

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

Un système de conception est une structure qui comprend des composants visuels, une bibliothèque de codes et des directives d'utilisation.

Souvent, les concepteurs débutants font l’erreur de simplifier le concept en considérant un système de conception comme un simple kit d’interface utilisateur – un document contenant des éléments d’interface graphique, une typographie et des couleurs.

Le système de conception se compose de trois niveaux :

A Kit d'interface utilisateur est le langage visuel d'un produit pour lequel un système de conception est créé. Ce sont des couleurs, des polices, des icônes, des boutons, des puces, des interrupteurs à bascule, des curseurs, des images et des animations. Les éléments varient et dépendent des spécificités du produit numérique. Tous contribuent à créer la partie visible de l’interface avec laquelle l’utilisateur interagit.

Le framework est une bibliothèque de codes écrite pour chacun de ces éléments, ainsi que des plugins pour l'animation, des balises et des étiquettes pour la navigation.

Recommandations sont un ensemble de modèles et de règles d'utilisation d'éléments qui organisent le processus de travail. Grâce aux lignes directrices, un concepteur n'est pas impliqué dans des tâches simples, mais un développeur est immédiatement impliqué.

Par exemple, les directives précisent les paramètres d'une fenêtre contextuelle sur un site Web : le retrait du texte, l'emplacement et la taille du titre et du corps du texte, l'emplacement d'un bouton et l'apparence de la fenêtre avec moins ou plus de texte.

Types de systèmes de conception

Il n’existe pas de classification unique, mais les experts distinguent deux types de systèmes de conception : open source et fermé.

Dans les systèmes open source, toute entreprise peut utiliser des matériaux et les adapter à ses projets – modifier les couleurs des boutons, les polices et les icônes. Par exemple, dans les systèmes Ant Design, Human Interface Guidelines et Material Design.

Les systèmes de conception à code source fermé sont généralement créés pour une entreprise ou un produit spécifique. Il s’agit soit de matériels totalement fermés, accessibles uniquement aux salariés, soit partiellement ouverts.

Comment créer un système de conception

Le développement de systèmes de conception repose sur les principes de la conception atomique. La conception atomique est une technique qui comprend cinq niveaux d'éléments de conception : atomes, molécules, organismes, motifs et pages.

Structure du système de conception :

• Atomes sont les plus petits composants : boutons, icônes, champs de saisie et polices.
• Molécules sont une combinaison de plusieurs éléments simples : deux boutons, un titre et une ligne de saisie, une barre de notification, une case à cocher et du texte.
• Organismes sont des composants complets : en-tête du site, formulaire d'autorisation, fiches produits et bannière de notification.
• Gabarits – mises en page sans contenu : menu, apparence du site.
• Nos Pages sont des pages remplies de contenu.

L'algorithme général ressemble à ceci :

• Sélectionnez les couleurs et les polices, définissez des grilles modulaires et sélectionnez l'animation, les images et les sons.
• Créez des éléments d'interface de base.
• Combinaisons et dispositions d'éléments de conception.
• Créez une liste d'éléments avec les règles. Dans la ligne directrice, précisez ce qu'est l'élément, où il est utilisé et quelles tâches il résout.

En règle générale, les systèmes de conception ne sont pas créés à partir de zéro, mais sont construits sur la base de matériel déjà développé : kits d'interface utilisateur, directives ou livres de marque.

Pourquoi avez-vous besoin d’un système de conception ?

Comme pour tout produit informatique, il est essentiel de répondre à la question « À quoi sert un système de conception ? » Ou, comme le remarquent certains collègues du magasin, « et alors » ?

La réponse à cette question vous aidera à comprendre la valeur du produit. Une partie de cela peut déjà être vue à partir de ce que nous avons décrit ci-dessus. Mais décomposons cela et examinons cela de plus près.

Automation

L'automatisation offre l'avantage le plus évident. Un système de conception vous aidera à automatiser les opérations, vous libérant ainsi du temps pour d’autres tâches.

Itératif

Être capable d'hériter et d'appliquer automatiquement des modifications aux éléments du système de conception est un outil précieux pour une équipe produit. Vous pouvez rapidement apporter des modifications cosmétiques, voire importantes, en un seul endroit. De cette manière, vous pouvez toujours améliorer le produit.

Cohérence

La cohérence stipule que les objets et entités d'un produit qui remplissent la même fonction doivent viser l'unité et la similitude.

Lorsque nous utilisons des fonctionnalités comparables dans un produit, elles deviennent familières et pratiques : nous comprenons instinctivement comment le bouton fonctionne et apparaît, ainsi que son emplacement.

Nous espérons que tout le monde a appris quelque chose de précieux grâce à cet article. Et nous avons été une fois de plus convaincus que travailler sur un article structure les connaissances et motive des études complémentaires.