Un système de conception est un ensemble de composants, de directives et d'actifs réutilisables qui sont utilisés pour créer des interfaces utilisateur cohérentes et cohérentes sur différentes plates-formes et appareils. Il s'agit d'un cadre qui fournit aux concepteurs et aux développeurs un ensemble de règles, de principes et d'outils pour créer et maintenir un langage de conception unifié dans toute une organisation.

Les systèmes de conception comprennent généralement une variété d'éléments, tels que la typographie, les palettes de couleurs, l'iconographie, les grilles, les composants de l'interface utilisateur et les modèles de conception. Ils sont également souvent accompagnés d'une documentation détaillée et de directives décrivant comment ces éléments doivent être utilisés, garantissant la cohérence et réduisant la probabilité d'incohérences ou d'erreurs de conception.

L'objectif principal d'un système de conception est d'améliorer la collaboration et la productivité entre les concepteurs et les développeurs en leur fournissant un langage et une boîte à outils partagés. En disposant d'un ensemble d'éléments prédéfinis, les équipes peuvent travailler plus efficacement, réduire le travail redondant et créer des conceptions de meilleure qualité, plus faciles à maintenir et à faire évoluer au fil du temps. De plus, les systèmes de conception peuvent aider à garantir que l'image de marque et l'identité visuelle d'une entreprise restent cohérentes sur tous les points de contact et plates-formes.

Vous trouverez ci-dessous quelques systèmes de conception populaires qui ont gagné du terrain dans l'industrie du design et qui sont largement utilisés par les concepteurs et les développeurs.

1. Google — Système de conception matérielle

Google Material Design System est un système de conception complet qui propose un ensemble de directives, de composants et d'outils pour créer des interfaces utilisateur intuitives et réactives. Material Design a été introduit par Google en 2014 et est basé sur les principes de la conception matérielle, qui met l'accent sur l'utilisation de l'ombre et de la lumière pour créer un sentiment de profondeur et de hiérarchie, une typographie audacieuse et des palettes de couleurs vibrantes.

Material Design System fournit aux concepteurs et aux développeurs un large éventail de ressources, telles que des composants d'interface utilisateur, des icônes et une typographie, qui sont cohérentes sur différentes plates-formes et appareils. Il comprend également des directives et des principes de conception qui aident à assurer la cohérence, l'évolutivité et la convivialité du processus de conception.

Certaines fonctionnalités clés de Google Material Design System incluent :

• Une large gamme de composants d'interface utilisateur personnalisables, tels que des boutons, des cartes, des boîtes de dialogue et des barres de navigation, faciles à utiliser et à mettre en œuvre.
• Un ensemble complet de directives et de principes de conception qui aident à assurer la cohérence et la convivialité entre différents produits et plates-formes.
• Un ensemble robuste d'outils et de ressources, tels que des plug-ins Sketch et des modèles de conception, qui aident les concepteurs et les développeurs à créer rapidement et efficacement des conceptions de haute qualité.
• Un accent sur l'accessibilité et l'inclusivité, avec des lignes directrices pour la conception d'interfaces utilisateur utilisables par toutes les personnes, y compris les personnes handicapées.

Site Web —https://m3.material.io/

2. Système de conception Atlassian

Atlassian Design System (ADS) est un système de conception développé par Atlassian, une société de logiciels qui crée des outils permettant aux équipes de collaborer et de gérer des projets. ADS est conçu pour offrir une expérience cohérente et cohérente sur tous les produits et services d'Atlassian, tout en permettant la personnalisation et la flexibilité.

ADS propose une gamme de ressources pour les concepteurs et les développeurs, notamment des composants d'interface utilisateur, des directives de conception et des normes d'accessibilité. Il comprend également un langage de conception qui met l'accent sur la simplicité, la clarté et la convivialité.

Certaines fonctionnalités clés d'Atlassian Design System incluent :

• Un ensemble complet de composants d'interface utilisateur cohérents pour tous les produits et services Atlassian, y compris les boutons, les formulaires et les barres de navigation.
• Directives et principes de conception qui aident à assurer la cohérence et la convivialité sur différentes plateformes et appareils.
• Normes et directives d'accessibilité qui permettent de garantir que les produits et services d'Atlassian sont utilisables par tous, quels que soient leurs handicaps ou leurs déficiences.
• Personnalisabilité et flexibilité, permettant aux équipes d'adapter le système de conception à leurs besoins et exigences spécifiques.
• Un accent sur la collaboration et le travail d'équipe, avec des ressources et des outils qui aident les concepteurs et les développeurs à travailler ensemble plus efficacement.

