web-dev-qa-db-fra.com

Voyage oculaire contre toucher sur mobile

Si nous voulons qu'un utilisateur effectue une certaine action, nous facilitons la sélection de cette option par rapport à toute autre option disponible.

Par exemple, pensez à une annonce pop-up, "Voulez-vous télécharger/installer/vous inscrire?"

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

Vous souhaitez que le bouton OK soit plus visible pour encourager les utilisateurs à cliquer dessus. Certains concepteurs le rendraient plus grand que l'autre bouton. D'autres comptent sur les voyages oculaires, les plaçant au-dessus ou d'un certain côté de l'autre.

Veuillez noter que je suis aux États-Unis, où les déplacements oculaires sont de gauche à droite. Par conséquent, si vous placez le bouton vers la gauche, ce sera le premier qu'un utilisateur verra lors de la numérisation des options disponibles, ce qui les rendra plus susceptibles d'accepter sans remarquer le bouton Annuler. Si vous deviez d'abord mettre le bouton Annuler, les utilisateurs se rendraient plus probablement compte que c'est une option disponible et se désengageraient.

(Je comprends qu'il existe de nombreuses raisons de placer les boutons OK/Annuler à gauche ou à droite, dont beaucoup sont abordés dans OK/Annuler à gauche/à droite? . Aux fins de cette question, je je fais référence à la lecture de gauche à droite, donc j'aime le point que Annuler/OK, c'est comme demander "Non ou Oui". Cependant, puisque je pose des questions sur le mouvement des yeux, Pourquoi les boutons 'Ok' dans les boîtes de dialogue Travailler mieux à droite fait un excellent point que les utilisateurs peuvent lire les deux options avant de décider.)

Maintenant, ma question concerne les appareils mobiles. Une écrasante majorité des gens sont droitiers (j'ai trouvé des chiffres de 70 à 90%). En supposant qu'ils utiliseraient plus souvent des écrans tactiles avec leur main droite, il serait plus facile de cliquer sur le bouton le plus proche de votre main droite afin de ne pas avoir à atteindre votre doigt ou à déplacer votre bras aussi loin.

Mais cela contredit directement mon point sur les voyages oculaires. Y a-t-il un meilleur ordre pour mettre des boutons OK/Annuler lors de la conception pour mobile? Et dans les pays qui lisent de droite à gauche?

3
sacohe

En supposant qu'ils utiliseraient plus souvent des écrans tactiles avec leur main droite, il serait plus facile de cliquer sur le bouton le plus proche de votre main droite afin de ne pas avoir à atteindre votre doigt ou bouger votre bras aussi loin.

Je pense que c'est une hypothèse erronée, je suggère l'article de Steven Hoober Comment les utilisateurs tiennent-ils vraiment les appareils mobiles?

Étant donné qu'il existe de nombreuses façons de tenir les appareils, personnellement, je me concentrerais principalement sur une utilisation à une main si vous concevez pour mobile, car cela vous donne le plus de contraintes. Si cela fonctionne pour une utilisation à une main, il fonctionnera probablement également pour le reste.

4
TomDoes

On peut supposer que 85% des gens sont droitiers et tiennent leur smartphone dans leur main droite en naviguant avec le pouce. Mais savons-nous combien utilise une seule main pour naviguer? Ou utilisent-ils deux mains - tenant le smartphone dans la main gauche en naviguant avec le doigt pointé droit - parfois, et dans d'autres cas, n'utilisent la main gauche que parce que l'utilisateur est habitué à tenir les téléphones de cette façon? Le problème est - avec les appareils mobiles - nous ne savons pas.

Nous devons aborder toutes sortes de techniques de navigation. Ainsi, le conseil est de suivre la convention sur chaque plateforme, ou la convention évoluant toujours sur le web mobile. Il y a souvent des cas où une vieille convention ou ideom parcourt l'évolution sur différents appareils ou la création de nouveaux appareils. Dans ce cas - respectez la convention générale si vous ne trouvez pas de convention spécifique sur votre appareil cible/le Web mobile, et vous serez en sécurité.

1
Benny Skogberg

Je serais d'accord avec Vincent (sur la base des recherches effectuées par Nielsen Norman Group ), mais je ferais même un pas en avant en disant que la cohérence au sein de l'application est probablement ce qui est le plus important ici. Si vous avez le bouton "OK" sur la droite, puis basculez-le vers la gauche dans la boîte de dialogue suivante, cette incohérence est ce qui va déclencher les utilisateurs plus que si l'application avait une cohérence autonome.

0
amiller

Don Norman ("père d'UX") en a parlé assez souvent, et finalement il a posté un article parlant de cette très grande question: est-ce que je mets ok en premier ou en dernier ?

Sa conclusion était que cela n'avait pas d'importance, mais ce qui compte est constitué dans toutes vos interfaces. La commutation de la commande en continu tout au long de la procédure entraînera le plus gros problème.

Une façon de faire ressortir votre bouton serait de le mettre davantage en valeur par la couleur, comme le font la plupart des applications. Vous pouvez également modifier la taille pour accentuer encore plus le chemin que vous souhaitez qu'ils prennent, ou vous savez qu'ils prendraient.

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

Quant au mobile, pourquoi ne pas simplement centrer le bouton et le rendre pleine largeur? De cette façon, il est facilement accessible aux gauchers et aux droitiers. C'est ce que je fais, ça et ça semble bien fonctionner.

J'espère que cela pourra aider

0
Majo0od

Ne le rendez pas trop complexe simplement:

  • Évitez les popups de dialogue sur mobile car cela distrait, interrompt les flux et augmente l'effort mental. Et votre annonce contextuelle ne fonctionnera pas en termes de CTR car elle est ennuyeuse.

  • N'utilisez pas de boîtes de dialogue comme "Voulez-vous télécharger/inscrivez-vous/etc" juste présenter un lien pour cela.

  • Utilisez la convention spécifique à la plate-forme pour l'ordre ok/cancel. Consultez le guide de style Apple/Android/Win8.

  • Dans le cas du Web, prenez ce que vous voulez, mais restez cohérent.

  • Sur le Web, il est recommandé de mettre en évidence votre bouton CTA et de présenter l'annulation sous forme de lien texte.

  • Essayez de donner juste un bouton pour l'action offerte centrée et étirée en bas. Si vous ne le souhaitez pas, vous pouvez effectuer un clic vers l'arrière ou vers le haut.

0
FrankL

Un point important à considérer est la nature des conventions de plate-forme. Si toutes les boîtes de dialogue mettent OK à gauche et Annuler à droite et que votre application rompt cette convention en changeant les boutons, vous constaterez probablement que vos utilisateurs cliquent beaucoup.

0
vincent.io