Vibulary
Menu
Apparence et langue
Termes par sujet · 50 guides

Conception

Apprenez comment rendre les écrans clairs, cohérents, faciles à utiliser et accessibles à tous.

01 / Atlas

Tous les termes Conception

Ouvrir un terme pour une signification simple, un exemple, quand l'utiliser, son caractère officiel, et son nom de code.

  1. 01 · Noyau

    Accessibilité Accessibility

    L'accessibilité aide les personnes avec des capacités différentes à comprendre et utiliser un produit.

  2. 02 · Plus de détails

    Affordance Affordance

    Une affordance est un indice visuel ou tactile qui montre comment on peut utiliser un objet.

  3. 03 · Noyau

    Anneau de focus Focus Ring

    Une ligne visible ou un surlignage autour du contrôle qui reçoit actuellement la saisie au clavier.

  4. 04 · Plus de détails

    Aqua Aqua

    Aqua est un style d'interface brillant lié aux premières versions de macOS. Il utilise des contrôles lumineux, de la profondeur comme du gel, des rayures fines et des accents bleu vif.

  5. 05 · Plus de détails

    Brutalisme Web Web Brutalism

    Le brutaliste web est un style web brut. Il montre la structure, les paramètres par défaut du navigateur, une typographie simple et une rugosité planifiée plutôt que le polissage habituel.

  6. 06 · Plus de détails

    Claymorphisme Claymorphism

    Le claymorphisme est un style ludique avec des formes gonflées et des coins arrondis. Des ombres douces et des surfaces pastel donnent l'impression d'argile.

  7. 07 · Plus de détails

    Coin Squircle CSS CSS Squircle Corner

    Dans le projet de CSS Borders Level 4, squircle est une valeur de forme de coin pour une superellipse convexe entre rond et carré. Elle équivaut à superellipse(2), nécessite un rayon de bord non nul, et nécessite toujours une vérification de compatibilité navigateur.

  8. 08 · Noyau

    Composant Component

    Un Component est une partie réutilisable d'une interface avec une structure, un comportement, des états et des limites clairs.

  9. 09 · Noyau

    Contraste des couleurs Color Contrast

    Le contraste des couleurs est la différence de lumière mesurée entre le contenu et son arrière-plan proche. Il montre si le texte clé et les contours sont faciles à voir.

  10. 10 · Noyau

    Dégradé Gradient

    Un dégradé est un changement tout doux entre des couleurs ou de la transparence. Il peut suivre une ligne, un cercle, un angle ou une grille (mesh).

  11. 11 · Noyau

    Design éditorial Editorial Design

    Le design éditorial organise une histoire à travers le rythme de lecture, la typographie, les images, les légendes et les motifs de page qui se répètent.

  12. 12 · Noyau

    Design matériel Material Design

    Le design matériel est un système pour composants et interactions. Il utilise des surfaces superposées, un mouvement avec un objectif, des mises en page flexibles et des tokens de design partagés.

  13. 13 · Noyau

    Design Organique Organic Design

    Le design organique suit des formes que l'on trouve dans la nature. Il utilise des courbes irrégulières, des textures tactiles, des couleurs naturelles et des mises en page moins mécaniques.

  14. 14 · Noyau

    Design plat Flat Design

    Le design plat utilise des formes simples, des couleurs unies et des zones plates claires, avec peu de profondeur factice.

  15. 15 · Noyau

    Design Responsive Responsive Design

    Le Design Responsive permet à la mise en page, au contenu et aux contrôles de changer pour s'adapter à l'espace et à l'appareil disponibles.

  17. 17 · Noyau

    E-commerce Direct au Consommateur DTC E-commerce

    Le commerce électronique DTC permet à une marque de vendre directement aux consommateurs. Il couvre la découverte, le choix des produits, le paiement, la livraison et l'assistance après-vente.

  20. 20 · Noyau

    Esthétique du terminal Terminal Aesthetic

    L'esthétique Terminal emprunte aux écrans de ligne de commande. Elle utilise un texte à espacement fixe, une hiérarchie serrée, des marques d'invite, peu de couleurs et un statut clair.

  21. 21 · Plus de détails

    Esthétique numérique Y2K Y2K Digital Aesthetic

    Cette esthétique numérique est un style rétro-futuriste issu de la culture numérique de la fin des années 1990 et début des années 2000. Elle utilise souvent le chrome, les pixels, les dégradés vifs et des détails informatiques ludiques.

  22. 22 · Noyau

    État de l'interaction Interaction State

    Un état d'interaction montre la condition actuelle d'un contrôle. Par exemple : par défaut, survol, focus, appuyé, désactivé, chargement, erreur et succès.

  23. 23 · Plus de détails

    Frutiger Aero Frutiger Aero

    Frutiger Aero est un style optimiste des années 2000. Il mélange des interfaces brillantes avec des ciels bleus, de l'eau, des plantes vertes, des bulles et une technologie au look amical.

  24. 24 · Plus de détails

    Glassmorphisme Glassmorphism

    Le Glassmorphisme est un style visuel avec des surfaces claires et superposées. Il utilise le flou, les bordures lumineuses et une petite sensation de profondeur.

  25. 25 · Noyau

    Hiérarchie visuelle Visual Hierarchy

    La hiérarchie visuelle guide ce que les gens remarquent en premier, ensuite et en dernier grâce à la taille, le contraste, l’emplacement et l’espace.

  26. 26 · Plus de détails

    Iconographie Iconography

    L'iconographie est un ensemble de symboles partagés avec des apparences cohérentes et des significations claires pour les actions et les idées.

  27. 27 · Noyau

    Illustration ludique Playful Illustration

    L'illustration ludique utilise des personnages, des formes, des couleurs et des blagues visuelles animés. Elle peut ajouter de la chaleur, du sens ou du caractère à une marque.

  28. 28 · Noyau

    Jeton de conception Design Token

    Un Design Token donne un nom à un seul choix de design. Par exemple : une couleur, un espace, une police ou une vitesse d'animation.

  29. 29 · Noyau

    Minimalisme Minimalism

    Le minimalisme supprime ce dont un design n'a pas besoin. Il garde néanmoins le produit clair, utile et distinct.

  30. 30 · Noyau

    Mode sombre Dark Mode

    Le mode sombre modifie les surfaces, le texte, les bordures, les médias et les états pour un paramètre sombre.

  31. 31 · Plus de détails

    Néobrutalisme Neobrutalism

    Le néobrutalisme est un style numérique audacieux à fort contraste. Il utilise des formes simples, des bordures épaisses, des couleurs directes et une disposition mécanique claire.

  32. 32 · Plus de détails

    Neumorphisme Neumorphism

    Le neumorphisme est un style doux et à faible contraste. Les ombres claires et foncées donnent aux contrôles l'apparence d'être en relief ou enfoncés dans une surface d'une seule couleur.

  34. 34 · Noyau

    Palette de couleurs Color Palette

    Une palette de couleurs est un ensemble de couleurs réfléchi. Chaque couleur a un rôle, un état ou une surface précis.

  36. 36 · Noyau

    Rayon de bordure CSS CSS Border Radius

    La propriété border-radius CSS transforme les coins des boîtes en quarts d'ellipse en utilisant des rayons horizontaux et verticaux. Elle modifie la peinture et le masquage, mais pas la taille de la boîte dans la mise en page, et ne crée pas un squircle mathématique.

  38. 38 · Noyau

    Site d'entreprise B2B B2B Corporate Site

    Un site corporate B2B aide les entreprises à vérifier les compétences, les règles, la fiabilité et la compatibilité d'une autre entreprise. Il aide aussi pour les achats ou les partenariats.

  39. 39 · Noyau

    Site marketing SaaS SaaS Marketing Site

    Un SaaS Marketing Site explique un problème et un service logiciel à un public. Il aide les visiteurs à juger si ça leur convient et à choisir la prochaine étape.

  40. 40 · Plus de détails

    Skeuomorphisme Skeuomorphism

    Le skeuomorphisme copie des objets réels familiers pour expliquer un contrôle numérique. Il peut également copier leurs matériaux.

  41. 41 · Plus de détails

    Style Memphis Memphis Style

    Le style Memphis est un look postmoderne audacieux. Il utilise des formes fortes, des couleurs contrastées, des motifs, un équilibre inégal et une énergie ludique.

  42. 42 · Plus de détails

    Style suisse Swiss Style

    Le style suisse utilise des grilles claires et des mises en page inégales mais équilibrées. Il utilise également des polices sans-serif, des photos et un ordre visuel strict.

  44. 44 · Plus de détails

    Tapez l'échelle Type Scale

    Une échelle de typographie est un petit ensemble planifié de tailles de texte et de hauteurs de ligne.

  45. 45 · Noyau

    Typographie Typography

    La typographie est la façon dont les styles de texte sont choisis et organisés pour rendre les mots lisibles, ordonnés et conformes à la marque.

  46. 46 · Noyau

    Variante Variant

    Une variante est une version approuvée d'un composant pour une taille, une force ou un paramètre différent.

  47. 47 · Plus de détails

    Verre Liquide Liquid Glass

    Le Verre Liquide est un style de matériau clair et en mouvement. Il utilise des effets de lentille, des reflets et des formes qui semblent se joindre ou se plier.

  48. 48 · Plus de détails

    Wabi-sabi Wabi-sabi

    Wabi-sabi est une vision japonaise de la beauté. Elle valorise les limites, le changement, la forme irrégulière, l'âge et les matériaux authentiques plutôt que la perfection polie.

  49. 49 · Plus de détails

    Web vernaculaire Vernacular Web

    Le web vernaculaire copie les sites quotidiens que les communautés créent. Il diffère des systèmes soignés réalisés par de grands groupes.

  50. 50 · Plus de détails

    Windows Aero Windows Aero

    Windows Aero est un style de bureau de la fin des années 2000. Il utilise des cadres de fenêtres translucides, du verre flouté, une lueur douce et des bordures superposées.