Motion
CADS Motion is an experiment exploring how subtle micro-interactions can enhance the tactile experience of the product. It carefully applies motion to each component with careful consideration of its context and usage while defining standard motion patterns.
Recipes
Recipes are a predefined set of motion patterns based on interaction type that can be applied to components. They combine primitive variable properties like duration and easing to create a consistent and predictable motion experience.
--motion-press-scale --duration-short --easing-out
--motion-surface-from-scale --duration-medium --easing-out
--motion-spring-moderate --duration-medium --easing-emphasized
Primitives
These are the building blocks of CADS Motion. They are used to assemble the recipes above and can be used standalone to create consistent but custom motion patterns.
Hard cut / reduced-motion press
High-frequency tint (Fade, Highlight chase)
Chrome color + Press feedback
Travel + overlay enter (Surface); Indicator uses spring.moderate
In action
Interact with the components in this mini-UI to see how CADS Motion feels in context.
Intro to App Lab
Edited 2 hours ago · Period 3
Build a clicker game with buttons, variables, and a simple score display. Students share finished apps to the class gallery.
Next steps