Utilisation de DEUX menus hamburger dans une application mobile
J'ai un client qui INSISTE sur l'utilisation de DEUX menus de hamburgers dans leur application: un en haut à gauche, un en haut à droite. Il s'agit essentiellement de refléter les fonctionnalités de deux sites Web connexes: l'un utilise le hamburger gauche, l'autre le droit.
Cela semble violer les principes de conception que je connais intuitivement mais que je ne peux pas exprimer verbalement.
Mais quelqu'un peut-il penser à la façon dont je peux expliquer pourquoi cela est faux et indiquer une incompréhension fondamentale de la conception de l'interface utilisateur?
Pour étendre la réponse de Tohsters, un menu de hamburger est déjà assez préjudiciable, donc en ajouter un deuxième ne fera que confondre davantage les choses.
Si le client ne peut pas être persuadé de suivre d'autres voies, il est probablement préférable de commencer à chercher des moyens de tirer le meilleur parti d'une mauvaise situation. (ce billet de blog développe ce sujet https://lmjabreu.com/post/why-and-how-to-avoid-hamburger-menus/ )
Ajout d'un "menu" à côté du hamburger . Cela peut augmenter l'interaction de l'utilisateur mais ne résout pas les problèmes avec le menu lui-même. Les chiffres suivants donnent quelques chiffres dans l'augmentation de l'interaction. ( http://moovweb.com/blog/hamburger-menu-handy-tool-or-useless-icon/ ) ( http://exisweb.net/menu-eats- hamburger )
Résumé: L'ajout de menu au hamburger, ou tout simplement un menu à lui seul augmente le taux de clics. Un exemple de ceci est une image tirée de exisweb.Ce n'est pas une énorme différence, mais c'est suffisant pour vous convaincre que l'ajout d'un menu augmentera l'interaction.
![enter image description here]()
Barre d'onglets ou barre latérale . Je dirais à la minute pour une ressource lourde
site avec beaucoup de contenu une barre latérale est la meilleure option au
minute, alors qu'une barre d'onglets avec des options de menu limitées est de loin
meilleure option pour un site tourné vers l'avant où vous devez instantanément
montrez à l'utilisateur vos caractéristiques les plus importantes rapidement et évidemment. ( http://kong.vn/ios-navigation/ )
Les aspects à prendre en considération sont:
- Espace pris
Visibilité des articles
Accessibilité
Revenir à un point de départ
- Bouton d'action/exécution d'une action.
En tenant compte de ceux-ci, la barre d'onglets peut être beaucoup plus avantageuse dans tous les aspects, sauf l'espace pris, dans lequel elle sera toujours un élément fixe sur votre page (sinon ce ne sera qu'une autre barre latérale!). Pour ne pas dire que la barre latérale n'a pas sa place comme si vous avez beaucoup de contenu et d'actions, elles doivent être affichées d'une manière ou d'une autre.
Je donnerais plus de liens mais ma réputation m'empêche actuellement de le faire, c'est quelque chose sur lequel j'ai fait des recherches auparavant, mais je n'étais toujours pas en mesure d'obtenir suffisamment de preuves solides pour m'éloigner d'un menu de hamburgers pour notre site mobile à la minute.
Vous êtes le professionnel dans cette situation, il est donc de votre devoir de faire de votre mieux pour le convaincre que ce n'est pas la voie la plus intelligente pour descendre, alternativement s'il ne s'agit que d'un travail et non d'une tâche répétée, il pourrait être plus facile de serrer les dents et divisez le contenu de chaque côté avec un menu hamburger.
C'est une terrible idée
Tu as raison d'être méfiant.
Un hamburger suce déjà ...
Les menus de hamburger ne testent pas très bien pour commencer. Ici est le plomb UX d'Apple sur le sujet, et plus d'articles ici et ici , mais pour résumer:
- Ils cachent les liens et le contenu à l'utilisateur au lieu de lui présenter des options directes.
- L'icône du hamburger est placée en haut de l'écran où les utilisateurs ont tendance à l'ignorer .
- L'icône du hamburger n'est pas familière à de nombreux utilisateurs (mais cela change).
- Ils facilitent la conception bâclée car les concepteurs peuvent empiler négligemment des liens et du contenu dans le tiroir.
- Ils peuvent être difficiles à atteindre pour les utilisateurs mobiles avec des écrans plus grands lorsqu'ils sont placés en haut à droite ou (pire) en haut à gauche.
- Ils testent mal en A/B et autres tests utilisateur . Voir cet article qui contient des liens supplémentaires que vous pouvez suivre.
... et deux hamburgers sont encore pires
Chacune des raisons ci-dessus est aggravée en ajoutant un autre menu hamburger. En plus de faciliter le contenu caché et la conception bâclée, vous ajouterez plus d'ambiguïté aux utilisateurs qui doivent maintenant décider/se souvenir/décoder quel menu est approprié pour quelle fonctionnalité.
Pour certaines alternatives au menu hamburger, cette question peut être utile:
Je pense que c'est un bon exemple pour poser la question "Qu'est-ce que le client besoin?" vs "Qu'est-ce que le client veut?". Donc, si je comprends bien votre question, votre client veut présenter deux sites Web sous ne adresse et probablement aussi sous un n design.
Que ce soit une bonne idée ou non ne fait pas partie de ma réponse - pour l'instant j'essaie simplement de comprendre ce qu'il/elle veut réellement - et résultant de ce dont il/elle a réellement besoin .
Donc à mon humble avis, la tâche semble être de trouver une structure de mise en page/navigation, qui a) `` explique '' à l'utilisateur qu'il a affaire à deux sites Web différents et en même temps, rend les deux sites Web utilisables/navigable.
Donc, ce que vous pourriez faire, c'est basculez entre les deux sites via des onglets - vous ne pourrez alors afficher que n Icône Hamburger à la fois et essayez d'expliquer à votre client, que l'autre Hamburger est 'caché'.
- le site A) est actif -> Hamburger A) est affiché
- le site B) est actif -> Hamburger B) est affiché
Bien sûr, cela pourrait entraîner de nouveaux problèmes/nouvelles questions: Qu'est-ce qui est affiché sur la "carte inactive"? Pouvez-vous toujours voir l'icône de hamburger inactive/grisée du site inactif - ou simplement une couleur/logo d'arrière-plan, etc.? Mais peut-être penser la tâche différemment - ("deux sites Web en un" plutôt que "deux icônes Hamburger sur un seul site") - peut apporter d'autres idées et conduire à d'autres solutions que d'avoir simplement deux icônes Hamburger.
Voici quelques conseils pour vous:
- Tout d'abord, confirmez à votre client que vous respectez son opinion. Ne discutez pas!
- Deuxièmement, clarifiez avec lui que vous créez un produit pour les utilisateurs, pas pour vous.
- Troisièmement, organisez des tests d'utilisabilité et invitez votre client à participer.
- Ensuite, créez deux prototypes, l'un comme le souhaitait votre client et l'autre comme vous le souhaitez. Ou peut-être avoir un seul prototype avec deux menus.
- Enfin, effectuez des tests d'utilisabilité en présence de votre client. Ou partagez avec lui vos découvertes après.
Personne n'aime confirmer qu'il a tort après que quelqu'un l'ait signalé. Mais si nous l'avons découvert par nous-mêmes, c'est beaucoup plus facile. Faites découvrir à votre client qu'avoir deux menus n'est pas la meilleure idée à cause des recherches que vous avez faites ensemble. Prenez sa décision, pas la vôtre.
J'espère que cela aide. Bonne chance!
Mes deux centimes:
Deux hamburgers ou devrais-je dire deux mêmes modèles de navigation sont vraiment déroutants.
Tout d'abord, il occupe un bien immobilier précieux lorsque nous avons affaire à un petit écran.
Deuxièmement, la navigation est un aspect important et lorsque l'utilisateur se voit montrer deux façons redondantes de naviguer, il sera confus quant à celui à suivre. Aucune quantité de texte ou de démonstration ne serait utile ici car cela est complètement contraire au modèle mental des utilisateurs. Apporter l'exemple de la vie réelle - c'est comme amener un voyageur à un carrefour et lui dire que les deux routes mènent à la même destination, il n'y a pas de différence de distance, de paysage, etc., choisissez maintenant la façon dont vous voulez voyager. Pourquoi ajouter cette confusion.
J'espère que cela t'aides. :)