UI Patterns are reusable user interface solutions to common problems. This section contains best practices for search boxes, accordions, buttons, and links.
When implementing different UI patterns, consider its possible states such as:
- Empty. How does it look like for a first time user who has not added any data yet?
- None. How does it look like for recurring users who has deleted or finished all the items?
- Loading. There would be times wherein users may have slow internet connection, or a slow device.
How would it show that it is being processed?
- One (or very few data), some, and many. How does it look like if there’s too much information?
One example is a thumbnail title that have way too many characters.
- Invalid, valid, done/success
- Hover, focus, and disabled
For patterns that are not included in this site yet, refer to W3C’s Authoring Practices for Design Patterns for more guidelines.