Explorer l'impact de l'émotion dans la conception Web

Pour nous designers c'est parfois une pilule dure à avaler, mais notre beau travail ne sert à rien s'il ne sert pas les objectifs de nos clients. Et pour chaque client, la première chose à faire est d'attirer des visiteurs sur leurs sites Web et leurs produits.

L'époque du marketing numérique agressif (publicités, bannières et pop-ups) est révolue. Les internautes d'aujourd'hui, même les milléniaux et les seniors, s'attendent à ce que leur expérience de navigation soit "propre" et esthétique. Regardez à quel point le volume de recherche pour les logiciels de blocage des publicités a augmenté au cours des cinq dernières années.

Avec des bloqueurs de publicités installés sur tous les autres appareils, nous devons tous nous dissoudre avec le simple accès aux options et rechercher des moyens de faire de la publicité et de vendre des produits, des services ou des idées avec des instruments plus sophistiqués.

L'un de ces instruments est connu sous le nom de Design for Emotion - une approche psychologique de la conception, qui vise à invoquer l'utilisateur prévu avec des émotions et à ancrer les visiteurs dans l'objectif de votre site Web.

Par exemple, si nous devions concevoir un site Web pour promouvoir une boisson gazeuse, nous pourrions le faire de deux manières :

1. Mettez le produit et la marque au premier plan.
2. Mettez le produit et la marque dans l'entourage émotionnel approprié.

Imaginez visiter un site et visionner une image (ou un clip vidéo) de jeunes jouant au volley-ball sur une plage ensoleillée. Même si vous n'êtes pas un grand fan de volley-ball, l'émotion de l'amusement de ces personnes résonnera instantanément en vous. Et puis, quand l'une des personnes se rafraîchit avec une boisson fraîche, on ne peut s'empêcher de ressentir aussi une démangeaison de soif au fond de la gorge.

Le but de l'image ou de la vidéo n'était pas de promouvoir le beach-volley mais de vendre la marque de soda. Cependant, il ne vous a pas seulement frappé comme un train, mais vous a été apporté progressivement et discrètement, à travers l'émotion du plaisir et l'esprit du jeu.

Niveaux de compréhension émotionnelle

Les concepteurs ont étudié l'impact émotionnel des sites Web depuis les débuts du Web 2.0, lorsque des animations complexes et des clips légers ont progressivement envahi l'espace virtuel. « Designing for Emotion« , un livre publié par Aaron Walter en 2005, est rapidement devenu un best-seller et un guide de table pour de nombreux concepteurs de sites Web de la génération actuelle, dont moi-même.

Dans son livre, Walter identifie les trois étapes de l'engagement émotionnel d'un visiteur de site Web typique, ils sont impressionnés , intrigués et impliqués .

1. Niveau viscéral : « Impressionné »

La première impression est toujours subconsciente et est automatiquement interprétée par notre cerveau, indépendamment d'un jugement raisonnable. Lorsque nous visitons un site Web, nous lui donnons instantanément un "pouce vers le haut" ou un "pouce vers le bas".

Et sur la base de cette estimation initiale, nous continuerons à percevoir positivement tout le contenu de ce site. Il n'est donc pas surprenant qu'un bon design viscéral ne doive invoquer que la réaction du "pouce levé".

2. Niveau comportemental : "Intrigué"

Si quelque chose semble cool à première vue, notre cerveau essaie d'analyser ce que c'est et comment cela fonctionne. Cela déclenche nos schémas comportementaux et nous commençons à être émotionnellement excités par quelque chose que nous aimons. Ainsi, la deuxième étape de la conception émotionnelle serait de rendre votre conception invitant à une enquête plus approfondie.

Lorsque le visiteur est intrigué, il ne pourra pas s'empêcher de faire défiler vers le bas, de suivre le lien ou même de cliquer sur un appel à l'action.

3. Niveau de réflexion : "Impliqué"

C'est le niveau le plus élevé de nos processus cognitifs de pensée. C'est à ce moment que nous analysons et portons des jugements logiques sur les choses que nous voyons. L'utilisateur du site Web est attiré à ce niveau par les deux précédents, et à ce stade, toutes les cartes doivent être mises sur la table en montrant ce qu'est le produit et pourquoi il est utile pour l'utilisateur.

