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.

I have an iPad app interface that feels a little weird to me and I'm wondering if anybody has seen a good solution to this situation. (I've changed the content so that I can post it here---my app is not really about cookies and cake so sorry if the content feels a little contrived)

Here's the scenario:

  • You have presented the user with a modal dialog where they will set a bunch of things and then tap create. (Let's say they are setting up a menu for a catering company or something like that)

  • On one section of the dialog, the user can choose from a list of things (they can select only one), and one of those items comes with a sub-setting (In this example it's Cookies, they can choose how many)

  • There will be more options soon (otherwise a button bar at top might work, right?) ...but let's say we know that in the next year we will add Fruit Salad, Cupcakes and some other things.

  • Let's also say that you want to interface to feel like stuff is there (otherwise a single line that calls up a carousel of options might work, right? but it would look too sparse)

Here's a mockup:

interface showing a list with an option on one of the items

share|improve this question
    
Strictly speaking, Apple have a control for this purpose (the Detail Disclosure Button). –  Kit Grose Feb 11 at 1:16

3 Answers 3

For selecting the cookies option, you typically would either use a picker or a table view. Apple provides guidance for which to use:

In general, use a picker when users are familiar with the entire set of values. Because many of the values are hidden when the wheel is stationary, it’s best when users can predict what the values are. If you need to provide a large set of choices that aren’t well known to your users, a picker might not be the appropriate control.

As much as possible, display a picker inline with the content. It’s best when users can avoid navigating to a different view to use a picker.

Consider using a table view, instead of a picker, if you need to display a very large number of values. This is because the greater height of a table view makes scrolling faster.

If you use a picker, you could either make it always visible or display it only when the user taps on the "Cookies" row.

You are correct to show the selected option text in the detail label, but I would recommend against using a checkmark. The typical pattern would be, if you are displaying a table view for the user to pick the option from to use a disclosure indicator accessory (the little right arrow), or if using a picker view, use no accessory at all.

For some good examples, open the iOS 7 Calendars app. Tap the button to create a new event. In the modal view, you can see an example of using a picker view for the dates. Notice there is no table row accessory (no checkmark or arrow). Now, below the date is an "Alert" row. This row uses a disclosure indicator accessory because tapping the row opens a new table view.

share|improve this answer
    
I need something like the checkmark to indicate which item is selected. In my app (it's not really about cookies, but that's the example I'm using) the user can only pick one thing from the list. The equivalent of a radio button list where one of the items requires the user to set a size/quantity. –  pixelfairy Feb 13 at 5:23
    
Doesn't the phrase "1 dozen", or whatever value the user might select, already indicate that the item has been "selected"? –  Richard Venable Feb 14 at 22:41
    
I guess it does. In the real app (that isn't about cake and cookies) the other options would never have a quantity associated with them. Only one of the options (and the user can only select one option) requires a quantity to be set. –  pixelfairy Feb 18 at 22:02

Quantity seems to be a property of Cookies in your example. You can use an arrow to lead you to another interface where you can select the quantity.

share|improve this answer
    
Thanks! I didn't want to use an arrow because I want to make it clear which item is selected. My friend actually came up with the suggestion to keep the check but then put the quantity next to it. So, I'm going to go with that for now. –  pixelfairy Jan 12 at 0:11

The solution I've chosen to go with actually comes from a friend of mine but I thought I would share it here.

  1. the user taps on cookies
  2. when they do they get a dialog (a scroll wheel with numbers and units in this case) to set the quantity.
  3. a check mark appears by cookies and also the quantity

I like this solution because it still makes it clear that only one item in the list can be selected and the user can modify the quantity by tapping on it at any point. In cases where there are no settings attached to an option there will be no extra tapping.

interface showing a list with an option on one of the items

share|improve this answer

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.