User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

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

I have some settings that the user of my software can change via a GUI. The settings reflect both the current state of the underlying properties, and the state of the user interaction.

Example: A slider which initially gets its value from the underlying properties. When the user interacts with the slider, the value of the slider changes, but it doesn't propagate to the underlying layer, until the user clicks a button.

Now, the user needs to know when there is an unsaved change to the slider, and so far I have colored the slider red, and it gets colored black when the user clicks the save button.

However, this choice of alerting the user, is completely arbitrary, and I was wondering if there is a more generally accepted way of notifying the user of changes like these?

share|improve this question
Welcome to UX, lejon! A wire-frame or an image could help your description. – JOG May 23 '13 at 7:09

I predict that if you test it, people would understand that their changes don't take place until they click "Save". In usability testing I sometimes even see the opposite: When changes are applied immediately after input, people did not realize it, and looked for the "Save" button.

If you insist on showing the old value before saving, I can suggest leaving a "ghost" of the handle of the slider in the original position. It would look very much like the regular handle, just grayed out. Since this ghost appears at the original location the moment the user starts to drag the handle, it would be very easy to understand this hint.


download bmml source – Wireframes created with Balsamiq Mockups

share|improve this answer

If you are using a save or commit button then you can use the visual ques of that button itself to make the state of the system visible.

The button is grey/un-selectable when there are no changes in the system. As soon as someone makes changes, the button changes to your system color (blue/green/what-have-you). This is the standard approach in alerting the user of status change if there is a save button. Used in forms, settings, and many other situations.

The added benefit of using the button as the visual cue rather than the slider is, if you have more than one settings on the page which can be changed, you do not need to make such subtle changes in each and every interaction. The button can act as a common indicator for all. However, that being said, you if you choose to do the individual interactions on top of that, it adds a secondary layer of confirmation which is not necessarily a bad idea.

Also, when you are placing a save button, you are implicitly informing the user that the changes need to be saved in order for them to be effective. Else, you could have removed the button and save each and every change the user made.

share|improve this answer

Your Answer


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.