Les sites Web sont conçus pour exécuter une fonction et communiquer avec leurs utilisateurs. Mais au-delà, les sites Web peuvent également être intéressants, passionnants, voire amusants.

L'ajout d'un intérêt visuel à un site contribue à soutenir notre engagement, que ce soit par la typographie, les graphiques ou la photographie. Mais je crois qu’il existe également un potentiel pour que des éléments d’interaction puissent fournir une stimulation visuelle et un retour d’informations, et même ravir l’utilisateur. Dans cet article, je soutiendrai que l'ajout de certains effets pour amuser, surprendre et exciter vos utilisateurs peut améliorer vos sites Web et vos applications et permettre aux utilisateurs de revenir.

Délice

La conception de sites Web est souvent un sujet aride, chargé de jargon UX et de parcours d’utilisateurs d’Architecture de l’information. Mais pourquoi ne pas s'amuser en chemin? Ajouter du plaisir à un site est un excellent moyen de rendre un site non seulement plus humain, mais aussi de rendre votre site unique.

Je vais restreindre ma définition du plaisir en disant que c'est l'ajout de fonctionnalités non requises .

J'entends par là que ce n'est pas une partie essentielle de la fonction du site. Cependant, cela peut avoir un effet puissant sur la façon dont le site est perçu et expérimenté. En fait, j'irais même jusqu'à dire que la façon dont vous gérez les éléments strictement inutiles de l'interface utilisateur est aussi importante que la typographie et les autres éléments visuels, pour donner le ton à un site Web.

Une interaction gratuite

Dans un article pour Cooper Journal, Chris Noessel appelle 'Un libre interaction' un modèle de conception "qui donne au logiciel une sensation plus humaine."

Une partie de cela est la reconnaissance que les humains sont des créatures agitées souvent sujettes à répéter de petites actions. Traditionnellement, avec le stylo et le papier, nous griffonnons ou rétractons continuellement les stylos. Je suis un stylo invétéré par exemple.

Les gens transportent souvent cette difficulté dans la navigation sur le Web, en faisant souvent défiler vers le haut et le bas, en sélectionnant des parties de texte ou en répétant des actions.

Le modèle One Free Interaction embrasse ce besoin humain inné de créer des éléments interactifs qui donnent des résultats inattendus ou agréables. Besoin d'un exemple? Essayez de placer votre curseur sur le logo Web Designer Depot «W» en haut de cette page.

Comme le dit Noessel, les interactions libres se situent en dehors de la performance de la tâche et sont plutôt placées dans les espaces intermédiaires. Mais ils sont puissants pour façonner notre réaction émotionnelle aux sites que nous utilisons.

Effets de défilement

Comme indiqué précédemment, l’un des «fidgets» les plus courants défile vers le haut et le bas, de sorte que les sites qui présentent un intérêt visuel lors du défilement sont souvent délicieux.

Le site d'une page pour le Nizo application de photographie de Image Mechanics propose des composants de caméra «Knolled» qui se déplacent à mesure que vous faites défiler vers le bas et vers le bas. Si vous êtes comme moi, vous passerez beaucoup de temps à faire défiler et à jouer avec la magnifique interface. (Ne retenez pas votre souffle en attendant que l'application soit lancée.)

nizo_01

L'utilisation d'effets de parallaxe sur le défilement ajoute également du plaisir, créant l'illusion de profondeur. J'aime le garçon-coy site Web, où les effets de défilement correspondent parfaitement au ton et au style visuel du site.

boycoy_01

Je suis surpris qu'il n'y ait pas plus de sites Web avec des effets de défilement horizontal, étant donné que le défilement latéral est un thème si courant dans la conception de jeux. Mais un bon exemple est le Nintendo Mario Kart site qui examine l'histoire du jeu à travers 20 ans de consoles Nintendo.

mariokart_01

Le site polonais Écraser ajoute des couches d’éléments graphiques qui se transforment au fur et à mesure que vous défilez, une façon sophistiquée d’obtenir un carnet de croquis à faible débit.

mashup_01

