User Experience Stack Exchange is a question and answer site for user experience researchers and experts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

As a general standard, when having an icon for a setting, I've never been sure whether to display the icon for the currently enabled setting, or the alternative.

My exact situation is within a mobile game, where the player can choose between tilting the device, or having buttons on the screen to use. So i have two icons, one a mini screen with buttons, the other a mini screen with rotation arrows around it.

So in this situation, should I display the icon that corresponds to the current control setting, or display the opposite one, so they change to that setting when they click on it?

Is it a matter of preference, or is there some standard behind all of this?

share|improve this question

migrated from Feb 20 '13 at 11:56

This question came from our site for professional programmers interested in conceptual questions about software development.

marked as duplicate by JonW Feb 20 '13 at 12:21

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

already asking this question should be enough to answer it: if YOU are confused, the users for sure will be... just use another method to visualize it, would be my advice – wrm Feb 20 '13 at 10:31
up vote 2 down vote accepted

I don't think there's a standard, at least, I haven't seen a standard and still get confused sometimes.

It seems to me that clicking on an icon (or button, or whatever) means you are after a change. The icon image or text in a button should indicate somehow what change will take place.

So the icon or button should display the state that will take effect when the icon or button are selected.

share|improve this answer

No matter which way you do it, about half your audience is going to be confused that it's not the other way. You're really better off thinking of it as enabling or disabling tilt, rather than enabling tilt or enabling buttons, which means using something like a toggle button to represent the state.

share|improve this answer
I'm with Karl on this, state buttons are wrong, "is it going to change? is it showing the current state?". I normally end up switching those type of buttons a few times to check what happens. Much better to so as Karl has said and make the actual option clearer, tilt on/off. – G3D Feb 20 '13 at 3:11

This problem has no correct solution. The problem is that you are trying to use one button for function that needs radio control, or at least 2 buttons, working as a radio (only one of them can be pressed at time) - One button for "control by screen" and one button for "control by tilt". When you press on "control by screen" the other button becomes unpressed and vice versa:

Mode1: ([] - pressed button; || - unpressed)


Another possible clear solution is to separate the button that will switch these two options and the indication of the current mode. Here is a text example for the two possible states.

 [Click to switch] ----> (Tilt mode)

 [Click to switch] ----> (Screen mode)
share|improve this answer

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