User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
I am designing an interface for sending sms messages
One side is a form to enter data, and next there is a preview of a phone
The user can select to view the platform and also to choose if to see preview of lock-screen or messages app
I am not sure how to change the view:
Any other suggestions?
2 segment bar (toggle switch) OR Segment bar and a dropdown
Let's look at the bigger picture...
Having two, mutually exclusive options which control do I use?
SELECT: Multiple options, best for over 5 options. May be mutually exclusive or multiple selection.
RADIO BUTTON: 2 - 5, mutually exclusive options.
TOGGLE SWITCH: 2, mutually exclusive, binary options.
The question posed does not have more than five options in any case, so let's compare toggles and radios.
Â
TOGGLE SWITCH
"Binary options" describe an ON or OFF state. When there is a single concept that may used or applied, or not, i.e., ON/OFF, ENABLED/DISABLED, ACTIVE/INACTIVE...
It is popular to use the toggle switch control to select between 2 mutually exclusive options but are not binary, such as ANDROID/IOS, APPROVE/REJECT...
In that case, one might use a toggle control:
However, determining the active state of the property is somewhat ambiguous—is the darker background selected, or is the lighter background select?? Adding multiple "active" cues will mitigate this problem.
Â
RADIO BUTTON
A well established convention for mutually exclusive options, whether binary or non-binary, is the radio button:
With radio buttons come decades of familiarity, and simple, clear "active" cues.
If one is concerned with radios looking "old-school" one can "modernize" them without loosing the tried and true cognitive recognition and interpretation:
...from Awesome Custom Radio Buttons
