Fermer

février 12, 2021

Ce que Saul Bass peut nous apprendre sur la conception Web16 minutes de lecture



À propos de l’auteur

Frederick O’Brien est un journaliste indépendant qui se conforme à la plupart des stéréotypes britanniques. Ses intérêts incluent la littérature américaine, le graphisme, le développement durable…
En savoir plus sur
Frédéric

Crédits de films, logos de marques, affiches… Saul Bass a tout fait, et les principes qui ont inspiré son travail sont tout aussi précieux aujourd'hui qu'ils l'étaient il y a 50 ans.

La conception Web existe à une belle intersection de disciplines différentes . Dans des articles précédents, j’ai écrit sur les leçons à tirer des journaux et des anciens architectes romains . Cette fois, nous allons examiner l’un des grands graphistes de tous les temps – Saul Bass.

Saul Bass est une légende du graphisme. Responsable des séquences de titres dans des films comme North by Northwest et Anatomy of a Murder ainsi que de nombreuses affiches et logos de marques emblématiques au fil des ans. Son travail, selon les mots de Martin Scorses, «distille la poésie du monde moderne et industrialisé».

 Une sélection de logos d'entreprise conçus par Saul Bass
De United Airlines à AT&T, Saul Bass a conçu certains des plus logos emblématiques de tous les temps. ( Grand aperçu )

Nous sommes maintenant dans un monde différent, un monde numérique à une vitesse vertigineuse, mais qui comporte sa propre poésie. Bien que la toile de fond ait changé, les méthodes et l'état d'esprit de Saul Bass ont résisté à l'épreuve du temps, et les concepteurs Web feraient bien de s'en souvenir.

Avant d'entrer dans les détails de Saul Bass et de son travail, il vaut la peine de décrire son approche du design en termes plus larges. Les grands personnages inspirent de grandes idées, mais comme c'est souvent le cas, le vrai truc est dans les détails.

Concernant son approche des séquences de titres, Bass a déclaré:

«Traitez des choses ordinaires, des choses que nous savons si bien que nous avons cessé de les voir; les traiter d'une manière qui nous permet de les comprendre à nouveau – en un sens qui rend l'ordinaire extraordinaire. »

– Saul Bass ( Source )

Un ethos similaire peut et doit être appliqué à création de sites web. En regardant son travail, oui, nous envisageons certainement des éclaboussures sur la page d'accueil, mais aussi des boutons, des formulaires d'inscription et des clauses de non-responsabilité. Il y a tout autant de beauté à trouver dans les petites choses. Parfois plus.

 Affiche conçue par Saul Bass pour le long métrage «Grand Prix»
Rien de ce que Saul Bass n’a fait n’a été une réflexion après coup. Chaque élément devait s'intégrer parfaitement à tout le reste, des titres aux crédits. ( Grand aperçu )

Que Bass soit même réputé pour les séquences de titre témoigne de sa créativité. Avant que Saul Bass n'entre en scène, les titres de films étaient généralement des affaires ennuyeuses, des noms et des images statiques livrés avec tout le bizazz des papiers de divorce. Sous son œil, ils sont devenus des œuvres d'art, des déclarations sur le ton et la texture de ce qui allait venir. Comme il l'a si brillamment dit,

«Le design, c'est la pensée rendue visuelle.»

– Saul Bass

Vous pouvez en savoir plus sur la vision de Saul Bass de son travail et de ses influences dans les pages et vidéos suivantes: [19659019] Couleur

Commençons par l'aspect le plus élémentaire – la couleur. Bass a dit un jour que «l’implication du public dans un film doit commencer dès sa première image.» De même, l’implication des visiteurs doit commencer dès le premier chargement. Nous traitons les couleurs et l'agencement d'un site Web avant d'avoir le temps de traiter son contenu. Vous ne trouverez pas de plus grand partisan du contenu de qualité que moi, mais il est gêné si on ne lui donne pas une toile de qualité sur laquelle se déplier.

