Make it better – Typography demonstration

Voilà une animation qui a 1 an, mais cela n’enlève rien à sa qualité. Le principe est pourtant simple. Prenez une simple phrase du type « I’m gonna make it better » et dérivez là selon plusieurs procédés typographiques.

Je trouve que c’est une démonstration amusante des différents effets et ressentis visuels qu’on peut avoir avec la simple modulation d’une police de caractère et d’une composition dans l’espace. Il ne s’agit pas seulement de trouver une belle police sur Dafont ! Encore faut-il que ce soit la bonne typo selon son principe, et aussi faut-il bien l’utiliser.

Make it better from Sebastianbap on Vimeo.

Cette vidéo a été réalisée par Sebastián Baptista pour l’animation, Climent Canal pour le design et Aimar Molero pour la musique.

Jeu de composition

La vidéo commence par une interface de traitement de texte des plus classiques. Une petite barre qui clignote, des lettres qui s’affichent, une écriture hésitante. Nous avons même la classique faute de frappe engendrée par la double consonne. Un seul T, non 2, et pourquoi pas 3 ? Ah non, 2 T.

Cela commence simple, cela commence par de l’helvetica. Le tracé de cette typo est simple et vise à l’harmonie parfaite. C’est donc celle qui peut convenir à tous les usages. L’helvetica est une espèce de donneuse universelle en terme de choix de police.

Jeu de caractère

Puis on joue sur la composition dans la page. Une seule ligne, ou plusieurs ? Composition horizontale ou verticale ? Que choisir ?

Enfin on déforme la la lettre, puis on déforme la phrase. Il s’agit d’appliquer une patte et une graisse différente à chaque caractère dans un objectif précis. La modulation de chaque trait n’est au service que d’un message visuel.

Et si on est fou, on joue aussi sur la couleur.

Rendez-vous sur Hellocoton !

A propos de Uty

Mon pseudonyme est Uty. Je suis une fouineuse qui se pose beaucoup (trop) de questions et Chef de projet Web éditoriale dans un cabinet conseil en stratégie e-business. Je tiens ce blog depuis octobre 2009 dans lequel je note et j'essaie de décrypter les images du quotidien.
Cette entrée a été publiée dans Design and taguée , , , . Placez un signet sur le permalien.

One Response to Make it better – Typography demonstration

  1. flou dit :

    très sympa cette petite vidéo!

Laisser un commentaire

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

*

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>