Material Design Interactions: Live Principle Demo
summary
Shows three concrete demos: a looping loading spinner rebuilt with masks, timing curves and a custom auto transition loop; a parallax calendar using imported Sketch layers and Principle drivers to sync Y position and opacity; and a drag‑to‑confirm transfer that maps drag X to target scale and text opacity and triggers the spinner on release. Mentions Mac‑only Principle, clip sublayers, export to GIF/movie, and a 14‑day trial; reproduces exact steps and timing values for handoff.
AI-written summary · about
chapters (20)
- 0:00Start
- 0:53The Basics
- 1:53Free Trial
- 2:52Easing
- 5:59Clip Sub Layers
- 7:06Event Transitions
- 8:57Ease Out Transition
- 9:49Auto Transitions
- 10:23Parallax Scroll
- 10:48Google Calendar App
- 11:14Live Demo
- 12:48Resize the Artboard
- 15:21Opacity
- 16:14Gestures
- 20:51Set the Release Property of the Drag
- 21:01Drag End Transition
- 21:45Loading Animation
- 25:27Auto Transition
- 26:28Learn More about Principle
- 26:53Contact Info