For Bass est généralement traduit en palettes de couleurs simples et vives avec pas plus de trois quatre couleurs . Pas trop de monde, mais beaucoup de pop. Le rouge, le blanc et le noir sont l'une des combinaisons de couleurs dorées – une basse utilisée plusieurs fois. Les couleurs vives ne signifient pas toujours «fort», mais parfois «frappant».

 Affiches pour les films «Vertigo» et «Conseiller et consentir»
Saul Bass l'aimait du rouge, du blanc et du noir. ( Grand aperçu )
 Album pochette de «Tone Poems of Color» de Frank Sinatra
Plus stimulant que la tasse de Sinatra, non? (Source: MoMA ) ( Grand aperçu )

Qu'est-ce que cela signifie en termes de conception Web? Eh bien, un peu plus que «utiliser des couleurs vives», j'en ai peur. Étudiez la théorie des couleurs puis appliquez-la à vos projets de manière élégante et audacieuse. Plusieurs excellents articles sur le sujet énumérés à la fin de cette section, et la catégorie «Couleurs» de Smashing Magazine en contient beaucoup d’autres. Cela vaut bien l’attention. La bonne palette peut donner un ton avant même que les visiteurs aient traité ce qu'ils regardent.

Pour un exemple étrangement Saul Bass-esque de couleur et de forme en action sur le Web, prenez le Holiday Center for Working Youth dans Ottendorf . Quelle meilleure façon de célébrer une architecture audacieuse et fonctionnelle que par un design audacieux et fonctionnel? C’est comme une affiche Vertigo sous forme numérique.

 Capture d’écran de la page d’accueil du site Web du Centre de vacances pour jeunes travailleurs d’Ottendorf
Le site Web célèbre l’héritage non seulement par les mots, mais aussi par la couleur. ( Grand aperçu )

Le rouge, le blanc et le noir ne sont pas toujours la réponse (bien qu’il s’agisse d’une combinaison incroyablement nette). Le bon mélange dépend de l’histoire que vous essayez de raconter et de la manière dont vous essayez de la raconter. Saul Bass savait très bien que la couleur est un outil incroyablement puissant, et c'est un outil encore souvent sous-utilisé dans le monde primitif des espaces blancs du Web d'aujourd'hui.

 Capture d'écran de la page d'accueil du site Web du festival Lubmovka
Le festival Lubimovka pour les russophones les dramaturges utilisent la couleur sur son ​​site Web pour transmettre la vibrance de ce qu'elle fait. Cela prend ce qui aurait pu être une vieille image étouffante de Shakespeare et le rend dynamique et amusant. ( Grand aperçu )

La participation du public à un site Web commence par la couleur, alors faites en sorte que cela compte. Pour ceux qui ne savent pas par où commencer, voici une sélection d'articles Smashing sur le sujet:

Typography

Words, words, words. Le design peut être une pensée rendue visuelle, mais parfois la meilleure façon de dire quelque chose est de l'exprimer avec des mots. Bass avait un style typographique presque aussi distinctif que son style visuel. Brut, dessiné à la main et presque toujours en majuscules, il a rendu les mots puissants sans être envahissant.

 Collection d'images fixes de la séquence de titre d'ouverture «North by Northwest»
La séquence de titre de North by Northwest weds typography with couleur pour transformer le banal en spectaculaire. (Source: Art du titre ) ( Grand aperçu )

Les polices peuvent aussi raconter des histoires. Ils communiquent le ton de la voix, la formalité, l'importance et la structure, entre autres. Combinés à une palette de couleurs forte, ils peuvent faire danser la copie là où il pourrait autrement se sentir désolé pour lui-même.

 Capture d'écran de la page d'accueil du site Web de Kotak Toys
Fabricant de jouets russe Kotak utilise la typographie pour refléter le jeu , la nature mix-and-match de leurs jouets à empiler. ( Grand aperçu )