Site Internet -https://atlassian.design/

3. Microsoft — Système de conception fluide

Fluent Design System est un système de conception développé par Microsoft qui fournit un ensemble complet de directives, de composants et d'outils pour créer des expériences utilisateur immersives, attrayantes et intuitives à travers les produits et services de Microsoft. Fluent Design System est basé sur cinq principes de conception clés : lumière, profondeur, mouvement, matériau et échelle.

Certaines fonctionnalités clés de Fluent Design System incluent :

• Un ensemble complet de composants d'interface utilisateur cohérents pour tous les produits et services Microsoft, y compris les boutons, les cartes et les barres de navigation.
• Un accent mis sur la lumière, la profondeur, le mouvement, le matériau et l'échelle, ce qui crée un sentiment de profondeur et de hiérarchie et donne vie aux éléments par le mouvement et l'animation.
• Un système de conception flexible et adaptable qui permet la personnalisation et la flexibilité, permettant aux équipes de créer des conceptions qui répondent à leurs besoins et exigences spécifiques.
• Un accent sur l'accessibilité et l'inclusivité, avec des lignes directrices pour la conception d'interfaces utilisateur utilisables par toutes les personnes, y compris les personnes handicapées.
• Une gamme d'outils et de ressources de conception, y compris des modèles de conception, des palettes de couleurs et de la typographie, qui aident les concepteurs et les développeurs à créer rapidement et efficacement des conceptions de haute qualité.

Site Web —https://www.microsoft.com/design/fluent/#/

4. Shopify — Système de conception Polaris

Shopify Polaris est un système de conception développé par Shopify, une société de commerce électronique qui fournit des outils pour les magasins en ligne. Polaris est conçu pour offrir une expérience cohérente et cohérente sur tous les produits et services de Shopify, tout en permettant la personnalisation et la flexibilité.

Polaris propose une gamme de ressources pour les concepteurs et les développeurs, notamment des composants d'interface utilisateur, des directives de conception et des normes d'accessibilité. Il comprend également un langage de conception qui met l'accent sur la simplicité, la clarté et la convivialité.

Certaines fonctionnalités clés de Shopify Polaris incluent :

• Un ensemble complet de composants d'interface utilisateur cohérents pour tous les produits et services Shopify, y compris les boutons, les formulaires et les barres de navigation.
• Directives et principes de conception qui aident à assurer la cohérence et la convivialité sur différentes plateformes et appareils.
• Normes et directives d'accessibilité qui aident à garantir que les produits et services de Shopify sont utilisables par toutes les personnes, quels que soient leurs handicaps ou leurs déficiences.
• Personnalisabilité et flexibilité, permettant aux équipes d'adapter le système de conception à leurs besoins et exigences spécifiques.
• Un accent sur la collaboration et le travail d'équipe, avec des ressources et des outils qui aident les concepteurs et les développeurs à travailler ensemble plus efficacement.

Site Web —https://polaris.shopify.com/

5. Système de conception de fourmis

Ant Design est un système de conception développé par Ant Group, une filiale du groupe Alibaba. Il s'agit d'un système de conception complet et polyvalent qui fournit une large gamme de composants d'interface utilisateur, de directives de conception et d'outils pour les concepteurs et les développeurs.

Ant Design est basé sur les principes de simplicité, de cohérence et d'efficacité, et est conçu pour aider les équipes à créer rapidement et facilement des conceptions de haute qualité. Il comprend une gamme de composants d'interface utilisateur, tels que des boutons, des formulaires et des barres de navigation, ainsi que des directives et des principes de conception qui aident à assurer la cohérence et la convivialité sur différentes plates-formes et appareils.

Certaines fonctionnalités clés d'Ant Design incluent :

