Motion Principles, Motion Guidelines
Steve Haslip, Zapier team
Clear the Way
Zapier’s first motion ideal focuses on educating and onboarding users, emphasizing how automation works through active, linear, directional sequencing. It simplifies complex operations into incremental steps, using UI elements as guides.
Clear the Desk
This motion ideal illustrates the exponential benefits of automation, transforming user inputs into self-sufficient automations. By demonstrating synchronization between apps and tasks, it highlights the seamless and automated nature of Zapier’s platform, making every workday a fresh start.
Clear the Mind
Emphasizing the aspirational aspects of automation, this ideal shows how Zapier helps in decluttering tasks and notifications, focusing on the newfound time and energy people enjoy with Zapier on their team. It employs gentle animations and subdued colors to communicate the serene state of being brought about by effective automation.
Humanizing User Interface
Zapier’s motion principles also include UI elements that leverage elasticity and anticipation, creating more approachable and humanizing digital expressions. These principles extend to text animations, offset motions, and match cuts, ensuring that every element in motion feels friendly and controlled.