Vous n'êtes pas émotif: émotions et conception de sites Web

Des thèmes Woocommerce

Que ressentez-vous sur ce site?

En surface, il peut sembler que la lecture d'un article sur un site Web soit une expérience sans émotion, mais la science nous dit que nous utilisons les émotions pour éclairer notre compréhension. Donc, oui, vous éprouvez une émotion en ce moment, mais que pourrait-il être? Revenons à cette question à la fin de l'article, avec une compréhension améliorée.

Qu'est-ce que l'émotion?

Dans son livre, Your Brain: The Missing Manual, Matthew MacDonald décrit l'émotion comme «la réponse auto-programmée du cerveau à certains stimuli». Il distingue soigneusement le sentiment. Les sentiments sont la façon dont nous interprétons les émotions. Alors que l'émotion est immédiate, inconsciente et viscérale, la sensation est en revanche traitée et consciente.

Pourquoi l'émotion est-elle importante dans la conception?

“J'ai appris que les gens vont oublier ce que vous avez dit, les gens vont oublier ce que vous avez fait, mais ils n'oublieront jamais ce que vous leur avez fait ressentir.”
-Maya Angelou

L'émotion a le pouvoir de favoriser une relation durable avec vos visiteurs. Si vous pouvez susciter une réaction émotionnelle chez un visiteur, il se souviendra de l'expérience longtemps après que tout le reste s'est évanoui.

Jetez un coup d'oeil à ces sites:

Mahe


Vous commencez avec une très belle vue sur Paris, mais rien que nous n’ayons jamais vu auparavant. Ce qui vous rend assis et remarque, c'est l'effet d'animation. C'est simplement beau et surprenant. Bien que vous ne vous souveniez peut-être pas de tout sur ce site, vous vous souviendrez certainement du sentiment de surprise constaté lors de votre premier défilement.

Iugo


Pas de musique, juste un vol. Qui n'aime pas voyager dans les nuages ​​sans quitter son siège? Cette vidéo presque transparente évoque enthousiasme et anticipation – vous vous dirigez quelque part, vous ne savez tout simplement pas où. Je ne peux pas vous dire depuis combien de temps je regarde cette vidéo, ce serait embarrassant. La conclusion est que ce site a suscité mes émotions, retenu mon attention et laissé une impression durable.

Avant qu'ils

Je vous mets au défi de consulter ce site et de ne pas le parcourir. Des images haute résolution étonnantes et un design intuitif racontent une histoire qui fait appel à vos émotions.

Une étude récente sur des patients atteints de lésions de l'hippocampe, telles que la maladie d'Alzheimer, montre que les émotions persistent même après la disparition des souvenirs. Bien qu'un visiteur puisse ne pas se souvenir de tout ce que vous avez dit, il se souviendra de ce sentiment. Ce sentiment les amènera à revenir encore et encore.
Le but de toute conception est d'engager les téléspectateurs. Susciter des émotions positives peut conduire à des visites plus longues, à un engagement plus important et à un enthousiasme accru pour votre produit.

Composantes importantes de la conception émotionnelle

De nombreuses personnes comptent sur le texte pour créer des liens émotionnels avec leurs visiteurs, mais le texte seul ne suffit pas pour créer de l'émotion.

Même sur un site comme Zen Habits, qui est réputé pour être minimaliste, son attrait émotionnel ne provient pas uniquement du texte. En tant que lecteur, vous vous sentez en paix, ou zen, sur le site, car il a été conçu de manière à évoquer cette émotion en vous. Il n'y a pas de barre latérale. Il n'y a pas d'images. Mais, il y a beaucoup d'espaces blancs. Il se sent pur, authentique et véridique.


Comme vous pouvez le constater dans la conception de Leo Babuata, le type de police, la taille et l'espacement des caractères peuvent avoir une incidence sur vos émotions. Sur les habitudes zen, le design est intentionnellement respirant et ouvert. Rien n'est encombré. Sa typographie soutient la conception mais raconte également la même histoire.

Que dit votre police?