• Un ensemble complet de composants d'interface utilisateur faciles à utiliser et personnalisables.
• Un accent sur l'accessibilité, avec des lignes directrices et des principes de conception qui aident à garantir qu'Ant Design est utilisable par toutes les personnes, quels que soient leurs handicaps ou leurs déficiences.
• Compatibilité multiplateforme, avec des composants d'interface utilisateur qui fonctionnent sur une gamme de plates-formes et d'appareils.
• Une gamme d'outils et de ressources de conception, y compris des fichiers Sketch, des jeux d'icônes et des extraits de code.
• Une communauté dynamique et solidaire de concepteurs et de développeurs qui contribuent au système de conception et aident à l'améliorer au fil du temps.

Site Internet -https://ant.design/

6. IBM — Système de conception carbone

IBM Carbon Design System est un système de conception développé par IBM, une société technologique multinationale qui propose une large gamme de produits et de services. Carbon est conçu pour fournir une expérience utilisateur cohérente et évolutive sur tous les produits et services d'IBM, tout en permettant la personnalisation et la flexibilité.

Carbon propose une gamme de ressources pour les concepteurs et les développeurs, notamment des composants d'interface utilisateur, des directives de conception, des normes d'accessibilité et des outils de développement. Il comprend également un langage de conception qui met l'accent sur la simplicité, la clarté et la convivialité.

Certaines fonctionnalités clés d'IBM Carbon Design System incluent :

• Un ensemble complet de composants d'interface utilisateur cohérents pour tous les produits et services IBM, y compris les boutons, les formulaires et les barres de navigation.
• Directives et principes de conception qui aident à assurer la cohérence et la convivialité sur différentes plateformes et appareils.
• Normes et directives d'accessibilité qui aident à garantir que les produits et services d'IBM sont utilisables par tous, indépendamment des handicaps ou des déficiences.
• Personnalisabilité et flexibilité, permettant aux équipes d'adapter le système de conception à leurs besoins et exigences spécifiques.
• Un accent sur la collaboration et le travail d'équipe, avec des ressources et des outils qui aident les concepteurs et les développeurs à travailler ensemble plus efficacement.

Site Web —https://carbondesignsystem.com/

7. Amplifier AWS

AWS Amplify est un système de conception et une plate-forme de développement développés par Amazon Web Services (AWS), une plate-forme de cloud computing qui fournit une large gamme de services aux entreprises et aux organisations. AWS Amplify est conçu pour aider les développeurs à créer rapidement et efficacement des applications et des services évolutifs basés sur le cloud.

AWS Amplify comprend une gamme de ressources et d'outils pour les développeurs, notamment des bibliothèques, des composants d'interface utilisateur et des cadres de développement. Il offre également un ensemble d'outils et de services de développement qui simplifient le processus de création et de déploiement d'applications basées sur le cloud, telles que l'authentification, le stockage et l'analyse.

Certaines fonctionnalités clés d'AWS Amplify incluent :

• Un ensemble complet de bibliothèques et de composants d'interface utilisateur pouvant être utilisés pour créer des applications évolutives et réactives pour une variété de plates-formes et d'appareils.
• Cadres et outils de développement qui simplifient le processus de création et de déploiement d'applications basées sur le cloud, telles que l'authentification, le stockage et l'analyse.
• Un accent sur la sécurité et la conformité, avec des ressources et des outils qui aident à garantir que les applications sont sécurisées et conformes aux exigences réglementaires.
• Une gamme d'options de personnalisation, permettant aux développeurs d'adapter le système de conception à leurs besoins et exigences spécifiques.
• Intégration avec d'autres services AWS, tels qu'Amazon S3, Amazon Cognito et Amazon CloudFront, permettant aux développeurs d'intégrer facilement ces services dans leurs applications.

Site Web —https://aws.amazon.com/amplify/

8. Système de conception Audi

L'Audi Design System est un langage et un système de conception développés par le constructeur automobile allemand Audi pour fournir une identité visuelle cohérente et cohérente à travers ses produits et ses plateformes numériques. Le système de conception englobe une gamme d'éléments de conception, y compris la typographie, les couleurs, la mise en page et les icônes, ainsi que des directives pour la conception d'interfaces et d'expériences utilisateur.

L'Audi Design System est conçu pour refléter les valeurs fondamentales de l'entreprise, telles que l'innovation, la précision et la progressivité, et pour créer une image de marque haut de gamme et ambitieuse. Le système est utilisé non seulement dans la conception des voitures d'Audi, mais également dans la conception de ses produits numériques, tels que les sites Web, les applications et les interfaces pour les systèmes de divertissement et de navigation embarqués.

