What navigation pattern to use for this iOS app?

Discussion in 'iOS Programming' started by salc, Jun 27, 2014.

  1. salc macrumors newbie

    Joined:
    Jun 27, 2014
    #1
    Hello macrumors forum!

    I'm developing an app that follows the model of the Android app - Google I/O 2014 (https://play.google.com/store/apps/details?id=com.google.samples.apps.iosched).

    The navigation will be something like this - Main navigation is in the navigation drawer, and the action bar consists of 3 filters to filter the content.

    Here are two screenshots of the Google I/O app -

    [​IMG]

    [​IMG]

    So my question is: how do you think I can translate this navigation to an iOS app? I don't want to do something completely out of the ordinary for iOS users. I'd like to use common navigation, if possible.

    Any thoughts? Thanks a lot!
     
  2. Ubuntu macrumors 68000

    Ubuntu

    Joined:
    Jul 3, 2005
    Location:
    UK/US
    #2
    While it's difficult to say as I can't get my hands on the Android app to play around with it I might suggest that the top level navigation be a tab bar (with items like "Design" and others, if there aren't too many of them as I find tab bars become counter-productive with too many items) and then perhaps I would have the Filter/All Topics be a separate viewcontroller that is presented in a modal fashion - accessible via a button in the navigation bar at the top.

    I know this isn't as subtle as just having dropdown boxes like in the Android app but I see this quite often in iOS - take a look at the WWDC app on the app store if you can for a good example.

    Also, I'd really recommend checking out the Human Interface Guidlines if you've not had a look yet. The UI Design Basics part can help if you need to familiarise yourself with iOS in general, but the "Design Strategies" section will help you break down the features of the app and then help you determine the best approach to take.
     
  3. salc thread starter macrumors newbie

    Joined:
    Jun 27, 2014
    #3
    Thanks for your reply!

    I've read the iOS Human Interface Guidelines before (for fun - I think it's amazing!), but I re-read this section. It didn't really help much, in this case.

    I saw the WWDC app as well, but it seems there just aren't as many filters in the app.

    Basically, the filters I have will be 1-Subject, 2-Unit, and 3-Exam.
    Subject will have 3-5 options, Exam will have about 5, and Unit will have >10. So I think it's clear I can't use those segmented tabs at the top :p
     
  4. Ubuntu macrumors 68000

    Ubuntu

    Joined:
    Jul 3, 2005
    Location:
    UK/US
    #4
    To me that sounds like it would be similar to the example shown here. If you play that example, it sounds like the Subjects would be where "Credit" and "Options" are in that diagram, then Exams would be where "Sound", "Music" and "Graphic" are, then Unit would be where "Classic" and "Custom" are.

    What do you think of this?
     
  5. salc thread starter macrumors newbie

    Joined:
    Jun 27, 2014
    #5
    But would you have to go through lots of taps for that? Also, it doesn't really keep that hierarchy glace-able, the way the filters do!
     
  6. dejo Moderator

    dejo

    Staff Member

    Joined:
    Sep 2, 2004
    Location:
    The Centennial State
    #6
    Your screenshots aren't appearing. Would you be so kind to try again, perhaps attaching the images to your post?
     
  7. salc thread starter macrumors newbie

    Joined:
    Jun 27, 2014
    #7
    It's working for me, but sure, I'll try again! Here are the links:

    1) http://imgur.com/XwvmMB1
    2) http://imgur.com/Mv40goJ
    3) http://imgur.com/IULNMR4

    Here is the link to the actual app, in case you have an Android device:
    https://play.google.com/store/apps/details?id=com.google.samples.apps.iosched&hl=en


    Let me know if there's any other confusion, and thanks!
     
  8. Ubuntu macrumors 68000

    Ubuntu

    Joined:
    Jul 3, 2005
    Location:
    UK/US
    #8
    Sometimes that's necessary. Consider the process of viewing an attachment in Mail when you have multiple inboxes, for example. That's Select an inbox > Select a message > Select an attachment. Such depth isn't something that's going to be out of place in iOS - the question is whether or not there's a more exciting & engaging user interface for displaying that content without sacrificing functionality.
     
  9. salc thread starter macrumors newbie

    Joined:
    Jun 27, 2014
    #9
    The difference between our examples is that in my case, it's important for the user to understand the context of where he is. After he chooses Exam and Subject, he shouldn't have to try and remember what he selected when he's drilling down to the chapter.
     

Share This Page