Les polices peuvent être conviviales, sérieuses, intelligentes et malheureuses. Les polices peuvent être divisées en un grand nombre de catégories différentes, mais pour les besoins de cet article, nous aborderons les quatre catégories principales: Serif comporte des embellissements aux extrémités des lettres; Sans Sérif sans empattements ni embellissements aux extrémités des lettres; Scénario; et décoratif.

Les polices Serif véhiculent traditionalisme et respect. Pensez Times New Roman :

Les polices sans empattement sont résolument plus modernes. Pensez Calibri :

Le script est sophistiqué et peut être conservateur. Pensez Pacifico :

Décoratif est fantaisiste et créatif. Étiquettes Think Impact :


images courtoisie de Wikipedia Images et FontSquirrel

Quelle émotion espérez-vous susciter dans votre projet? Si vous avez besoin de respect de la part de vos visiteurs, choisissez des polices telles que New Times Roman ou Garamond. Si vous souhaitez qu'ils vous voient comme une création, essayez une police qui pousse l'enveloppe, comme New Facebook ou Base 05.

Les polices doivent refléter votre intention de conception. Les polices, comme les intérêts amoureux, ne doivent jamais être choisies au hasard en fonction de leur apparence. Ils devraient pouvoir approfondir votre histoire émotionnelle.

Qu'en est-il des couleurs?

La couleur est sans aucun doute l’une des meilleures solutions pour introduire et augmenter la réponse émotionnelle à votre conception de sites Web. La science a maintes fois prouvé que les humains assimilaient les couleurs aux émotions. Pourquoi pensez-vous que le logo McDonald's est jaune et rouge? Il suscite la faim et l'optimisme.
Lorsqu'un utilisateur visite pour la première fois votre site Web, il a une impression de qui vous êtes et crée un moyen de vous mettre en relation. Les couleurs, les polices et autres choix de design visuel définissent automatiquement la scène: ils sont comme les vêtements d'un site Web.

Par exemple, lorsque vous accédez à Wikipedia, vous pouvez voir à l'aide du jeu de couleurs bleu et gris qu'il est fiable et fiable. Vous pouvez supposer, par le choix de la police et sa taille, qu’il est sérieux et intelligent. Et vous pouvez aussi dire par les images que cela ne paie pas pour le stock. Je plaisante, parfois Wikipedia a de superbes images, mais l'imagerie n'est pas le point central de Wikipedia. Le contenu de Wikipedia est au cœur de tous les sites Web. Personnellement, je ne voudrais pas m'asseoir à côté de Wikipedia lors d'une fête. Imaginez à quel point cela serait ennuyeux. Mais Wikipédia serait un bon ami pour envoyer des SMS. Plus à ce sujet, plus tard.

Un autre exemple est Yelp, qui utilise principalement le bleu et le rouge. Que disent ces couleurs en combinaison avec ce que nous comprenons à propos de Yelp? Il cherche à être digne de confiance et à attirer votre attention. Red attire définitivement l'œil sur l'élément clé de Yelp: les critiques. Bien que le rouge puisse vous rendre plus affamé lorsque vous songez à manger, il peut également attirer votre attention, même lorsque vous n'avez pas faim.

Certains sites sont verts et bleus. Par exemple, TripAdvisor utilise ces couleurs pour vous donner un sentiment de détente. Après tout, vous partez en vacances et vous savez que vous lisez actuellement les avis des autres utilisateurs.
Avez-vous remarqué la tendance? Le bleu est souvent utilisé dans la conception Web pour communiquer la confiance et la fiabilité.

Voyons comment les couleurs engagent nos émotions:

  • Jaune: heureux, optimiste, clarté,
  • Orange: sympa mais adore ou déteste
  • Rouge: passionnant, jeune, urgent, saisissant l'attention
  • Purple: créatif, imaginatif, édifiant
  • Bleu: digne de confiance, fiable, sécurisé
  • Vert: pacifique, croissance, détente
  • Gris: Balance, Neutre, Fiable, Intelligent
  • Noir: luxueux, puissant, faisant autorité

