System Status

Status indicators are typically used to communicate important information to the user, such as whether an action has been completed successfully or not.

Motion Functions

Feedback Function

Emotive Function

The primary function of a status indicator is Feedback. Users need to know whether their action has been completed successfully or not. Additionally, an error or success message can be punctuated by adding Emotive functions to drive home the action's result.

Examples

Button with success/error states by Andrei Mironov

The above example is used to give feedback to users on whether their action was successful. Feedback is provided with a change of color and warning symbol. The color change drives a strong emotional response, as red is associated with warnings and errors. The movement of the transformed button helps provide additional reinforcement to the emotional response.

Email Verification by DΞNYS SΞRGUSHKIN

Password error animation by Aaron Iker.

Similar themes can be found in the above two examples, where color change and subtle motion drive an emotional feedback response to the user.