Dans sa tête, l'internaute comprendra l'intention du site de vendre le produit, mais du fait de l'émotion positive qu'il aura ressentie, cette intention ne sera pas perçue comme hostile.

Ainsi, comme vous pouvez le voir, le design pour l'émotion vise à invoquer une chaîne de réactions psychologiques. Tout d'abord, accrochez l'utilisateur avec l'effet wow, puis donnez-lui envie d'explorer plus avant, et enfin, amenez-le à comprendre de quoi il s'agit exactement.

Voyons maintenant quels outils contribuent à créer des conceptions visuelles émotionnellement engageantes.

Composantes de la conception émotionnelle

Nous examinerons les trois inbounds évidents que chaque designer utilise pour créer des visuels pour un produit ou une marque, et essaierons de les analyser du point de vue de la conception pour l'émotion.

1. Le livre de marque

Si nous visons à vendre la marque avec émotion, nous devons d'abord étudier le règlement de cette marque particulière. Un bon livre de marque ou un guide de style contiendra des schémas de couleurs, des polices, des principes d'alignement de la grille, des choses à faire et à ne pas faire en matière de placement d'espace publicitaire, et bien plus encore.

Vous devez présumer que l'identité de la marque a déjà un sens émotionnel intégré. De nombreux concepteurs prendront ce sens et l'étendront à l'ensemble du site. En fin de compte, ils auront un grand méga-logo au lieu d'un simple site Web.

Une meilleure approche consiste à extraire l'essence de la marque du livre, mais à la placer entre les lignes plutôt qu'au premier plan. Laissez le logo en haut à gauche à sa place et consacrez le reste de l'espace aux éléments auxquels vous souhaitez que les utilisateurs associent la marque.

2. Couleurs

De manière générale, nous savons tous ce que représentent les couleurs. Le rouge est un danger, une agression ; le bleu représente le calme ; et le vert pour la permission, la liberté, la nature. Lors de la conception pour l'émotion, les tons de couleur sont beaucoup plus importants que les couleurs brutes. Rendre le ton plus sombre ou plus clair peut conduire l'émotion voulue dans différentes directions.

Ci-dessous, une courte vidéo qui présente la discographie de Ben Lukas Boysen, mais sans aucun son. Toutes les émotions sont représentées avec des couleurs. Sans entendre la musique, nous obtenons toujours un sentiment émotionnel subconscient pour chaque chanson.

De plus, vous devez garder à l'esprit les particularités culturelles de chaque couleur. Au Japon, le blanc est la couleur du chagrin, et pour les gens du Moyen-Orient, le jaune est souvent considéré comme dégoûtant. Voici une pièce intéressante et informative sur ce que les couleurs représentent dans diverses cultures.

3. Entourage

Les émotions sont beaucoup plus faciles à invoquer par l'entourage que la marque elle-même. La marque doit être placée dans l'environnement ou les circonstances dans lesquelles elle est susceptible d'être le plus appréciée par le spectateur.

L'un des meilleurs exemples est un rafraîchissement par une chaude journée. Nous consommons rarement des boissons gazeuses par simple désir du cœur. Mais par une journée ensoleillée, en vacances, allongé sur la plage ou au bord de la piscine, quoi de mieux qu'une boisson fraîche aux bulles désaltérantes ?

« Le design émotionnel transforme les utilisateurs occasionnels en fanatiques, prêts à raconter aux autres leur expérience positive », conclut Aaron Walter, l'un des pères fondateurs du design émotionnel.

Vraiment, chaque site Web est axé sur l'expérience - visuelle, sensuelle, informative ou simplement amusante. Si le site Web que vous créez offre l'une de ces expériences, vous pouvez être assuré qu'il incitera les visiteurs à revenir encore et encore. Et les visiteurs réguliers du site Web de votre client sont le meilleur moyen d'invoquer la plus appréciée de toutes les émotions - la satisfaction du client.