Le roi des sites d'effets de défilement est probablement Acko . Ici, l'élément d'en-tête de site est un objet 3D graffiti animé. C'est le logo animé porté au prochain niveau - immersif, interactif, ludique. Il y a même des réalisations à «débloquer» sur l'interface utilisateur - bien que la gamification soit un autre sujet.

acko_01

Design pour l'émotion

Ajouter du plaisir à votre site aide à créer un lien émotionnel avec un utilisateur. Le pouvoir de l'émotion dans le design est quelque chose que nous commençons seulement à comprendre, mais cela aide à expliquer pourquoi nous aimons utiliser certains objets et avoir un lien si puissant avec eux. Cela s'applique à la conception de produits physiques ainsi qu'à la conception interactive.

Je pense que l'une des principales raisons pour lesquelles les produits Apple sont si réputés est que les utilisateurs y sont attachés émotionnellement, et il y a beaucoup d'exemples de plaisir dans le matériel et les logiciels Apple. Je sais que beaucoup de gens adorent le défilement «élastique» sur le mobile iOS Safari, à tel point qu'ils seront absents et piaffent.

OK par «beaucoup de gens» je veux dire moi, mais Steve Jobs l'a assez aimé pour le breveter, et il a fait partie du litige d'Apple contre Samsung.

Aaron Walter, dans son livre Concevoir pour l'émotion, se penche sur la manière dont les sites Web performants suscitent les émotions des utilisateurs en leur conférant une personnalité. L'ajout d'éléments qui ravissent un utilisateur est un moyen très puissant de le faire. En termes simples, nous préférons les outils qui nous ravissent, donc c'est aussi bon pour les affaires.

Delight n'est pas un gadget

Ajouter du plaisir ne signifie pas ajouter des effets délibérés en tant que gadget. Les effets sont là pour aider à façonner la personnalité du site. Ils ne doivent pas être ludiques ou bizarres (bien qu'ils puissent l'être si c'est la personnalité que vous voulez transmettre), ils peuvent être subtils et limités si cela convient mieux au personnage. Jeter un coup d'œil à pictet.com. J'adore la façon dont la barre de recherche s'estompe lorsque vous cliquez sur le lien de recherche: elle empêche le champ de texte de recherche de devenir un élément dominant jusqu'à ce que vous le demandiez. C'est subtil et élégant, et il convient parfaitement au ton du site - une société de services financiers suisse - parfaitement.

pictet_01

Parfois, les effets sont si subtils que vous pourriez même ne pas les remarquer. Saviez-vous par exemple que le contrôle du volume sur le BBC iPlayer monte à 11? C'est un joli petit signe de tête à Spinal Tap.

Ne pas exagérer

Ajouter trop d'interactions inattendues peut être contre-productif, ce qui crée un surdimensionnement visuel. À moins que vous n'essayiez de créer un environnement de jeu hyperkinétique, trop d'effets visuels, avec des flip-ups, des pop-ups, des whizzbangs et des bombes bizarres, nuiront sérieusement à toute implication significative dans le contenu. Jetez un oeil à la LEDbow site par exemple. Techniquement c'est génial mais je ne pense pas que cela communique efficacement. Il se passe trop de choses.

ledbow_01

Composer le plaisir

J'aime les sites qui traitent l'écran comme un viseur ou une surface plutôt que comme un visualiseur de pages. Les couches se déplaçant à différentes vitesses créent de la profondeur et de l'intérêt. Les éléments mis en position attirent l'attention sur eux.

Le mouvement rend l'expérience plus immersive, mais sachez que ce type d'interactivité en soi ne signifie pas un engagement plus grand.

L'ajout de délices rend les sites plus humains et aussi plus tactiles, engageant notre besoin de cerveau de singe pour nous amuser et jouer tout en réfléchissant et en apprenant. La prochaine fois que vous créez un site, réfléchissez à la manière dont vous pouvez créer quelque chose d'unique pour ravir vos utilisateurs.

Avez-vous conçu pour l'émotion? Comment ajoutez-vous de la joie à un site? Faites le nous savoir dans les commentaires.