I have a simple interface for managing a user's account in a web app. Clicking each button in the interface performs the action immediately:
download bmml source – Wireframes created with Balsamiq Mockups
This is what it looks like when an account is disabled:
Note:
The
Sign out
button is only displayed when the account is online.I know the icons are a bit odd, but I couldn't find any suitable ones in the Balsamiq editor. I am using suitable ones in the actual application though.
Disabling an account immediately signs it out as well.
Current behaviour:
If the account is logged on:
Clicking
Disable Account
triggers a modal to confirm that we will disable and log off the account. If the user proceeds,Sign out
andDisable Account
fades out and a button calledEnable Account
fades in.Clicking the
Sign out
button display a modal to confirm that the account will be logged off and he will lose any unsaved changes. If the user proceeds, theSign out
button fades out.
If the account is not logged on (
Sign out
button is not displayed):- Clicking
Disable Account
fades out theDisable Account
button and theEnable account
button fades in, in its place.
- Clicking
Clicking the
Delete account
button pops up a modal to confirm as this is impossible to reverse. We then redirect the user back to the list of accounts.
I am considering displaying a flash message when Sign out
is clicked:
However there are some problems:
Is it necessary to display the flash message when
Disable account
orEnable account
are clicked? These 2 behaves like a toggle button and perhaps the buttons fading into one another can provide adequate feedback.The flash message fades in and pushes down the buttons (which are also fading in). There seems to be too much going on. Is there a better way to do this? Studies/testing reports that talks about when too much feedback is too much would be helpful with this situation.