Certaines caractéristiques clés de l'Audi Design System comprennent :

• Un accent sur la simplicité et le minimalisme, avec des lignes épurées, une typographie claire et une palette de couleurs limitée.
• Un langage visuel cohérent et cohérent sur tous les produits et plates-formes, créant une identité de marque unifiée.
• Un fort accent sur l'expérience utilisateur, avec des lignes directrices pour la conception d'interfaces et d'interactions intuitives et faciles à utiliser.
• Un équilibre entre tradition et innovation, reflétant l'histoire d'Audi en matière de savoir-faire et d'excellence en ingénierie tout en adoptant les nouvelles technologies et les tendances du design.

Site Web —https://www.audi.com/ci/en/guides/user-interface/introduction.html

9. Spotify - Système de conception des coulisses

Le système de conception Backstage de Spotify est un système de conception créé par la plate-forme de streaming musical populaire pour fournir un langage de conception unifié et cohérent pour son portail de développement interne et les outils associés. Le système de conception Backstage comprend des directives pour la typographie, la couleur, la mise en page et l'iconographie, ainsi que des directives pour la conception d'interfaces et d'expériences utilisateur.

Le système de conception Backstage est conçu pour créer une expérience cohérente et intuitive pour les développeurs internes de Spotify, leur permettant d'accéder et d'utiliser facilement les outils et les ressources dont ils ont besoin pour créer et maintenir la plate-forme. Le système est construit sur un framework appelé Backstage, qui est une plate-forme open source développée par Spotify pour la gestion des portails de développeurs.

Certaines fonctionnalités clés du système de conception Backstage incluent :

• Un accent mis sur la modularité et la flexibilité, permettant une personnalisation et une extension faciles du système de conception.
• Un fort accent sur l'accessibilité et la convivialité, avec des directives pour la conception d'interfaces faciles à naviguer et à utiliser pour les développeurs de tous niveaux de compétence.
• Un langage visuel unifié et cohérent sur tous les composants et outils Backstage.
• Un engagement envers le développement et la collaboration open source, avec le framework et le système de conception Backstage disponibles pour la communauté des développeurs au sens large.

Site Web —https://backstage.io/docs/dls/design/

10. Uber — Système de conception de base

Le système de conception de base d'Uber est un système de conception complet développé par le géant du covoiturage pour fournir un langage de conception unifié et évolutif à travers ses produits et plates-formes. Le système de conception de base comprend des directives pour la typographie, la couleur, la mise en page et l'iconographie, ainsi que des directives pour la conception d'interfaces et d'expériences utilisateur.

Le système de conception de base est conçu pour créer une expérience cohérente et intuitive pour les clients, chauffeurs et autres utilisateurs d'Uber, tout en fournissant un langage de conception flexible et modulaire qui peut être adapté à différents produits et cas d'utilisation. Le système est construit sur les principes de conception d'Uber, qui mettent l'accent sur la simplicité, la clarté et la convivialité.

Certaines fonctionnalités clés du système de conception de base incluent :

• Un accent mis sur la modularité et l'évolutivité, permettant une personnalisation et une extension faciles du système de conception pour accueillir de nouveaux produits et cas d'utilisation.
• Un fort accent sur l'accessibilité et l'inclusivité, avec des directives pour la conception d'interfaces faciles à utiliser et à naviguer pour les utilisateurs de tous horizons et capacités.
• Un langage visuel unifié et cohérent sur tous les produits et plates-formes Uber, offrant une identité de marque reconnaissable et mémorable.
• Un engagement envers l'amélioration continue et l'itération, avec des mises à jour et des améliorations régulières du système de conception en fonction des commentaires et des données des utilisateurs.

Site Web —https://baseweb.design/

Au cas où, si j'oubliais certains des systèmes de conception les plus utilisés, je serais reconnaissant de voir vos commentaires ici pour en discuter.

Si vous avez trouvé cet article utile, attrayant, utile et que vous souhaitez me soutenir, assurez-vous de :

• Clap for the story (50 claps) pour aider cet article à être mis en avant
• Suivez-moi sur : Medium / LinkedIn