You must be a Pro member to watch this episode.

Get Access Now

Sign in now if you're already Pro.


Learn Kite


Toggling States


Complex Animations


Screen Transitions


Screen Transitions

Published by Chris Slowik

Episode Notes

Extra tips from the author

Multiple Screens on One Canvas

At this point, you should be pretty comfortable with setting up basic animations and interactions in Kite. However, everything we've done up to this point has been focusing on interactions within one screen. Just about every app you make will have more than one screen though, and you'll need to mock up the transition.

Creating screen transitions on one canvas seems confusing, so it really helps to break up the transition into logical chunks. In this case, the nav bar is considered a separate element from the screen - much like it is in actual implementation.

Food for Thought

In this instance, we've hooked up an interaction for one conversation. However, it would be possible to load different content depending on the conversation that's clicked. How? Scripting. Kite has the ability to do just about anything with the power of javascript! Check out our Advanced Kite course for a primer on scripting, and start injecting logic and functionality into your prototypes!

Episode Topics: