2

enter image description here enter image description here

Facts:

  • Multiple toggling buttons
  • Only one may be selected at a time
  • There is an initial toggled button, which will be changed after a save action
  • Must occupy as less space as possible (i.e. minimalistic + no outside-of-the-buttons text)

My solution:

  • All non-toggle buttons will be simple (i.e. gray)
  • Toggled buttons will become coloured (i.e. blue)
  • Initial selection is marked by a green tick above the initial toggled button

Question: I kinda have my doubts about this implementation. Will the user get used to this mechanism quickly? As a programmer, I find it user friendly, but it really has to be Jimmy-proof.

(got the tick and colouring ideas from here)

Improve this question
3
  • It's more like status, so probably you need no buttons, instead use label, which displays current status.
    – Alexey Kolchenko
    Commented Dec 12, 2013 at 11:07
  • Are you only showing initial selection and not previous selection? Does that mean you will not see the tick mark once a selection has been made? This will be an important consideration for me when thinking about how to indicate this (or if it is required).
    – Michael Lai ♦
    Commented Jul 16, 2014 at 23:45
  • Echoing @AlexeyKolchenko, are these buttons that the user clicks to change the state, or indicators to show what the state is? Also, why do you need to indicate the initial state? Why would a user want to know this? (might depend on answer to first part).
    – TripeHound
    Commented Mar 23, 2017 at 16:13

1 Answer 1

Reset to default
5
  • Only one may be selected at a time
  • There is an initial toggled button, which will be changed after a save action

Under these conditions why did you opt for buttons and not radio buttons?

A radio button is an element that allows the user to choose only one of the options and seems to be the logical choice in your case.

I find buttons rather confusing when used for anything else than triggering an action.

Improve this answer
2
  • Yes but the how will you let the user know which was the initial selection? Plus, you have to admit: these are prettier than radio buttons.
    – Georgian
    Commented Dec 12, 2013 at 14:26
  • The initial selection is the radio button checked when the page is opened. You could keep track of the changes and implement the "undo" to restore the initial state. And the "prettiness" of those buttons is pretty much subjective, in you sacrifice usability for design...
    – Toni Toni Chopper
    Commented Dec 17, 2013 at 12:46

Your Answer

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

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