Le rédacteur Jon Ryder le présente magnifiquement sur son ​​site Web personnel qui est l'ensemble complet de couleurs fortes et de typographie audacieuse et ludique. Lorsque vous cliquez sur les invites, la copie se réorganise et se modifie d'elle-même. C’est une idée brillante exécutée avec élégance. Si Saul Bass était là pour concevoir des portfolios, c'est le genre de chose que vous attendez de lui.

 Capture d'écran de la page d'accueil du site Web du portfolio du rédacteur Jon Ryder
( Grand aperçu ) [19659009] Art of the Title se réfère à l'approche de Bass comme étant «typographie cinétique» et je pense que c'est une belle tournure de phrase à garder à l'esprit lors du choix des combinaisons de polices pour le Web. Oui, Times New Roman ou Arial fera un travail, mais avec la richesse des polices gratuites et des styles CSS disponibles, pourquoi ne voudriez-vous pas essayer de donner plus de vie à vos mots? Ce n'est pas toujours approprié, mais parfois cela peut être juste le ticket.

Ressources

Dessin

Celui-ci concerne autant le processus que les sites Web eux-mêmes. Saul Bass croyait fermement au dessin. Même à mesure que les technologies progressaient et que des opportunités se présentaient pour rationaliser le processus de conception, il a compris qu'il n'y avait pas de substitut au travail de vos mains pour essayer de faire sortir des idées de votre tête et les mettre dans le monde. Aux designers en herbe, il conseille:

«Apprenez à dessiner. Si vous ne le faites pas, vous allez vivre votre vie en contournant cela et en essayant de compenser cela. »

 Esquisses du storyboard de la scène de la douche dans le long métrage d'Alfred Hitchcock 'Psycho'
La scène de la douche dans Psycho a été scénarisé par nul autre que Saul Bass. ( Grand aperçu )

Quoi qu'il en soit – mise en page, logos, icônes – il n'y a pas de moyen plus rapide pour sortir les idées de votre tête qu'en les dessinant. À notre époque, qui ne signifie pas nécessairement stylo et papier, vous pouvez toujours utiliser des tablettes et autres, mais le principe sous-jacent est le même. Il n'y a pas de préréglages – juste vous et vos idées. Je ne suis pas Saul Bass, mais j'ai eu quelques bonnes idées à mon époque (au moins deux ou trois) et la plupart d'entre elles sont arrivées presque par accident dans le dessin de flux.

 Croquis au crayon d'un New York Times Première page étendue
( Grand aperçu )

La valeur du dessin surgit dans les endroits les plus invraisemblables et j'adore ça à chaque fois. Chaque première page du The New York Times commence par un croquis au crayon dessiné à la main par exemple. Existe-t-il des programmes informatiques sophistiqués qui pourraient faire un travail similaire? Bien sûr, et ils sont finalement utilisés, mais ils ne sont pas utilisés en premier. Peu importe qu'ils réfléchissent à des logos d'entreprise, réorganisent la page d'accueil d'un site Web ou préparent la première page d'un journal – les concepteurs dessinent.

Voici quelques bons articles sur la valeur du dessin dans un contexte de conception Web: [19659057] Une approche interdisciplinaire

Il est presque impossible de fixer une étiquette sur Saul Bass. À tout moment, il était graphiste, cinéaste, photographe, architecte. La liste se rallonge de plus en plus. Être alphabétisé dans tant de domaines était une nécessité, mais c'était aussi une véritable passion, une curiosité constante.

Prenez la séquence titre de Vertigo . Son esthétique en spirale emblématique remontait à des années plus tôt lorsque Bass tomba sur des diagrammes en spirale du mathématicien français du XIXe siècle Jules-Antoine Lissajous . Lorsqu'on lui a demandé de travailler sur Vertigo, l'idée s'est immédiatement mise en place. La théorie mathématique a trouvé son chemin dans une affiche de film d'Alfred Hitchcock, et qui sommes-nous pour discuter des résultats?

 Une sélection de diagrammes de courbes de Lissajous
( Grand aperçu )

Avoir un la spécialisation est évidemment importante dans n'importe quel domaine, mais il y a tant à gagner à sortir de nos voies. Toute personne ayant un intérêt même occasionnel pour le développement Web s'est presque certainement retrouvée à avoir besoin d'une approche protéiforme similaire – qu'elle le veuille ou non.

 Capture d'écran de la page d'accueil du site Web du portfolio de la designer Tonya Baydina
la géométrie ou la visualisation vidéo ou de données. Vous ne le saurez pas tant que vous n’aurez pas essayé. Ceci est le site Web du portfolio du designer Tonya Baydina . ( Grand aperçu )

Ingénierie, design, UX, typographie, rédaction, éthique, droit… tout comme en architecture, il y a peu de domaines qui n'enrichissent pas la compréhension du Web conception, alors n'ayez pas peur de vous plonger dans l'inconnu. Vous pourriez bien trouver l'inspiration parfaite.

Itérer, collaborer

Même les maîtres sont des étudiants, toujours en train d'apprendre, toujours en itération, souvent en collaboration. Bass avait bien sûr des idées fortes sur la forme que devraient prendre ses projets, mais ce n'était ni sa voie ni l'autoroute. Ne cherchez pas plus loin que les commentaires de Stanley Kubrick sur les affiches potentielles pour The Shining . Les deux ont parcouru des centaines de projets ensemble. Dans une lettre, Hitchcock a écrit: «Magnifiquement fait mais je ne pense pas qu'aucun d'entre eux ait raison.»

 Une conception d'affiche rejetée pour le long métrage de Stanley Kubrick «The Shining»
( Grand aperçu ])

On ne peut qu'imaginer combien d'heures Bass a asservi ces maquettes, mais quand on regarde celles qui sont rejetées, il est difficile d'être en désaccord avec Kubrick; magnifiquement fait, mais pas tout à fait correct. Je pense que le résultat final valait le travail, n'est-ce pas?

 Affiche du film de Stanley Kubrick «The Shining»
( Grand aperçu )

Nous vivons et travaillons dans un monde en grande partie de l’entreprise. Comme Bass, cela n'a pas à gêner les choses que vous faites. Tenez bon quand c’est ce que le moment exige, mais soyez toujours à la recherche de partenaires authentiques. Ils sont là-bas. Le client n’a pas toujours raison, mais il n’a pas toujours tort non plus. La collaboration fait souvent ressortir ce qu'il y a de mieux dans un projet, et même les génies doivent travailler comme un diable pour bien faire les choses. Il est difficile de battre ce flux communicatif cool où les ego et les insécurités sont hors de propos et il s'agit de rendre la chose aussi bonne que possible.

Voici quelques articles sur l'itération et l'expérimentation dans la conception Web que je J'ai vraiment aimé travailler sur:

Beauty For Beauty's Sake

Personne ne rêve de faire de l'art corporatif, mais Bass est un exemple d'excellence qui prospère dans ce monde. Des décennies, il tient toujours son propre et est souvent vraiment beau. Il a montré mieux que quiconque que concevoir pour gagner sa vie ne signifiait pas que la créativité ne pouvait pas s'épanouir. Que vous créiez des logos de marque ou des pages d'accueil, il y a beaucoup à dire pour les créatifs qui se battent dans leur coin. Vous le devez au travail.

Bass l'a dit mieux que je ne pourrais jamais.

«Je veux que tout ce que nous faisons soit beau. Je me fiche de savoir si le client comprend que cela vaut quelque chose, ou que le client pense que cela vaut quelque chose, ou si cela vaut quelque chose. Cela en vaut la peine pour moi. C’est la façon dont je veux vivre ma vie. Je veux faire de belles choses, même si personne ne s’en soucie. »

Tout le reste découle de cette philosophie, de la beauté pour la beauté. De la couleur à l'itération en passant par les petits détails, Saul Bass a montré la voie aux graphistes et aux concepteurs Web. Soyez audacieux, curieux et apprenez tout le temps. Faites de belles choses, même si personne ne s'en soucie.

 Smashing Editorial "width =" 35 "height =" 46 "loading =" lazy "decoding =" async (vf, yk, il)




Source link

0 Partages