Shop Blog Templates Affiliates About Bundles Login

UI Animation Fundamentals

3 TUTORIALS | 4 HOURS | 3 BONUSES

UI Animation Fundamentals is the perfect introduction to UI Animation with Adobe After Effects. Create polished, professional animations from your design files whether they come from Photoshop, Illustrator, Sketch, or Adobe XD. No animation experience required.

$57

Add to cart View bundle discounts

About this course

 I created UI Animation Fundamentals to be the best possible intro course for designers quickly looking to get into UI animation. 

In creating this course, I took a big step back and looked at what were the critical tools and techniques that gave me the most success. This includes choreography, masking, working in longform, iteration with the anchor point tool, frame by frame analysis, and other important tools.  

In this course, you'll be learning in a UX project based environment. You'll be learning powerful workflows and ways of setting up your projects, so that you can avoid common mistakes and hit the ground running. 

In addition to the tools, I felt it was important to focus on teaching best practices used at big companies and design consultancies. 

As a bonus, I'm also including my UI Animation with After Effects Fast Start course. This course will get you up and running in under an hour and also covers asset handoff to your engineers. 

When you buy this course, you will also get an invite to the UX in Motion private Facebook group where you can meet other folks, get feedback, and get your questions answered. 

Best,
Issara Willenskomer
Founder of UX in Motion, Instructor

Watch course intro

 

★★★★★

“The UX in Motion video tutorials were key to my expertise with motion in UIs. I was able to take my expert skills in Illustrator and Photoshop to whole new level of interactivity. The tutorials do a great job of guiding you through the fundamentals of After Effects and how to realize your motion design ideas. This is one of the best investments you can make if you are interested in learning how to prototype motion and effects in user interfaces.”

– Prasant Sivadasan, Senior Program Manager at Microsoft, Seattle

★★★★★

“Iz the wizz (can I call you that? I feel like I can call you that.) This is great. Thank you. After about a half day so far, I’ve gone from being like ‘what the heck’s going on in here’ to ‘dang… I totally got this’. Thanks so much for getting me started and I’m looking forward to learning so much more with ya.”

– Zachary Gibson, Senior Designer at Google, San Francisco

Used by designers at:

Files included in the course

My goal is to make your learning experience as seamless as possible. That’s why I’ve included all the design source files, downloadable video tutorials (to sync with your devices and watch offline), as well as the After Effects project files.

Design files

Depending on the project, this could include Photoshop, Illustrator, or Sketch. You don't need to have these programs to use this training. 

Video tutorial files

HD video files for you to watch online or download and sync to watch later on your devices. 

After Effects project files

Use this file to follow along with the tutorial and even ideate your own solutions and iterations!

What you will learn in this course

Tutorial #1: Presets and timing
Duration: 1 hour

In this first lesson, you will be learning plug-and-play type animation presets, and the basics of UI animation timing. You will also be learning simple and fast ways to block out your animation. Additionally, you will learn back pocket easing and duration numbers to speed up your process, as well as how to use the layer anchor point to quickly iterate multiple motion solutions. 

Tutorial #2: Choreography
Duration: 57 minutes

In this second lesson, you will be learning how to choreograph a UI animation build. You will learn how to manage more complex projects with multiple layers, as well as analyze reference projects on a frame by frame basis, and finesse timing across multiple layers. You will also be learning how to use track mattes, an alternate way of masking content. 

Tutorial #3: Longform
Duration: 2.2 hours

In this third lesson, you will be building on the previous projects and deep diving into a more dynamic prototype. You will be learning complex parenting, layer styles, finessing timing, and pre-composing your project. You will also be mastering vector masks, and syncing multiple complex movements involving multiple properties. Additionally, you will be learning how to structure your timeline for multiple longform transitions.

Watch a sample from this course

Watch a 60 second sample from the UI Animation Fundamentals course

 

Buy your course today!

Add to cart Replay

Course includes these 3 bonuses

These additional training and resources will help you to get up and running fast, with great content and access to Q&A

UI animation with After Effects Fast Start course

New to After Effects? Get up and running in less than an hour with this 3 part Fast Start video course.

Private UX in Motion Facebook group

Get your questions answered in this exclusive group of world class designers. Post, share, and critique inspiration. Get new tips and resources. 

UI Animation After Effects keyboard shortcuts

Print out and accelerate your learning with these 23 critical keyboard shortcuts just for UI animation. PDF included with purchase of course. 

Issara Willenskomer
Instructor

Issara Willenskomer is an award-winning designer and educator. With over 15 years of interaction and motion design experience, Issara has worked with an impressive list of clients including Facebook, Microsoft, Twitter, Nordstrom, Amazon, HBO, MTV, AT&T, Motorola, T-Mobile, UNAIDS, HTC, Philips, and more. Issara has personally trained the design teams at Dropbox, Slack, Airbnb, Salesforce, Oracle, and others. Issara currently teaches motion innovation both online and in the real world.

🤝 30 day money back guarantee

If you are not 100% satisfied for any reason, I will give you a full refund. No questions asked.

Buy now

Don't own After Effects? Not a problem! Download the free 30 day demo of After Effects from the Adobe site.

Close

50% Complete

Two Step

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.