Beaucoup d'entre nous choisissent des couleurs parce qu'elles se complètent ou simplement parce qu'elles sont jolies, mais si vous choisissez la mauvaise couleur, cela peut envoyer un message mélangé d'émotion à votre visiteur. Par exemple, la plupart des entreprises de commerce électronique en ligne, telles que PayPal, Stripe et Authorize.Net, utilisent de manière bien visible le bleu dans leurs conceptions et évitent la couleur rouge, ce qui est excitant mais pas nécessairement sécurisé. Sur le revers, il existe des sites financiers comme Bank of America qui utilisent le rouge en évidence. Bank of America utilise le rouge exclusivement pour vendre des produits, mais elle équilibre le sentiment d’urgence créé par le rouge, une bonne dose de sécurité bleue et une fiabilité grise.

En vous référant à vos choix de couleurs, pouvez-vous voir en quoi votre design excite ces émotions?

Qu'en est-il du contenu?

«Si votre site Web était une personne, qui serait-ce? Est-ce sérieux, boutonné, toutes les affaires, pourtant digne de confiance, et capable? Est-ce un copain sidérant qui rend amusante même les tâches les plus banales? “
-Aarron Walter, Concevoir pour l'émotion

Un peu plus tôt, j'ai dit que le texte ne suffisait pas, mais ne vous y trompez pas: il s'agit certainement d'une grande partie de l'expérience émotionnelle. Dans son livre révolutionnaire, Designing for Emotion, Aarron Walter présente une visualisation puissante. Quel type de personne votre site Web serait-il?

Comprendre la personnalité de votre site Web vous aidera à décider comment interagir avec vos visiteurs. Comme je l'ai mentionné précédemment au sujet de la rencontre de Wikipedia lors d'une fête, réfléchissez à la manière dont les visiteurs vous parlent. Viennent-ils à vous pour rire, ou inspiration, ou autorité? Non seulement ce que vous dites, mais aussi la façon dont vous dites que cela influe sur la réaction des autres. Vous pouvez et devez susciter des émotions à travers le contenu.

Qu'en est-il des images?

Lorsqu'il s'agit d'évoquer l'émotion, quel meilleur outil qu'une image? Une image vaut mille mots, en effet. Pensez aux images qui vous touchent profondément. Il n'est pas nécessaire que ce soit un larmoyant. Cela pourrait être quelque chose d'aussi bête que de rire pendant des jours.

Quelle que soit l'émotion que vous cherchiez à provoquer, une image l'accompagnera.

Les images sont attachées au contenu. Les images soutiennent le contenu et ravivent parfois l’intérêt pour ce que vous dites. De la même manière que nous communiquons avec plus que nos mots, en utilisant le ton, les expressions faciales et le langage corporel pour s'exprimer et susciter des réponses émotionnelles spécifiques, les images font la même chose pour le texte.

Une conception réussie utilise des images pour communiquer avec le public. Les images peuvent tirer toute émotion.
L’utilisation de vidéos en plein écran me passionne particulièrement. Ces vidéos sont une petite tranche de vie, pas assez longue pour exiger un engagement total, mais assez longue pour transmettre un message aux visiteurs. Considérez ces sites:

Pay Pal

J'adore utiliser des vidéos différentes à chaque visite. Cela renforce doucement la preuve sociale: d’autres utilisent PayPal et vous devriez en faire de même. Avec le schéma de couleurs, il suscite la confiance et la fiabilité.

Vimeo

Vimeo est le demi-frère artistique de YouTube. Il a certainement développé une réputation pour des vidéos superbes, et sa page d'accueil porte ce message. Vous souhaitez simplement faire partie de la communauté uniquement à cause des vidéos inspirantes de la page d'inscription.

Gifn

Vous n’avez peut-être pas entendu parler de Gifn, mais il présente un design magnifique et énergique qui vous donne envie de vous joindre à la fête. Jetez un coup d'œil à la série de vidéos sur la page d'accueil. Comment vous sentez-vous? Heureux! Difficile de ne pas sourire, surtout que tout le monde vous sourit.

Résumons

Si la conception Web est une personne:

  • Les polices et la couleur sont les vêtements
  • Le contenu est la voix
  • Les images sont le visage

Maintenant que vous maîtrisez les bases des émotions et de la conception Web, que ressentez-vous sur ce site Web? Que ressent votre propre conception de sites Web?

Auteur: Jacqueline Thomas

Collection par: dynamicfreethemes.net

Leave a Reply

avatar
  Subscribe  
Notify of