You must be a Pro member to watch this episode.

Get Access Now

Sign in now if you're already Pro.

  1. 1

    Bring Your Design Into Principle

    6:57FreeDone
  2. Auto and Gesture-Based Transitions

    7:44ProsDone
  3. 3

    Building Reusable Components

    3:40ProsDone
  4. 4

    Drivers and Scrolling

    6:04ProsDone
  5. 5

    Get Your Prototype Out There

    4:14ProsDone

Auto and Gesture-Based Transitions

Published by Chris Slowik on February 19, 2017

Episode Notes

Extra tips from the author

Auto-Transitions

Animations can be triggered automatically with no user input. We'll use that to build our splash/loading screen. Auto transitions are also useful later in this episode when we use them to advance through intermediate states of a more complex transition. There are a lot of tricks you can accomplish through the use of auto transitions.

Gestures

Transitions can also be activated through gestures. Any layer or artboard can have a gesture attached to it, from touches and hovers, to drag and scroll. Using the tap gesture, we can set up a transition to open the Menu screen.

Multi-Step Interactions

Our menu opening transition is pretty tricky - multiple things animating and changing. We can simplify the process of animating this, as well as keep our start and end artboards fairly clean, through the use of auto-transitions. When creating a complex transition, it's a great idea to break it up into at least 2 parts, a start and an end.

Episode Topics: