Aller au contenu

Chapitre 07 · Design et effet

Des contenus qui agissent

Un passant accorde deux secondes à votre écran. Comment une diapositive passe en ce temps-là – de la taille de police à la boucle, jusqu'à ce qui n'a jamais sa place sur un écran.

Dans un cabinet dentaire, un grand display était accroché au-dessus de la réception. On y voyait une page PDF avec le concept d'hygiène, onze paragraphes, étirée en image au format seize neuvièmes. Personne ne la lisait, et personne n'aurait pu la lire. L'écran était bien choisi, assez lumineux, proprement monté. Seul ce qui tournait dessus était faux.

La dramaturgie d'une boucle

Une boucle n'est pas un dossier plein de fichiers, mais une succession avec un rythme. La longueur utile se situe entre une et trois minutes. Qui regarde en passant ne voit de toute façon qu'une ou deux diapositives ; qui attend – à la réception, à la caisse, dans l'ascenseur – ne doit pas voir quatre fois la même affirmation.

Cinq à huit diapositives par boucle suffisent. Plus de messages diluent l'installation, parce que chacun revient plus rarement. N'ordonnez pas par importance, mais par alternance : diapositive calme, diapositive animée, diapositive calme. Deux vidéos à la suite paraissent agitées, deux diapositives de texte à la suite ressemblent à une présentation. Placez plutôt le message le plus important à deux endroits de la boucle que de le rallonger.

Dans les lieux d'attente, une autre règle s'applique qu'en vitrine. En salle d'attente, une diapositive peut rester plus longtemps et raconter davantage, parce que votre public a du temps. En vitrine compte le trajet du feu jusqu'à la porte, c'est-à-dire quelques pas. La même boucle ne convient jamais aux deux – prévoyez-en une par lieu.

Une diapositive, un message

La cause la plus fréquente d'écrans sans effet n'est pas une mauvaise composition, mais trop de contenu sur trop peu de surface. Une diapositive porte un message. Qui en montre deux n'en montre aucun.

Construisez chaque diapositive en trois niveaux. Un accroche-regard qui dit en une demi-seconde de quoi il s'agit – une image, un chiffre ou un seul mot. Une ligne principale avec le message, cinq à sept mots. En dessous une ligne avec le strict nécessaire : prix, date, lieu. Il n'en faut pas plus, et personne n'en lit davantage.

Le blanc n'est pas de la place perdue, mais le moyen qui rend la ligne principale grande. Une surface calme autour du message agit plus fort à dix mètres qu'une diapositive pleine à ras bord. Guidez le regard : l'œil commence en haut à gauche ou au centre et finit en bas à droite – c'est là que va l'indication de ce qu'il faut faire. Et vérifiez chaque diapositive debout, à la vraie distance, pas au bureau. La différence est dégrisante et instructive.

La typographie à distance

La typographie à l'écran est autre chose que la typographie sur papier. Comme règle empirique, nous comptons un millimètre de hauteur de capitale pour deux cents millimètres de distance d'observation : à cinq mètres, la ligne principale a donc besoin d'un bon vingt-cinq millimètres de hauteur sur le verre, pas dans le gabarit. Mesurez sur l'appareil, le chiffre surprend la plupart des gens.

Ce qui compte à distance :

  • une graisse moyenne à forte ; les graisses fines disparaissent sur les displays clairs, parce que la surface lumineuse mange les déliés
  • une police aux formes ouvertes et à la distinction claire entre I, l et 1
  • un peu plus d'interlettrage pour les petites lignes, un peu moins pour les très grandes
  • des lignes de cinq à six mots au maximum, mieux vaut couper que réduire
  • des capitales seulement pour les mots courts ; des lignes entières en capitales perdent la forme du mot et se lisent plus lentement
  • un fort écart de luminosité entre le texte et le fond, vérifié dans la lumière la plus défavorable de la journée

Si une ligne ne tient pas, c'est la phrase qui est trop longue – pas la police qui est trop grande.

Couleur et contraste à l'écran

Un display émet de la lumière, le papier en reçoit. C'est pourquoi les couleurs paraissent plus intenses à l'écran, et les grandes surfaces claires éblouissent vite en intérieur. Dans un lobby sombre, une diapositive sombre avec du texte clair est plus agréable. En vitrine, à la lumière du jour, la surface claire avec texte sombre l'emporte presque toujours, parce qu'elle résiste à la luminosité ambiante.

Votre charte graphique est faite pour le papier et doit être traduite pour l'écran. Un gris délicat, distingué sur du papier à lettres, se distingue à peine du blanc sur un display. Gardez la couleur maison et la couleur d'accent, mais autorisez-vous une nuance plus soutenue pour le texte sur fond coloré. Deux couleurs plus le blanc et le noir suffisent pour presque chaque diapositive.

Pensez aux daltonismes rouge-vert : ne transportez jamais l'information par la couleur seule, mais aussi par le mot, la forme ou la position. Et regardez vos diapositives une fois à midi, avec le soleil sur la vitre. Ce qui est lisible alors est lisible. Quelle luminosité un appareil doit avoir pour quelle situation, c'est le chapitre sur le matériel qui le dit.

