Blog
Hi, I created this Augmented Reality tutorial in support of Black Lives Matter.
If you like my tutorials, I invite you to donate to this historic movement via my donation page here: https://secure.actblue.com/donate/uxm-blm. I will match your donation up to $1,000.
If you donate $250, I will...
How to jelly your stroke in After Effects
…….
In this tutorial,I show you step by step how to jelly your stroke in After Effects.
This tutorial is an improvement over a previous tutorial wherein I show you how to quickly and awesomely create the ‘jelly’ UI effect, where...
How to jelly your stroke in After Effects (more awesome)
…….
In this tutorial, I show you step by step how to jelly your stroke in After Effects.
This tutorial is an improvement over a previous tutorial wherein I show you how to quickly and awesomely create the ‘jelly’...
UPDATE: this workflow can definitely get the job done. However, there is a newer more friction-free workflow that I blogged about using a free plugin called AEUX. Hence, you can now learn The absolute best way to get your Sketch file into After Effects
In this tutorial video, you are going to...
This is such a dope tutorial. You’ll learn how to animate your UI button like Colin Garven’s dope Submit button. Get stoked because you’re going to learn a really cool way to do this using After Effects shape layers.
UI animation credit: Colin...
In this video you are going to learn, “How to animate Apple TV 3D Camera in After Effects – Part 2”. This is such a fun technique and really is an opportunity to create delight. In Part 1, you learn how to set up your 3D scene. In this video (Part 2) I cover how to set up...
In this two part series, you are going to learn how to animate Apple TV focus in After Effects. This is such a fun technique and really is an opportunity to create delight. In Part 1, you learn how to set up your 3D scene. I cover mindsets and prepping tactics that you should employ when...
In this tutorial video, you are going to learn how to create parallax in After Effects. Parallax comes in many different flavors and designs and from a usability perspective can do many different things.
To begin designing and implementing user experiences that contain parallax, it’s...
Click here to download the source files and follow along
Here’s another pro UI animation tip I wanted to share with you.
The idea is this: when you go to a site like Dribbble, you can see that the first frame of the animation is used as the ‘poster’ frame.
...Table of Content
Bodymovin After Effects Guide
What are the...
There’s something inherently powerful and cool about transforming the material of UI. By allowing the user to stretch and distort the material, the experience can become much more engaging and dynamic. Of course it can be abused as well, to the point where it impacts usability, so be...
If you’ve already watched my first tutorial on UI jelly, you’ll be pleased because this one offers something a little different. There are fundamentally two different ‘UI jelly’ treatments I’ve come across.
Here are some references that illustrate what I mean...
How to curve your UI in After Effects
…….
In this tutorial, I show you step by step how to curve your UI in After Effects.
This tutorial will let you add your UI to any curved screen in After Effects.
We’ll be covering the ‘Bezier’ effect, which gives you handles...
Click here to download the source files and follow along
In this tutorial video, you are going to learn how to quickly animate a page swipe in After Effects. You will also learn some great easing numbers to create smooth gestural animations. You will also be learning critical keyboard...
Click here to download the source files and follow along
In this tutorial video, you are going to learn how to put your prototype on any device in After Effects.
This is a great way to share your work on your portfolio or in a presentation. Your design feels more real and...
Click here to download the source files and follow along
I created a quick tutorial video to show you how to quickly create an adjustment layer, 3 ways to locate an effect, and 3 ways to quickly apply the effect to the layer.
One of the things that makes the UI animation workflow unique...
Click here to download the source files and follow along
This week’s tutorial is a simple and super helpful thing to know.
Sometimes you need to take all your linked UI animation files, copy them into a single location, and have all the links update in your After Effects project file....
Click here to download the source files and follow along
This is a really cool After Effects feature. It’s so simple I hesitated sharing it with you.
However, it’s been pointed out to me that I’ve been struck with the ‘curse of knowledge’, as they say. I figured...
Click here to download the source files and follow along
UI Animation needs to be fast and clean. There’s no two ways about it. If it’s slow, it appears unresponsive, and unprofessional.
In fact, the single biggest mistake I see designers make is that their motion design is way...