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.

have an app that needs to select multiple checkboxses. These checkboxes are grouped by category. Something like this:

enter image description here.

For touch devices (iPad, iPhone,etc) this is not so nice. Hard to tap on checks, while you might need tonscroll the area. The select options might be more than 80 options. You are allowed to select multiple options.

Is there a different way I can achieve this that's more touch friendly.

share|improve this question
    
Why would the checkboxes be difficult to activate? If this were an HTML document, the appropriate use of the label element would nullify the "difficult to click" properties of checkboxes. Is there an equivalent to this element in whatever you're using to build your app? –  cimmanon Jan 24 at 19:27
1  
What these check boxes are for? I think there may be a method to get rid of 80 checkboxes altogether! How many can be selected at most? –  BlueFlame Jan 25 at 1:38
    
That is the question: what ui should I use for mobile to get rid of these 80 checkboxes. I do need the the user to opt between 80 different cities of the world. –  user41529 Jan 28 at 6:20

1 Answer 1

Standard checkboxes are not typical on touch devices.

If they must be used, the preferred UI implementation would be a 'selectable bar' such as this android example:

enter image description here

Or perhaps a toggle would work ala iOS:

enter image description here

In both cases, the advantage with these is you are creating a larger touch area than your typical HTML checkbox (yes, the label is and should be a trigger as well, but visually many people miss that fact).

Regardless of your particular UI control, you'll likely want to stack them vertically. It's much easier to scroll, scan and select items on a small device when it's all vertical.

That said, you mentioned

The select options might be more than 80 options

That is likely not solvable via a UI control. At the very least, you need to re-think the user flow and how they're going to read through 80 options. Can this be paginated? Tabs? Wizard? Panels? Sliders? Anything but 80 options on one screen?

Ideally, there'd be a broader rethinking of IA and business rules/requirements here. That's a daunting amount of items for a person to scan through and select on a desktop--let alone a mobile device.

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.