Catégories
Astuces et Design

Le ratio d'or dans la conception: exemples et conseils

Cela pourrait ressembler à une leçon de mathématiques, mais accrochez-vous. Le nombre d'or combine un peu de mathématiques, un peu de nature et beaucoup d'applications pratiques pour les concepteurs. Voyons ce que le nombre d'or signifie pour la conception et quelques conseils pour l'utiliser dans vos projets de conception.

Le nombre d'or a été utilisé tout au long de l'histoire pour créer des éléments de conception qui ont un attrait visuel idéal. Parce que la forme est enracinée dans la nature et les mathématiques, c'est la combinaison parfaite d'équilibre et d'harmonie. Et c'est un superbe outil pour avoir votre manche en tant que designer.

Quel est le nombre d'or?

nombre d'or

Simplement, le nombre d'or (également appelé rectangle d'or et moyenne d'or) est une forme avec une proportion de 1 à 1,618.

Plus complexe, les mathématiques peuvent être décrites comme suit, comme l'explique l'Interaction Design Foundation:

Chaque nombre dans la séquence de Fibonacci est simplement la somme des deux nombres qui le précèdent. Il commence par 1, 1 (c.-à-d. 1 + le 0 invisible = 1), et les 10 premiers membres de la séquence sont 1, 1, 2, 3, 5, 8, 13, 21, 34, 55. Il continue infiniment .

nombre d'or

Calculez mathématiquement le rapport en utilisant la formule pour Phi: A / B = (A + B) / A = 1,618033987 = Φ

Les applications pour les projets d'impression et de conception web sont souvent moins précises que celles de 1 à 1.618. De nombreux concepteurs arrondiront les nombres lors de la création d'un nombre d'or mathématique pour des grilles plus faciles à utiliser.

Lorsqu'il s'agit d'appliquer le concept, il est souvent représenté à l'aide d'une spirale, de cercles ou de triangles.

Et ce n'est pas "juste une affaire de design". Le nombre d'or se retrouve dans la nature (coquille de nautile), l'art (la Joconde), l'architecture (la Tour Eiffel) ainsi que le design.

Comment l'utilisez-vous?

nombre d'or

En ce qui concerne l'application du nombre d'or, il existe différentes écoles de pensée:

  • Configurez la conception à l'aide d'une grille basée sur le rapport pour créer l'harmonie
  • Ne rien faire car cela s'applique, que vous le fassiez intentionnellement ou non

La meilleure solution pourrait être quelque part au milieu. Selon toute vraisemblance, votre œil est probablement formé pour créer et pencher vers des conceptions qui incluent cette théorie, mais cela ne peut jamais faire de mal de voir si vous l'appliquez bien.

Et la toile peut provoquer toutes sortes de problèmes en ce qui concerne le nombre d'or. Vous ne savez pas quelle taille de navigateur quelqu'un pourrait utiliser ou le rapport pourrait ne pas correspondre à une taille d'impression spécifique.

L'objectif est de créer des pièces dans la conception qui correspondent à cette forme idéale. Considérez-le pour un logo ou un recadrage photo. Utilisez-le pour créer un en-tête ou une certaine partie d'un dessin. Utilisez les concepts pour créer une grille de base ou une échelle hiérarchique pour la typographie.

Grilles et modèles

nombre d'or

Si vous êtes comme moi, l'idée de mathématiques complexes pour résoudre un problème de conception est un peu intimidante. C'est là qu'avoir de bons outils peut aider.

Voici quelques modèles et calculatrices pour faciliter un peu l'utilisation du nombre d'or.

3 conseils pour utiliser le nombre d'or

nombre d'or

Alors, comment mettez-vous toutes ces informations en pratique? (Nous ne voulons pas que vous repensiez les projets de conception et que vous soyez submergé par les mathématiques.)

Voici trois conseils pour utiliser le nombre d'or dans les projets de conception.

  • Utilisez le ratio pour créer une grille de site Web de base pour la zone de contenu principale et la barre latérale. Selon W3Schools, la résolution de navigateur la plus courante au début de 2018 est de 1366 par 768 pixels. Appliquez le nombre d'or pour une zone de contenu de 846 pixels de large avec une barre latérale de 520 pixels de large. Lorsque l'on considère le rapport à cet effet, la hauteur n'est pas importante.
  • Utilisez le rapport pour créer un guide d'espacement dans la conception. Prototypr.io a ce conseil: «Utilisez des carrés plus grands comme les unités 8 et 13 pour définir les dispositions. Utilisez des carrés plus petits de l'unité 1, 2 ou 3 pour définir les gouttières et l'espacement du contenu »sur la base de rectangles dorés.
  • Utilisez le ratio pour créer des éléments durables tels que des icônes ou des logos: avoir un élément durable avec une forte harmonie peut créer la structure des projets en cours. L'exemple ci-dessus comprend un modèle que vous pouvez télécharger et essayer.

Pourquoi le ratio d'or est-il important dans la conception?

Alors, pourquoi le nombre d'or est-il vraiment important pour les concepteurs?

C'est un outil de plus pour vous aider à créer quelque chose qui établit le bon ton émotionnel et visuel avec les utilisateurs. Cette théorie existe, que vous l'appliquiez intentionnellement ou non. Donc, ce qui compte, c'est que vous le compreniez et le reconnaissiez dans le but de créer la conception la meilleure et la plus utilisable possible.

Ce que le nombre d'or fait, c'est vous diriger vers les zones focales où l'utilisateur est susceptible de se concentrer et de regarder en fonction de la nature. Il aide à créer l'équilibre et l'échelle, même lorsqu'il n'est pas entièrement intentionnel.

Voici quelques sites Web bien conçus avec le modèle de rapport d'or superposé sur eux pour voir exactement comment il se rapporte aux conceptions individuelles.

nombre d'or
nombre d'or
nombre d'or
nombre d'or
nombre d'or

Conclusion

Voici donc votre clé pour comprendre et utiliser le nombre d'or: il est là, que vous y pensiez ou non. Alors pourquoi ne pas considérer comment cette théorie de conception éprouvée peut fonctionner pour vous et améliorer les projets?

Téléchargez le modèle que nous avons utilisé ici et insérez-le sur certaines de vos créations pour voir à quel point vous vous rapprochez sans même y penser.

Superposition Golden ratio conçue par Eightonesix

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *