1

I'm currently working on a Content Management System where authors can post articles. Before publishing, they must select a primary category for their article. For example "Entertainment", "Politics", or "Technology". This determines where to file the article in the overall hierarchy of the site. There are a predefined number of these to choose from, therefore, this is currently achieved using a radio button group.

However, if applicable, authors should be able to select multiple categories for an article, but with only one of them being the primary category. This is currently achieved listing the categories again, labeled 'secondary', and using checkboxes.

While the intentions are clear to the user, it makes the interface clunky, wastes space, is not scalable, etc.

Any ideas on a custom control that could combine these multi-selectors into one UI element?

Improve this question
2
  • With regard to scale, how many categories are we talking about? Is it a taxonomy tree with sub categories or just a flat list? Commented Jul 19, 2013 at 1:21
  • 1
    Just a flat list of 5-6 Commented Jul 19, 2013 at 2:05

2 Answers 2

Reset to default
4

You could allow the selection of all categories first, then the selection of the default one.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

The drop down for the default category would only list the categories selected above. If there was only one category selected, then that would automatically be the default category.

Improve this answer
2
  • Thanks, this could work. Side note: picking only a default category by itself happens probably ~75% of the time. Commented Jul 19, 2013 at 2:20
  • On top of that, human behavior studies suggest that user will usually select the default category first, follow by all the sub categories. Tap on that behavior and set the first selected option as the default category. (You might have to do some research on the human behavior studies.) Commented Jul 19, 2013 at 3:16
0

Rather than having two separate lists, why not combine them?

Add a second column of radio buttons that only appear if the item has been checked. This way, the first user action is to define what categories are to be applied to the content and then within that subset the user defines the primary category:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

This would allow you to use less screen real-estate and might be more intuitive for your users.

Improve this answer
3
  • 1
    This was my immediate thinking too. The problem was it's unclear what the check box and radio were for. It became a visual labeling problem. I re-listed them side by side with primary and secondary labels above but it still seems repetitive. Commented Jul 19, 2013 at 2:17
  • 2
    This is confusing and user might be challenged whether to select the checkbox or the radio. And can I select only the radio ? Commented Jul 19, 2013 at 3:13
  • The radio only displays if the checkbox has been selected. So upon first view, there would only be checkboxes. Commented Jul 19, 2013 at 3:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.