The user wants to only be presented with controls available to the current mode
Information presented and actions available in a user interface element depend on its mode. When a video is paused, the play command is available, but pause is not.
Design affordance in each mode toward the most common or wanted interactions and emphasize asymmetry, incompleteness, or something being wrong to push users toward changing modes.
Be sure to keep a consistent look between each state of the control that morphs. Font and text size should stay the same, but colors may differ.
Morphing Controls work well with binary actions, such as:
This and others patterns are available and ready to use in this massive Wireframe Bundle. Suitable for a wide variety of projects: Website and landing pages, Ecommerce, Dashboard, Flowchart and iOS.
