How do we make immediate saving clear?
I'm currently working on a product that has an account configuration page which allows the user to create an API key and set a group of default settings for it. When developers submit a request through the API they have the option to specify an override for any of these values, but if they don't then the default is used.
To (presumptuously) make life easy on my users I'm allowing each setting to save immediately. They're all numeric fields or drop-downs, so it's pretty easy. The problem I see with this is two fold:
- Should I include a "Save" button even though the items save on-change, if so, do I put it with each element?
- How do I tell the user that the form is automatically saving changes as soon as the user makes them?
My thought to #1 is to say "Yes, dummy." and use that save button for #2. I can put a save-button next to each element (or "update", what-have-you) and swap it out for a "saving" animation progress bar or spinner. (Not sure which, but I assume the spinner would be more effective.) When the item is saved indicate a checkmark, and bring the save-button back. This also solves #2, as the save button would indicate it's saving.
However, I worry that making the "Save" / "Update" button disappear when it's saving would be detrimental to user experience. I want them to spend literally as little time as possible on this page. They should be able to come in, change the settings, and leave. I want minimal cognitive load (there are other "help" pages to give them more information), and I want them to be able to easily and clearly see the changes.
I'm up for any suggestions/ideas/answers. I can't post a direct mock for IP reasons, but I can probably contrive an example mock to demonstrate if necessary.