usability - Toggle Switch with Delayed State Change

As seen in the very popular answer:
"Should a toggle button show its current state or the state to which it will change?", we have very good guidelines for implementing toggle buttons.

Unfortunately, there appears to be an use-case that is left untouched. In machine controls applications, it is very common to do the following actions:

• Engage/Disengage


• Advance/Retract


• Open/Close

^{Note: These could have been just as easily worded as adjectives.}

This could be referring a hydraulic cylinders, valves, or doors, and often, a Human Machine Interface (HMI) will provide users the ability to toggle these states. The caveat is that these actions take time to complete, and there is a delay before the state changes.

As you can imagine, a simple toggle button:

Would suffer from the following issues in these applications:

1. An instantaneous state change would contradict the actual state since the door has not opened yet, or the hydraulic cylinder has not retracted yet.


2. A delayed state change may confuse the user since he/she may not know if the application is processing his/her request.

Effectively, the desired workflow involves the initial click/tap, a period where the state is changing, and finally an indication that the state has changed. However, a UI with two buttons and a progress bar is a bit clunky and takes up a lot of space. Or buttons with colors to indicate the state is unintuitive. Consider what a typical control panel might look like:

The picture describes a 4 step process:

1. The device is in the retracted state (indicated by green).


2. The user presses the advance button.



3. The device is changing states (indicated by yellow).


4. The device is in the advanced state (indicated by green).

How can we create a toggle switch for delayed state changes that remains compact, intuitive (or unambiguous), and exposes the 'in progress' state to the user?

Answer

I ran into the exact same problem for a project I'm working on.

My solution was to provide immediate visual feedback that the click was effective, but then indicate that it's still working.