I'm developing a web application (I can post a link if you wish), which has a "workspace" with some items on it. Double-clicking an item opens a sidebar where you can set various properties for the item (like label, color, etc). I'm currently implementing a "live preview" for the sidebar. Whenever you change something in the sidebar, the change is immediately reflected on the item.
However accidents also happen and sometimes the user changes something they didn't want to change. So some sort of "undo" functionality is needed. Currently I'm implementing at the whole sidebar level - when the sidebar closes either all is saved permanently or all is reverted to what it was before the sidebar opened.
The sidebar can be closed in numerous ways - there's the familiar "cross" on the upper right, the user can select a different item on the workspace (or deselect all), the user can open a different sidebar (there are others for other purposes), etc.
So the question is, which route is better to take:
- The panel has a "Save" button, and that is the only thing which saves the changes. Closing the panel in any other way reverts the changes. (There might also be a "Revert" button, but that basically just closes the panel which auto-reverts anyway)
- The panel has a "Revert" button and that is the only thing which reverts the changes. Closing the panel in any other way saves the changes. (There might also be a "Save" button, but that basically just closes the panel which auto-saves anyway).
In other words, what is the more user-friendly way to go if the user closes the panel by accident - save his changes so that no work is lost by accident, or revert his changes, so that no damage is done by accident?
My colleague prompts me to add a third option:
- If the user selects "Save" or "Revert" explicitly, do that, otherwise give a prompt when the sidebar is closing.