6

when designing a mobile app, is there any 'rule of thumb' for when (and when not) to use a side navigation? (e.g.: http://interactb.in/post/26070029431/i-personally-support-the-mobile-side-navigation-trend).

the app i'm designing includes rather small amount of pages/sections (about 3) - which could fit well on the standard iphone tab bar. however, having the tab bar clean seems to improve the focus on the content and also makes the app look a bit more trendy. i'm just wondering if side navigation is more suitable for app with many sections.

Improve this question

4 Answers 4

Reset to default
4

I'm afraid it's not as easy as a rule of thumb but depends on the use case. There are some points to be considered. Maybe the following list can help to decide:

Side navigation

  • still works for more than 3-4 navigation items
  • could potentially be used to display a nested navigation
  • good for navigation options that are less frequently used
  • use if you have >3 navigation options and for less frequent used areas

Tab bar

Google+ iPhone App

  • usually fixed (i.e. not scrolling)
  • quick and direct access (vs. 1 click more for side nav)
  • good for including notifications (see below, friend request on Facebook)
  • needs easy to understand icons or icons in combination with text
  • reduces vertical viewport space (let's not fool ourself - the side nav would also need to live somewhere..)
  • use as only navigation if you have 3 or less navigation options
  • use for features that are very often used and combine with side nav if needed

Both

Facebook iPhone App

The Facebook iPhone app uses 3 different navigations (not trying to judge the concept)

  1. Long scrolling side nav with all navigation options + search
  2. Fixed tab bar for most frequent used items and event notification
  3. Scrolling tab bar for important features that still disappears when scrolling

Update October 2013:
Facebook changed the nav of their iPhone app lately and introduced a static tab bar in addition to the two nav concepts they used before.

Improve this answer
3

Fixed tab bar: You should use a fixed tab bar if you expect your users to switch views frequently, where conventional usage entails constant switching between views. And also if you want your users to be highly aware of the different views, like a dial pad on one tab and a contact list on another tab. Views that could be expected to be accessed less frequently, like the settings view, should not be accessed in a top tab structure. The tab bar should conventionally follow with the scroll.

Three is a good number for using a fixed tab bar, just make sure that you phrase it short and concise.

Side navigation (Navigation drawers): Use a side navigation when you want to provide access to top views from a detail view, eg accessing the details of a list item will still enable the user to switch to another perspective without having to go back first to the initial view (which a fixed tab bar would require). And also when you want to provide direct access between views that aren't directly connected to each other. Use this control when you have a large set of views, more than three is a good number to start thinking about it. Also if your app has deep navigational branches.

Improve this answer
4
  • thanks for reply. you nailed my dilemma: i have a small number of views/sections (maximum 4). but i don't want users to switch views frequently. just to clarify - in this case, with 'fixed tab bar' i mean the iphone's native bottom tab navigation bar.
    – Roostermaster
    Commented May 28, 2013 at 7:42
  • what would you recommend to do in such case?
    – Roostermaster
    Commented May 28, 2013 at 7:47
  • @Roostermaster I see. Could you provide any more context, an example of the different views? What is a typical use case?
    – AndroidHustle
    Commented May 28, 2013 at 7:57
  • @roostermaster, from what you described in the question, it seems that you might be better off with the tab bar. You have only a limited set of 3 items, so you don't benefit much from the side menu. Nevertheless, you would pay the downsides of the side menu, like low discoverability, increased complexity and longer time to learn. If you don't need it, spare the fuss. The "trendy" look is not worth it.
    – Dvir Adler
    Commented May 28, 2013 at 13:55
1

Good question - I've been dealing with this for some time. As far as I'm aware there is no definitive answer from a research perspective. There are numerous options, which I'm sure you're aware of.

I am aware of Baymard's explanation of why we shouldn't use native dropdowns http://baymard.com/blog/mobile-dropdown-navigation

My preference is to make this as easy for the user as possible (obviously). For example if you have the standard "3" lines to denote navigation which is becoming more and more a standard GUI, then how does a user know to click it or drag it? The reason (*perceived) why is swipes in from the side is that users can easily use a gesture to get rid of the navigation.

For reference, in the feedly app, they "open" the side navigation first when the user first enters the app to show that the navigation is on the side.

Improve this answer
2
  • Hi David, and welcome to UX.se. We follow a principle of not including signatures in each post the way that many forums do. Instead you can include any links to services in your profile.
    – JohnGB ♦
    Commented May 28, 2013 at 8:20
  • My apologies John. Consider me a newbie and more than happy to comply.
    – UserConversion
    Commented May 28, 2013 at 9:42
1

I will only add to the other excellent answers that a tab bar exposes the different sections immediately, allowing the user to assess a lot faster what the app has to offer.

This is crucial as apps get attention spans of only a few seconds, after which they are mostly deleted or ignored, as statistics show.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.