Switches

Switches toggle the state of a single item on or off

Motion Functions

Structural Function

Feedback Function

The function of motion in a switch is Structural and Feedback. Switches can provide the user access to other states and functions in the interface if turned on or off, enabling the user to access and control additional parts of the interface. Switches can also provide clear feedback to the user by showcasing the state that they transition to.

Examples

Checkboxswitcher by Oleg Frolov

On/Off Switch by Anton Zaderaka

UI // Toggle Switch by Cosimo Scarpa

The above examples of switches all follow similar structures. They use the principle of transformation to transform from an "OFF" state to an "ON" state. The transformation is accompanied by a change in color to indicate this state change, along with icons that indicate the state.

Segmented Control XII by Oleg Frolov

The switch above uses a text-based segmented control to control two different states. There is no on or off, but rather a toggle between the two modes. The movement of the button from each state makes the relationship between them clear and informs the user which is the active state.