We have a 5 level navigation menu that needs to be incorporated in Mobile devices with a good & best usability approach.. which does not cost multi click for the user to view the 5th level menu.
Please share your usability approach on this.
-
1Can you show us what you've tried already? We can't do all the work for you, but we can help guide you and indicate how to improve on what you've already done.– JonW ♦Apr 3, 2013 at 7:53
-
Just a tip: you can upload some image to imgur and add a link to it in your question. Someone will embed it for you. Interesting challenge, btw.– Dominik OslizloApr 3, 2013 at 7:57
-
I think the main problem is the website structure/navigation depth. Not sure if you can change the navigation, but hope this article will help you in the future smashingmagazine.com/2013/03/27/navigation-mega-sites– Igor-GApr 3, 2013 at 8:56
Add a comment
|
2 Answers
Looks like you're trying to take the entire web site structure and cram it into a phone interface. That is a daunting task which one need to handle with care. First I would advise you to analyze the structure of your content. Do you really need a five-level-deep navigation hierarchy? Or can you organize content differently? Could you use tags or filters? Do we need all of the content available on mobile? These kind of questions are important to start with.
But if you have done all that, and still come to the conclusion that a five-level-deep navigation is just what we (as in our users) want – then I’d suggest the following:
Personally, I’d use a classic sideway tree view navigation element that Spotify uses. You see where you are, where you can go to and where you came from.
Here are the five levels:
- The start navigation button (three horizontal lines)
- Navigation menu where I select Playlists (red circle) which is the title on level 3
- Playlists where I select Synth & Techno folder (blue circle) which is the title on level 4
- Synth & Techno where I select Depeche Mode - Delta Machine (green circle) which is the title on level 5
- The songs on level 5 - each one selectable.
Notice on screenshot 2-4 the upward navigation to higher levels in the hierarchy, represented by a button with pointy edge to the left.
answered Apr 3, 2013 at 8:17
-
Spotify is a great example to follow, however most of the above screens present just navigation, not the content. Content itself is only presented on the lowest level (tracks). Thus a question arises, if it is necessary to present content at any of the higher levels. If so, it cold be still possible to adapt this model, but with a need of switching between menu mode and content mode. And of course - reshaping the navigation for mobile, cutting off non-mobile elements from it and thus reducing the navigation to what is necessary is a direction to go (though some may disagree). Apr 3, 2013 at 9:31
You can have a nested menu sliding in from the side to reduce the number of pages you'll need just dedicated for navigation:
https://itunes.apple.com/us/app/remember-the-milk/id293561396?mt=8&ign-mpt=uo%3D4
See the first image, its a two tier menu in a single slide. I have seen a couple other apps which do a similar two tier menu, you can maybe stretch it further to three (or four?) but I feel that you should rethink your navigation to reduce the tiers.
There might be a misunderstanding since you're not providing a screenshot, but can you provide some more context or tell the domain for which you're building the app?
