I'm currently working on an Android app designed like this:


download bmml source – Wireframes created with Balsamiq Mockups

I have a ActionBar containing tabs that represent different categories for my content. Each tab contains a list with items contained in that category. When clicking on a item it opens the content view which, aside from the content, contains the same tab bar to switch to another category and a popup button on the bottom bar which brings forth a popup to navigate to the comments or content info.

I want to redesign the app in such a way that the popup to navigate to the comments or content info can be omitted from the design, because it interrupts the navigation flow.

In iOS I have solved this issue by placing a segmented control containing "Content","Comments" and "Info" in the navigation bar at the top of the content, comments and info screen and switching views whenever the user selects one of the segmented options. Something akin to this:

enter image description here

Since Android doesn't have a navigation bar the way iOS does and minimal support for segmented controls, what would be the best thing to do here to keep a good user experience? I was thinking of using some kind of sub-tab system but looking around sub-tabbing seems like a bad practice.


I would get rid of the category tab bar when viewing your content and replace it with a "Content", "Comments" and "Information" tab bar. It seems to me that in the content, comments and info screens the categories aren't relevant to what the user is doing at that moment, it would be better to replace it with a more relevant tab bar.

| improve this answer | |

You have a number of possibilities. My top 3 suggestions;

  1. Establish a priority for the possible views and order them sequentially under on the same screen.
  2. Consider partitioning content heavy or uncommonly view content with a collapsible or partially collapsible region.
  3. Buttons or menu to navigate individually from the primary content, to the secondary content.

In your example, comments are generally thought to be secondary to the content. That is why blogs and media outlets generally have comments at the bottom. Why read the comments without reading the source material?

Remember that android does have a back button. Try not to concern yourself with fitting your UI around the target platform*s*. Rather, design a UI for a single target platform to consume the data. Then, when you want to port to another platform, redesign if the platform features do not support your existing navigation structure - but still consume the same data.

| improve this answer | |
  • I may have mistunderstood your answer, but I already have the "data consumption" designed. (Content first, followed by comments and then content information) In iOS I have solved this by showing the content and then allowing the user to go to the comments and info using a segmented control to give a kind of "tabbed" user experience. In the Android version I temporarily solved this by using a popup where the user can select the view to open. I want to get rid of this popup to provide a smoother navigation for Android, but I can't figure out what would be best practice here. – Leon Lucardie Sep 12 '13 at 7:54
  • 1
    For each of the options on the popup, I suggest buttons at the bottom of the main_content screen. Each button that navigates to new activities showing the secondary content. The goal is to reduce the 'steps' required to get to your content. You omit a required tap by removing the popup. You also reduce navigation depth by one (the popup) which is good for cognitive load. – Gusdor Sep 12 '13 at 8:00

Your Answer

