Home
Bookmarks
Leagues
LEARN
Courses
Career Paths
Assessments
Tutorials
Arcade
Glossary
GROW
Certifications
Log in
Glossary
Log inSign up
Courses/UX Design Foundations/Elements of UI Design/
Exercise #5

Form Controls and Interactive Affordances

Forms are the primary medium of digital transactions. Choosing the correct form control is essential for preventing user error:

  • Radio Buttons: Used for mutually exclusive choices when 2 to 5 options exist. All options are visible simultaneously, enabling instant comparison.
  • Checkboxes: Used when users can select zero, one, or multiple independent options, or for binary agreements (e.g., Terms of Service).
  • Dropdown Selects: Reserved for long lists of mutually exclusive options (6+ items, such as country or time zone selection). Conceals options until clicked, reducing initial clutter.
  • Toggle Switches: Reserved for immediate, binary state changes that take effect instantly without requiring a separate 'Save' button (e.g., Airplane Mode, Dark Mode).

Topics

The Atomic Grammar of UI: Line, Shape, Form, and Mass
Macro-Whitespace vs. Micro-Whitespace as Active Forces
Optical Weight, Visual Dominance, and Contrast Ratios
Evolution of Surface Styling: Skeuomorphism to Modern Depth
Form Controls and Interactive Affordances
Card Systems, Containers, and Surface Elevation Hierarchy
design
UX Design

From lesson

5

Elements of UI Design

Level 2 · Elements of Design I

Top contributors

Community contribution details will appear here once real learner activity is available.

Share