# Voix de marque et visuels : faites parler votre look comme vous

[Canonical HTML page](https://gradiently.design/fr/guide/brand-voice-and-visuals)

Un message calme dans un look criard sonne faux, et on le sent avant de pouvoir dire pourquoi. Voici une carte pratique entre votre façon de parler et votre façon de paraître.

## The short version

- La voix de marque est la façon dont une marque s’exprime en mots ; ses visuels doivent exprimer le même caractère par la couleur, la typo, la texture, le mouvement et la mise en page.
- Quand voix et visuels se contredisent, par exemple un message doux dans un look néon criard, on perçoit le décalage même sans pouvoir le nommer.
- Chaque trait de voix correspond à des choix visuels concrets : calme évoque un contraste doux et un mouvement lent, audacieux un contraste fort et une typo grasse.
- Écrivez chaque trait de voix sous la forme « ceci, pas cela » pour que les choix visuels aient une limite en plus d’une direction.
- Le mouvement a lui aussi une voix : la vitesse et l’accélération d’une animation peuvent sonner calmes, audacieuses, ludiques ou précises.

Votre **voix de marque** est la façon dont votre marque s’exprime en mots : calme ou audacieuse, ludique ou précise, chaleureuse ou froide. Vos visuels doivent dire exactement la même chose par la couleur, la typo, la texture, le mouvement et la mise en page. Pour y arriver, prenez chaque trait de voix, associez-le à des choix visuels précis, puis confrontez chaque design à cette carte. Quand les deux s’accordent, un post paraît sincère avant même d’être lu.

La plupart des marques définissent leur voix pour les rédacteurs et leur look pour les designers, chacun de son côté. C’est ainsi qu’on se retrouve avec une légende douce et rassurante sur un fond néon criard. Ce guide réunit les deux. Si vous n’avez pas encore arrêté votre caractère, commencez par la [personnalité de marque](https://gradiently.design/fr/guide/brand-personality).

## Pourquoi la voix de marque et les visuels doivent s’accorder

On perçoit l’aspect d’un post avant ses mots. Le look crée une attente, et les mots la confirment ou la contredisent. Une contradiction n’est pas toujours consciente ; elle rend simplement la marque un peu bancale, comme un ami dont le ton ne colle pas à ce qu’il dit.

### Voix et look se contredisent

- Une marque discrète et réfléchie en néon saturé avec une animation rebondissante
- Une marque ludique en gris, en typo fine et en grilles strictes
- Une marque précise et technique en polices manuscrites et flous doux
- Une marque chaleureuse et locale en bleu froid et photos de banque d’images

### Voix et look s’accordent

- La même marque discrète en neutres profonds, avec un serif fin et une dérive lente
- La marque ludique en associations vives et inattendues et typo arrondie
- La marque technique en sans serif net, contraste franc et espacement exact
- La marque chaleureuse en tons terreux, texture papier et vrais visages

## Une carte des traits de voix vers les choix visuels

Prenez ce tableau comme un point de départ, pas comme une loi. La plupart des marques mêlent deux ou trois traits ; choisissez le dominant pour la couleur et laissez les autres façonner la typo et le mouvement.

| Trait de voix | Couleur | Typo | Texture et mouvement | Mise en page |
| --- | --- | --- | --- | --- |
| Calme | Contraste doux, teintes proches, atténuées | Graisses légères ou normales, espacement aéré | Grain fin, dérive lente | Beaucoup d’espace, peu d’éléments |
| Audacieuse | Contraste fort, saturée, peu de couleurs | Graisses fortes, grandes tailles, espacement serré | Surfaces nettes, coupes rapides | Grande typo, bord à bord |
| Ludique | Associations inattendues, pastels vifs | Formes arrondies, tailles mêlées | Matières douces, accélération rebondissante | Libre, légèrement hors grille |
| Précise | Retenue, un seul accent net | Sans serif épurée, rythme régulier | Texture lisse et minimale, timing exact | Grille stricte, bords alignés |
| Chaleureuse | Tons terreux et ensoleillés | Serif amical ou sans serif humaniste | Papier, grain, lumière du jour | Marges généreuses, photos de personnes |

Un trait mène en général. Les autres règlent les détails.

## Quatre voix, quatre looks

Voici les mêmes types de choix faits pour quatre voix différentes. Remarquez à quel point la couleur seule en dit déjà long, avant tout mot.

- Calme : brume, bleu doux: `linear-gradient(180deg, #eef2f4 0%, #b9cbd6 100%)`
- Audacieuse : rouge-orangé, jaune: `linear-gradient(135deg, #ff3d00 0%, #ffd600 100%)`
- Ludique : rose, beurre, menthe: `linear-gradient(120deg, #ff9ecd 0%, #ffd36e 50%, #7ee0c3 100%)`
- Précise : encre, bleu marine: `linear-gradient(180deg, #0b1220 0%, #1f3a5f 100%)`

La couleur donne d’abord la voix. Pour mieux comprendre ce qu’évoquent les couleurs, voyez la [psychologie des couleurs](https://gradiently.design/fr/guide/color-psychology).

Un post en portrait avec les mots Prenez votre temps en petit et en léger sur un fond calme, avec beaucoup d’espace

Calme : une ligne courte, une graisse légère, presque tout le cadre laissé vide.

Un post en portrait avec le seul mot Maintenant en très grand sur un fond vif

Audacieuse : un seul mot énorme, rien d’autre pour lui faire concurrence.

Un post carré demandant Que feriez-vous ? dans une mise en page amicale sur un fond lumineux

Ludique : une question, une invitation, une touche plus légère.

Un post carré intitulé Trois changements cette semaine avec une liste nette et alignée sur un fond sobre

Précise : une liste, des bords alignés, aucun décor qui ne soit pas une information.

## Comment trouver votre voix visuelle

1. **Écrivez vos traits sous la forme « ceci, pas cela »** « Confiante, pas arrogante. » « Chaleureuse, pas sucrée. » La seconde moitié donne aux visuels une limite en plus d’une direction.
2. **Choisissez le trait dominant** Décidez quel trait pilote la couleur. Deux traits dominants qui tirent en sens opposés, comme calme et audacieux, donnent un look brouillon.
3. **Associez chaque trait à des choix** Servez-vous du tableau ci-dessus pour choisir couleur, typo, texture, mouvement et mise en page. Notez les choix à côté de chaque trait.
4. **Passez la même phrase dans deux looks** Composez une vraie ligne de vos textes dans le look choisi puis dans son contraire. Si le contraire sonne plus juste, revoyez vos traits.
5. **Écrivez-le ensemble** Mettez les règles de voix et de visuels sur la même page de votre [guide de style de marque](https://gradiently.design/fr/guide/brand-style-guide), pour que rédacteurs et designers travaillent à partir d’une seule source.

## Le mouvement a aussi une voix

La vitesse et l’accélération d’une animation disent quelque chose. Une longue décélération douce paraît calme. Un mouvement court et sec paraît décidé. Un léger dépassement paraît ludique. Si votre marque apparaît en vidéo ou sur un site, donnez au mouvement la même voix qu’aux mots. [L’easing](https://gradiently.design/fr/guide/easing) explique les courbes en détail.

```css
/* Calm: slow, soft landing */
.calm { transition: transform 900ms cubic-bezier(0.22, 1, 0.36, 1); }

/* Bold: fast and decisive */
.bold { transition: transform 180ms cubic-bezier(0.2, 0, 0, 1); }

/* Playful: a small overshoot past the target */
.playful { transition: transform 450ms cubic-bezier(0.34, 1.56, 0.64, 1); }

/* Precise: short, even, no flourish */
.precise { transition: transform 200ms ease-out; }
```

Quatre voix de mouvement. Le dépassement de la courbe ludique vient du second point de contrôle qui passe au-dessus de 1.

Il en va de même pour la typographie. Votre police de titre est la partie la plus sonore de votre voix visuelle, et l’[association de polices](https://gradiently.design/fr/guide/font-pairing) décide si elle parle seule ou en conversation. Dans Gradiently, chaque Mark porte une voix typographique en plus de ses couleurs et de ses matières : le look et les lettres arrivent donc déjà accordés.

> **Le test de la lecture à voix haute** Lisez à voix haute les mots d’un post sur le ton que suggère le design. Si vous ne le diriez jamais ainsi, il faut rapprocher le look et la voix.

## FAQ

### Qu’est-ce que la voix de marque ?

La voix de marque est le caractère constant qu’une marque exprime dans ses mots, par exemple calme, audacieux, ludique ou précis. Le ton adapte cette voix à la situation.

### Comment les visuels expriment-ils la voix de marque ?

Par la couleur, la typo, la texture, le mouvement et la mise en page. Un contraste doux et un espacement aéré sonnent calmes ; un contraste fort et une typo grasse sonnent audacieux.

### Quelle différence entre voix de marque et personnalité de marque ?

La personnalité est le caractère de la marque ; la voix est la façon dont ce caractère passe dans les mots. Les visuels doivent exprimer la même personnalité que la voix.

### Une marque peut-elle avoir plusieurs traits de voix ?

Oui, la plupart en ont deux ou trois. Choisissez-en un pour mener la couleur et laissez les autres façonner la typo, le mouvement et la mise en page.

### L’animation influence-t-elle la voix de marque ?

Oui. Une décélération lente et douce paraît calme, des mouvements rapides paraissent décidés et un léger dépassement paraît ludique : le mouvement doit donc s’accorder à la voix des mots.