Perfect Life

I am building one-minute animation named ‘Perfect Life’ 👌.

Inspiration for building a short animated movie came at the end of Covid Quarantine. I was about to have a milestone birthday and it dawns on me that things may go downhill health and wealth point of view. That made me wonder – where has the time gone?

So, I came up with this simple story Line – For a first-time animator, simple is better.

Putting this storyline into Miyazaki-style animation is presenting a huge challenge! My failed attempts will make a better story than actual animation, so here you go.

Attempt 1:

My first thought was to study Adobe Animator. I subscribe to overpriced Adobe Cloud and downloaded Adobe Animator. I started to make my way through the ‘Getting Started’ Tutorial to move a pencil. Adobe Animator’s first tutorial had about 14 steps – each explaining find a small square in this panel and click here. And that was just ‘hello world’.

Needless to say, I am not Miyazaki – I couldn’t get the pencil to move! This was a fail! 😖

This is too frustrating. I decided to take a break – not because I needed it – I didn’t know how to move forward. 

In my break period – I thought that I may not be a great animator or a movie maker – but I know how to get pixels painted on the web browser. I am a front end web developer so Why not use that skill set to put together a video? That is where I started working on Attempt 2.

Attempt 2:

The world of animation is loosely divided into two categories – 2D and 3D. 2D animation is old-school animation where you are drawing frames and making frames move.

Since I knew few things about SVG and ReactJS, I decided to give that a go.

When you search on Google, there are multiple animation libraries for ReactJS. The most talked about is react-spring. I spend two weekends learning about react-spring. It turns out react-spring isn’t right solution for building character animation.

ReactJS with react-spring is good for smaller animation – but for a large scale animation, this is not the right tooling.

Attempt 3:

As I was researching yet another tool – I gave ThreeJS another pass. Initially, ThreeJS seems daunting and intimidating library – Something I can’t possibly learn. But, after trying out various other options, I decided to give it a go.

Threejs!

Leave a Comment

Your email address will not be published. Required fields are marked *