1

Ideally it would allow for a one-click change from any one state to any other state.

Currently, I have a button that displays the current state. When you click on it, it just cycles through all the states in order.

For example, a button that represents a 3 stage priority. Stage 1, 2, and 3. So if my state was 1, and I clicked on it once, my stage would now be 2. I think this is ok, but I am wondering if there are any creative ways to allow for going directly from 1 to 3.

EDIT

Just now I thought that perhaps a left-click moves you forward, and a right-click moves you backward. I think that would work nicely. Any other ideas?

1

3 Answers 3

7

enter image description here

Or you can use tab button if it's only a few options. Spinner much preferred if it's numeric and more than 4 options.

3

3 simple radio buttons is the most clear, easiest to use and read solution. It does have the (possible) disadvantage of taking up more real estate than other solutions, so you'll have to decide if saving space is worth a less usable UI.

Spinner controls are probably the most conventional compact UI that will do the job.

The left-click=forward, right-click=backward is highly unconventional and I'd avoid it.

1
  • With a spinner control handling a limited range, it doesn't strike me as unreasonable for [MAX]+1=[MIN] (and [MIN]-1 = [MAX]). Physical spinners work the same way. This is common in spinners used to specify time. As for left-click=forward, right-click=backward, I have encountered interfaces (3-state grid puzzles) where this was in use. It was legitimately helpful, but only because there were so many individual "buttons" that double-clicking each button was painful (and to allow right-click drag for multi-button toggling).
    – Brian
    Sep 25, 2013 at 14:41
1

I am assuming that your users will use this control to set a priority, and also to assess the priorities that have been set. If that is the case it is important to make sure your control is not only easy to set, but also to see the current setting at a glance. I would recommended using 3 radio buttons or a combo of 3 buttons because it is not very easy to read the current setting from them.

My question is: is it really that much of a problem if your users have to click twice to set the control to the desired setting? Look at Gmail where you can assign stars in different colours to an email. My Gmail settings are set so that I have 4 different colours in use: Gmail settings showing which colours of stars are in use, if any

You have to click, double-click, triple-click etc. the white star in the top right corner of an email to give it a colour:
Screenshot of an email in Gmail

What I have found is that I have rapidly gotten used to e.g. clicking twice to make the star go orange. If your users use your app or website regularly, chances are they will become quite adept at it and simply click twice to go from stage 3 to stage 2 without having to think about it. I reckon this will be much easier to learn than a right-click to go backwards.

Keeping the button simple allows you to make it easy for your users to assess the settings, e.g. by reinforcing the stages with colour coding: Buttons in green, yellow and red to reflect the stages 1, 2 and 3

Your Answer

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

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