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 actionsFrequently used actions that appear multiple times across different components and workflows
DialogsPrompted when the system needs input from the user or to give the user urgent information concerning their current workflow
Disabled statesUsed to completely remove the interactive function of a component
Empty statesHow to address moments in an app where there is no data to display to the user
FilteringThe mechanism by which a user adds or removes data items from a displayed data set
FormsA group of related input controls that allows users to provide data or configure options
Global headerCovers using UI Shell components for within and between product navigation; introduces techniques for achieving consistency in products
LoadingUsed when information takes an extended amount of time to process and appear on screen
LoginAllows a user to gain access to an application by entering their user ID and password
NotificationsAn important method of communicating with users and providing feedback
Overflow contentText, such as a paragraph or a text string, that exceeds a desired space
SearchAn intuitive method of discovery, offering users a way to explore a website or application using keywords