4hrs

Create Realistic Renders of the Final App

Learning to create basic animations using moving parts in Adobe After Effects. This links with Adobe Illustrator which is used for creating the drawings.

Main Learning Objectives

Previewed

Site Tutorials

Previewed made it really simple to create great looking renders of the final app, and included instructions in most parts of the site.

Learning Strategy

Creating Keyframes

In Previewed, you can use either set animations, or create your own using different keyframes in a very basic editing software within the app. This was quick to understand was very similar to animating in Adobe programmes.

Importing Images

Importing images that I had created from XD. These could be placed on top of any phones or computers in the render and instantly look like it was on the phone.

Exporting

There was then a simple download button for exporting a render as an image or video.

My Learning Journey

Creating Renders

1.

Aim: Creating final renders of the app to be used in the Brochure and hero images, showing off some of the key app features.

Learning Method: On site

Goal Achieved?

Yes. The renders worked great in my brochure and final film. It created a perfect way of simplistically showcasing the final product.

Final Results

I created lots of renders, both photos and videos. They looked really good, and it helped speed up my whole workflow compared to animating this myself.

Key Insights/findings

Sometimes it's better to find software to help complete something more efficiently and to the same quality
This will be great for any future UX projects of my own

DESIGN.