tabs - Porting an Iphone app to Android - what are the ActionBar considerations?

we have an iPhone app Design with an designed icon tab bar at the bottom.

For adoption to Android I have a few questions:

1. Is there a need to put the tabs to the top? Or is it okay to break with Android UI standards sometimes?


2. Is it okay to still develop with tab bars or would you really suggest using the ActionBar in case of Android? If so, why?


3. Can we use the bar buttons like they are or do we need a ActionBar with smaller buttons and texts? Do we need a home button etc.?


4. Is it possible to keep the orange button overlapped - with or without ActionBar?

Answer

Your example could easily converted to ActionBar. I strongly advise anyone porting an iOS app to stick with Android guidelines; it gives better integration to the overall platform. On iOS, it is very common to use tabs as there is a persistent tab bar at the bottom. On Android, we use tabs a little less and hierarchize the importance of toplevel application sections that would belong to the same tab strip on iOS.

I guess one of those tabs is used as "home screen" when the user runs the application. Then, you could have three tabs directly in the action bar: Shop, Stamps and Rewards. The Settings part, since it is less used (do users will use settings as much as other sections?), can be put in the overflow menu.

About the big button with a stamp on it: you could put it at the bottom of the screen whichever tab is active. In addition or in replacement, it is also possible to put the stamp as an action button available in the bar, at it looks like it is a major action that should be called often.

To wrap it up, the action bar may look like this:

[ icon  Shop | Stamps | Reward    | ... ]

st stands for the icon for the quick action, identical tho the round stamp button; ... stands for the overflow menu, behind which you will find the Settings item.

Two additional benefits about using the ActionBar:

• If there is not enough width to fit all, the tabs will automatically go on a second row.


• If, on the opposite, the app runs on landscape or tablet and a much wider space is available, the quick action buttons or overflow menu elements can be configured to automatically show text and migrate to the bar depending on how much room is available. You decide the behavior for each button.


• Programming is much faster. The ActionBar is already there. Bottom tabs would need a separate implementation.


• And... you just stick to the guidelines and contribute to a consistent experience, which is part of UX quality.

In my opinion: putting iOS-styled tabs on bottom on Android is like putting traffic-light-colored window buttons on the top left of a Windows application frame. It belongs to a different system. I have seen many people today making mobile apps like they do websites, and thinking about such developments like they would do web pages. But, mobile apps are applications, not web pages; they belong to an ecosystem and we all need to keep this in mind.