Motion

Productive motion

Productive motion creates a sense of efficiency and responsiveness, while remain subtle and out of the way. Productive motion is appropriate for moments when the user needs to focus on completing tasks. Microinteractions such as button states, dropdowns, revealing additional information, or rendering data tables and visualizations.

Expressive motion

Expressive motion delivers enthusiastic, vibrant, and highly visible movement. Use expressive motion for significant moments such as opening a new page, clicking the primary action button, or when the movement itself conveys a meaning. System alerts and the appearance of notification boxes are great cases for expressive motion.