Comment personnaliser UX pour Mobile
Alors, qu'est-ce que la psychologie a à voir avec cela? En ce qui concerne l'expérience utilisateur, presque tout.
Avec autant de types et de tailles de périphériques et de manières différentes de concevoir des sites Web pour ces périphériques, l'expérience utilisateur créée par un concepteur détermine la réussite globale du site et le retour de l'utilisateur.
Qu'est-ce que la psychologie de l'utilisateur?
La psychologie des utilisateurs est la science derrière ce que les gens veulent et dont ils ont besoin lorsqu'ils visitent un site Web ou une application mobile. La psychologie est ancrée dans tout, depuis la confiance de l'utilisateur à la manière dont il perçoit le message que vous essayez de transmettre.
Et le design en est une grande partie. Tout, de la couleur aux images, aux motifs, au fonctionnement du site peut avoir un impact ces sentiments et connexions émotionnelles.
Chacun de ces éléments devrait aboutir à une action de l'utilisateur. La plupart des manuels de psychologie font référence à des déclencheurs qui poussent les gens à agir et à réagir. Ces déclencheurs s’appliquent également à la conception de sites Web, et plus particulièrement au design mobile, où un utilisateur doit presque toujours interagir physiquement avec un site Web pour provoquer un événement, tel que le fait de le glisser ou de le toucher.
- Reciprocation: si vous faites quelque chose pour les utilisateurs, ils feront quelque chose pour vous. (Ils s'inscrivent à une newsletter, vous leur donnez un billet de faveur.)
- Framing: les utilisateurs feront des comparaisons entre les choses. (Est-ce que je veux ceci ou cela? La plupart des utilisateurs se situent quelque part au milieu de toutes les options.)
- Salience: les utilisateurs veulent ce qui compte maintenant. (C'est pourquoi les sites de commerce électronique ajoutent des éléments connexes à l'écran lors de l'expérience d'achat.)
- Preuve sociale: les utilisateurs se tournent vers les autres pour voir quoi faire. (L'influence des médias sociaux.)
- La rareté: les utilisateurs veulent ce qu'ils ne peuvent pas avoir. (Nombre limité d'articles.)
- Contraste: Ce qui ressort de l'esprit de l'utilisateur. (Théorie du design 101.)
Deux expériences utilisateur différentes
Bien que les déclencheurs soient les mêmes quel que soit l'appareil, l'expérience utilisateur ne l'est pas. Les utilisateurs souhaitent massivement que le contenu soit identique quel que soit l'appareil, mais ont des idées différentes sur la manière d'utiliser et d'interagir avec ce contenu.
Les sites Web de bureau sont destinés à la lecture et à la lecture. Le processus de lecture et de collecte d'informations peut entraîner une action, mais les utilisateurs ont souvent une raison particulière pour accéder à un site Web, tel que le travail. Toutes ces expériences ne sont pas basées sur le divertissement ou le plaisir et la plupart d'entre elles peuvent ne pas l'être.
Les utilisateurs de bureau sont également relativement bien connectés. Chaque action est effectuée avec un clavier ou une souris. Il n'y a pas beaucoup d'interaction physique réelle avec l'appareil. (Peu d'utilisateurs toucheront jamais l'écran.)
L'expérience utilisateur pour mobile est sensiblement différente. Les utilisateurs touchent constamment l'appareil - boîtier et écran. La taille de ces éléments et leur ressenti sont donc très importants. Cette utilisation du toucher physique rend la conception des éléments à l'écran particulièrement importante, car ils doivent être faciles à manipuler, contrairement aux versions de bureau où le clic de souris est toujours de la même taille.
Les utilisateurs d'appareils mobiles accèdent souvent à des sites Web avec des intentions différentes. Les activités de divertissement ou d'accomplissement des tâches sont plus courantes que les actions de lecture et de recherche. (Il suffit de penser à la fréquence à laquelle vous sortez votre téléphone pour jouer à un jeu en ligne à l'épicerie ou répondre à un message texte.)
Les différences physiques ont également un impact sur la psychologie du design mobile. Vous devez tenir compte des conditions d'éclairage, de la taille de l'appareil et des options tactiles. Comment ces éléments se réuniront-ils pour un utilisateur réel?
Les attentes des utilisateurs
Tout se résume à une question centrale: Qu'est-ce que l'utilisateur mobile veut et attend?
Contrairement aux sites Web de bureau, où les utilisateurs attendent une expérience visuellement dynamique et engageante relativement bidimensionnelle, les utilisateurs mobiles veulent que tout soit réel et vivant dans l'espace tridimensionnel.
Les utilisateurs mobiles en sont venus à attendre certaines choses de l'interface:
- Chaque action doit être applicable. (Et facile à voir et à taper.)
- Les graphiques et les images devraient se charger rapidement et ne pas faire partie du tout de l'expérience mobile.
- Les options doivent être contextuelles. Les utilisateurs veulent savoir ce qui se passe ensuite et où ils peuvent aller d'ici; ils n'ont pas besoin de connaître toutes les options possibles.
- Les sites Web doivent s'intégrer à toutes les fonctionnalités des appareils mobiles, telles que le mappage, les appels et l'intégration avec d'autres applications.
- Les interactions doivent être faciles et suivre des schémas généralement acceptés. Les utilisateurs mobiles ont une attention presque nulle. Si les éléments ne fonctionnent pas la première fois - et sans beaucoup de réflexion ou d’explication - l’utilisateur est perdu.
Comment le concevoir
Le secret réel combine les déclencheurs et les attentes des utilisateurs. puis concevez pour eux. Décrivons quelques exemples de sites qui le font bien et comment ils combinent des déclencheurs et des attentes mobiles pour une excellente expérience utilisateur.
menthe
menthe utilise une interface de type carte où chaque case est un élément cliquable dans la conception de son application mobile, tandis que la version de bureau comporte davantage de liens de type clic. Des couleurs vives et beaucoup d'espace blanc contribuent également à la version mobile simplifiée.
Déclencheurs: le cadrage et la prédominance sont les principaux facteurs de déclenchement, car en tant que service gratuit, la Monnaie vous demande de vous inscrire à des offres à durée limitée en fonction de ce que vous pensez ou de ce dont vous avez besoin.
Attentes mobiles: Mint se charge exceptionnellement rapidement avec des données utilisateur actualisées. L'application mobile supprime un grand nombre des images les plus lourdes qui apparaissent sur le site du bureau et utilise un modèle vertical simple pour que l'utilisateur puisse suivre les informations. Il intègre également de jolis outils UX tels que l’accès par empreinte numérique sur l’iPhone et un contrôle gestuel intuitif pour le déplacement entre les éléments.
Distillateur
Distillateur utilise un cadre réactif pour que le contenu soit presque identique sur les versions de bureau et mobile. Ce que le site fait cependant, c'est maximiser le potentiel du format mobile, avec des moyens uniques pour naviguer dans le contenu.
Déclencheurs: vous pouvez facilement voir la manière dont ce site utilise le contraste pour créer un engagement de l'utilisateur. L'utilisation de la couleur et des espaces blancs dans les deux variantes de sites Web est conçue pour créer de l'enthousiasme et encourager les appels à l'action. (Il suffit de regarder les boutons de couleurs vives et les emplacements proéminents.)
Attentes mobiles: Distiller utilise de nombreux modèles couramment acceptés pour inciter les utilisateurs à s'engager, avec quelques indices subtils au cas où l'utilisateur aurait besoin d'aide. Regardez le deuxième écran mobile, par exemple: Les éléments de style carte (qui sont chacun des liens uniques) peuvent être déplacés en arrière pour voir plus de contenu et une barre de style de points est utilisée pour montrer aux utilisateurs combien il reste d'éléments. La navigation est également considérablement simplifiée et masquée dans une icône de hamburger afin que les utilisateurs ne soient pas dépassés par les options et puissent se déplacer librement sur le site mobile.
La chaîne météo
La chaîne météo fournit exactement le même contenu sur son site de bureau et son application mobile, mais les expériences sont radicalement différentes. Le site de bureau contient plus d'informations à lire et à lire, tandis que l'application se concentre sur ce que l'utilisateur doit savoir maintenant.
Déclencheurs: La saillance (mentionnée ci-dessus) et la preuve sociale sont une grande partie de ce qui rend l'application mobile The Weather Channel différente. L'écran d'ouverture est la météo où l'utilisateur est debout à ce moment. D'un coup de doigt, les utilisateurs peuvent signaler les conditions, partager sur les médias sociaux et devenir une partie de la météo bien connue de la marque.
Attentes mobiles: l'application utilise un design moderne, plat et de style carte pour rendre chaque élément facile à utiliser. Il n'y a pas de menu à proprement parler car la prémisse entière est contextuelle, amenant les utilisateurs d'un élément à l'autre en fonction de leurs choix.
Domino's Pizza
Domino's Pizza a fait un gros accord public sur la facilité de commande. Et ils ont raison. Bien que le site de bureau ait une apparence très traditionnelle, l'application utilise de nombreux outils d'interface utilisateur spécifiques au mobile, tels que la commande vocale, pour faciliter le processus.
Déclencheurs: La réciprocité et l'encadrement sont les clés de l'expérience d'achat, avec de nombreuses offres et options à choisir. De plus, la version mobile se souvient des préférences de l'utilisateur pour faciliter le processus.
Attentes mobiles: Bien que Domino utilise certaines fonctionnalités qui ne sont pas communes à ces types d'applications, il est bien expliqué (comme l'icône de commande vocale). La navigation est intégrée dans le contexte et l'application est conçue avec beaucoup de contraste et de petites images qui se chargent rapidement.
Le Tonight Show
Le Tonight Show est conçu pour divertir les utilisateurs sur tous les appareils. Le bureau et le site réactif, ainsi que l'application, ont tous un aspect et un fonctionnement similaires. Les options mobiles sont rationalisées avec une hiérarchie verticale et les éléments sont faciles à prendre pour regarder.
Déclencheurs: Comme avec de nombreux autres sites de divertissement, la pertinence et la preuve sociale sont ce qui incite les gens à revenir. Vous voulez être au courant avec ce qui est chaud et tendance et c'est l'endroit pour le trouver.
Attentes mobiles: L’un des petits trucs du site mobile est qu’il demande d’abord à l’utilisateur s’il veut l’application, comme pour dire: «Souhaitez-vous la meilleure expérience possible?» sont venus à attendre. Il est facile de trouver l’application parce qu’elle n’est qu’en un seul clic et que les utilisateurs n’ont pas besoin de chercher quoi que ce soit; tout va bien devant eux.
Conclusion
La plupart des utilisateurs veulent et s'attendent à trouver le même contenu de site Web, quel que soit l'appareil, mais ils souhaitent souvent que l'expérience utilisateur soit adaptée au périphérique qu'ils utilisent.
Cette expérience utilisateur spécifique à cet appareil contribuera à fidéliser les utilisateurs et à améliorer les sentiments des utilisateurs de sites Web. En termes simples, il est important d’avoir un bon bureau et de l’expérience et une bonne expérience utilisateur mobile; ils pourraient ne pas être la même chose.
Concevez pour les utilisateurs en optimisant leur perception, leur utilisation et leur interaction avec leurs appareils.