Mouvement, image et vidéo

Le mouvement attire le regard – mais seulement s'il est l'exception. Si quelque chose bouge en permanence sur toute la surface, l'œil se fatigue et se détourne. Le mieux est une diapositive calme qui reste en place et un changement qui entre et sort proprement. Une demi-seconde à une seconde de fondu suffit ; tout ce qui est joueur – tourner, voler, sauter – paraît bon marché au plus tard au troisième passage. Les logos volants sont le moyen le plus sûr de faire paraître une installation vieillotte.

Les vidéos tournent en surface de vente pratiquement toujours sans son. Cela veut dire : le message doit figurer dans l'image. Gardez les clips courts, quinze à trente secondes, ajoutez des sous-titres ou du texte incrusté et commencez par l'image la plus forte plutôt que par un générique. Là où de la musique passe, réglez les droits à l'avance ; pour la diffusion publique s'applique le tarif SUISA compétent.

Pour les images, c'est d'abord la résolution qui compte, puis le cadrage. Prenez du matériel à la résolution de la surface, en portrait donc à la verticale – un paysage tourné avec des bandes se trahit tout de suite. Les images de banque sont permises, mais paraissent interchangeables : une prise de vue de votre équipe, de votre magasin, de votre atelier bat n'importe quel sourire acheté. Et réglez les droits à l'image et de la personnalité avant qu'une photo n'arrive sur une surface publique.

Les gabarits sauvent l'installation

Tout ce que vous savez sur la composition ne sert à rien si la diapositive est faite le vendredi après-midi par quelqu'un qui a justement du temps. Les gabarits résolvent ce problème. Ils imposent la mise en place, les tailles de police, les couleurs et le cadrage, et la rédaction ne remplit plus que le texte et l'image. Une installation avec gabarits a encore l'air, un an plus tard, de ce qu'elle était le premier jour.

Une famille de gabarits utile compte six membres :

  • Action : accroche, offre, validité
  • Information : horaires d'ouverture, indications, procédures
  • Menu ou liste de prix : plusieurs lignes, largeur de colonne fixe
  • Équipe ou portrait : image, nom, fonction
  • Événement : date, titre, lieu, inscription
  • Urgence ou panne : une ligne, fort contraste, utilisable immédiatement

Le dernier sert rarement et vaut de l'or quand l'ascenseur est en panne ou l'entrée bloquée. Créez les gabarits dans le logiciel où l'on travaillera plus tard, pas dans un programme graphique que seule l'agence possède. Qui entretient et qui valide se trouve dans le chapitre sur le logiciel et l'exploitation.

Ce qui n'a jamais sa place à l'écran

Il existe une courte liste de choses qui dévaluent à coup sûr une installation. Je les vois partout, et elles coûtent plus de crédibilité que n'importe quelle fonction manquante.

  • Du texte courant : plus de trois lignes, personne ne les lit debout
  • Des pages PDF et des documents texte en image, marges et numéro de page compris
  • Des tableaux issus du tableur, avec quadrillage et notes de bas de page
  • Une chaîne d'information en salle d'attente ; une annonce de catastrophe à côté de votre offre enlève l'ambiance de la pièce
  • Des actions périmées, des photos d'équipe dépassées, des vœux de Noël en février
  • Un curseur de souris visible, une fenêtre dans la fenêtre, un message du système d'exploitation
  • Un mauvais rapport d'image : visages écrasés et bandes noires
  • Une heure ou une météo figées, parce que la source ne répond plus

Curseur et message système ne sont d'ailleurs pas une erreur de composition, mais l'indice d'un lecteur qui tourne comme un ordinateur ordinaire et non en mode verrouillé.

Valeurs indicatives pour le quotidien

Les valeurs suivantes ne sont pas une norme, mais l'expérience d'installations qui fonctionnent. La hauteur désigne la hauteur de capitale de la ligne principale, mesurée sur le verre.

Distance d'observationHauteur ligne principaleMots par diapositiveDurée d'affichage
1 à 2 m, comptoir et salle d'attente10 à 15 mmjusqu'à 2010 à 15 s
3 à 5 m, vitrine et réception20 à 30 mmjusqu'à 128 à 12 s
6 à 10 m, halle et menu board40 à 60 mmjusqu'à 87 à 10 s
plus de 10 m, mur LED et façadedès 80 mmjusqu'à 55 à 8 s

Deux remarques. La durée d'affichage vaut pour les diapositives fixes ; une vidéo dure le temps qu'elle dure et ne devrait pas dépasser trente secondes. Et le nombre de mots compte tout ce qui est à lire, y compris les petits caractères en bas à droite. Si en comptant vous dépassez la valeur, coupez – c'est presque toujours la meilleure diapositive.

À retenirDeux secondes suffisent pour exactement un message – qui en met deux sur une diapositive n'en montre finalement aucun.

Parlons de vos écrans.

Le livre répond à beaucoup de questions. Votre site, regardons-le ensemble.