Patterns
About patterns
Patterns are best practice solutions for how a user achieves a goal. They show reusable combinations of components and templates that address common user objectives with sequences and flows.
| Production patterns | |
|---|---|
| Common actions | Frequently used actions that appear multiple times across different components and workflows |
| Dialogs | Prompted when the system needs input from the user or to give the user urgent information concerning their current workflow |
| Disabled states | Used to completely remove the interactive function of a component |
| Empty states | How to address moments in an app where there is no data to display to the user |
| Filtering | The mechanism by which a user adds or removes data items from a displayed data set |
| Forms | A group of related input controls that allows users to provide data or configure options |
| Global header | Covers using UI Shell components for within and between product navigation; introduces techniques for achieving consistency in products |
| Loading | Used when information takes an extended amount of time to process and appear on screen |
| Login | Allows a user to gain access to an application by entering their user ID and password |
| Notifications | An important method of communicating with users and providing feedback |
| Overflow content | Text, such as a paragraph or a text string, that exceeds a desired space |
| Search | An intuitive method of discovery, offering users a way to explore a website or application using keywords |
| Text toolbar | A set of buttons and menus that allows users to edit text. |