Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

Is it ok to have TabBar in Modal view in iOS UI (iPhone)?

I have a "Select Contact" view in my app and I plan to make it as modal view. But "Select Contact" is a set of views: "Favourites", "Contacts" (Address book list) and "Keyboard" (to dial number manually).

There is no restriction - "Select Contact" could be part of navigation controller, but as far as I know a TabBar inside a navigation controller is considered bad practice.

Common practice is that tabbar is the root contoller. So I'm not sure can I use it in modal view.

Currently I see two options:

  1. Modal view with TabBar
  2. View on main navigation stack with segmented buttons in the navigation bar (but here I think it is more used for filtering table view results)

Do you have such experience?

share|improve this question
    
Are you talking about Tabs? If so, I think you should rename "Tabbar" to tabs because for a while I had no idea what this question was asking. –  Rich Feb 1 '13 at 8:44
1  
Richard, I believe that iOS interface designer should know what is a tabbar. This is official name for it. Here you can find more about tab bars: goo.gl/KcEu5 –  OgreSwamp Feb 1 '13 at 8:46
1  
@OgreSwamp: Perhaps, but the question does not reference iOS once. –  André Feb 1 '13 at 10:36
    
Sorry, I mentioned that in tags but forgot to add that in question's title/body. –  OgreSwamp Feb 1 '13 at 10:48
add comment

3 Answers 3

I can provide you with two different approaches for selecting contacts / participants.

enter image description here

Viber uses one list for contact selection when composing a message. If the user wish to compose a message to a number that is not added to a contact the user can enter that number directly in the search field. This way you save screen real estate.

Skype offers more categories for contact selection, and they're using an expandable panel with tiles to select the featured filter, rather than the tab bar that you're going towards.

enter image description here

enter image description here

This saves screen real estate, plus it enables the adding of additional filters without crowding the view since it's collapsable. However the control does suffer from some discoverability issues.

For your application I would suggest going for the Viber version for one reason. You want the user to be able to search for contacts and you want them to be able to put in a phone number of their choice, Viber does this fine. However, you also want to add favourites to the filter. I don't know how the usage pattern looks in your application but I'm fairly sure that the "Favourites feature" is not that utilized among iOS users, seeing that it's not a native feature.

Personally I would consider scrapping the favourites filter in this view However if that is not something you want to do you can probably find a way to integrate it into the Viber solution, like using a "Star icon" instead of a "Favourites" copy to represent the filter to save screen real estate.

share|improve this answer
    
Thanks for suggestions. Second option isn't applicable for me. In case of skype this is a filter. They filter All Contacts and leave some rows. In my case I have 3 screens, one of them isn't a subset (keyboard screen). First option looks like a possible way. Customer prefers full screen keyboard view (like in Phone app on iOS) but probably I'll be able to discuss that point. –  OgreSwamp Feb 1 '13 at 9:09
1  
@user25438 ah, yes that's right. And adding a dial pad to a featured filters panel does sound like a pretty confusing approach. Regarding the first option, you're right about the key layout, providing a dial pad is usually appreciated. In any case, maybe now you have some more info to consider when doing your design. Good luck! –  AndroidHustle Feb 1 '13 at 9:23
add comment

Option 1. Better do not. It's may be more confusing than you're thinking. TabBar only as root navigation control, as you mentioned.

Don’t use a tab bar that lets users act on elements in the current mode or screen (that’s what the toolbar’s for). It should be accessible from every level in the app, and helps flatten the app’s information hierarchy.

Option 2. I think that will be a lesser evil. In my opinion for filtering more appropriate will be somethink like ScopeBar and for your case SegmentedControl will work perfectly.

share|improve this answer
add comment

If there is a large amount of contacts it would be wise to assume the user might want to search through those contacts. So an option would be to have a search bar with a scope bar at the top of the view. The scope bar would allow you to switch between "All, Favorites, etc." and still keep the proper modal design principles as well as add a feature of letting the user search.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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