
Turning On/Off
Design a simple binary control for turning a setting on and off. Show the control in both states, with clear labeling so the user can tell what is enabled before they tap it. This is not a style exercise; it should read like a real product control that could be dropped into a settings screen.
Show the interaction from off to on and from on to off. Include the pressed, transitioning, and settled states so the change feels deliberate. Use motion, color, or icon change only if it helps clarify the state shift.
Keep the control usable on touch devices: visible hit area, clear contrast, and no ambiguity between the active and inactive states. If you include supporting text, make sure it updates with the state instead of repeating it blindly.
Make the interaction delightful! Adding a subtle animation when the state changes can make the experience more engaging and satisfying for the user.
Better at UI design with every challenge
Select complexity and generate challenge.
Pick a platform.
Get design challenge updates in your inbox
New prompts and challenge updates. It’s free.