How to Convert Your Sketch Design to After Effects

By April 21, 2016 October 24th, 2018 Tutorial

In this tutorial video, you are going to learn how to convert your Sketch design to After Effects. You will also learn how to create a layered PSD with editable text from your Sketch design. This is super awesome because you will avoid needing to recreate your text.

Sketch is an amazing UI design and prototyping tool but is extremely limited in the ability to design animation and transitions. This is where After Effects comes in. After Effects is the #1 UI Animation tool of choice.

I’ve worked out a simple process of how to convert your Sketch design over to After Effects. Illustrator serves as a bridge between your Sketch design and After Effects.

The steps I will be covering include:

1. Export your file from Sketch

2. Open your file in Illustrator

3. Release all elements to layers in Illustrator

4. Clean up the file

5. Export your file to After Effects

6. As an option to have your text be live in After Effects, you will export a Photoshop file instead of saving your Illustrator file.

Tags: UX in Motion, UX, Issara Willenskomer, After Effects, Adobe, Tutorial, Help, Tips, How-to, Education, Adobe After Effects (Software), Sketch, Design, Animation, Illustrator, Workflow

Start with UI Animation Fundamentals:

Become a UI Animation pro with Rapid Prototyping with After Effects (and get 70% off):