Overview
-
Learn how to use design patterns to create the foundational elements of your websites: navigation, buttons, forms, search boxes, and more.
Syllabus
-
Introduction
- Using design patterns
- What is a design pattern?
- Why are design patterns useful?
- Design pattern library vs. style guides
- When to break a pattern
- Anti patterns or dark patterns
- Global navigation
- Cards
- Tabs
- Side navigation
- Accordions
- Fitts's law, grouping, and cognitive load
- Text input
- Checkboxes, radio buttons, and dropdowns
- Tooltips and popovers
- Buttons
- Links and breadcrumbs
- Toggle switches
- Modals
- Feedback in UX
- System messaging
- Progress indicators
- Progress meters
- Progress indicators: Spinners
- Search input
- Autocomplete
- Search results
- Filtering
- Next Steps
