The Art of Frame by Frame Animation

game character animation, animation, motion graphics, fruit game, gbasgbos, match 3 fruit game, adobe after effects 

The Art of Frame by Frame Animation

The Art of Frame by Frame Animation 600 338 Parini Vyas

When I hear the word Animation, first thing that comes to my mind is keyframes. . The mastery to animation is figuring out the keyframes and the in betweens. . So while today we have a lots of references available online to follow in order to get that animation correct, i still prefer the traditional way of acting out the animations, especially expressions. . Lots of animators still act out and then create their animations. 

With the technology advancing each and every day , there’s a lot that can be done to make the animation flow easier. . Nowadays you have Motion capture, Adobe Animate, and so on..

If you still love the traditional style of animation, where you animate and keyframe each and every frame and make it your style.  Be it 2d or 3d, Adobe After Effects or Blender, Spline or Maya.  The actual fun is getting and doing  things your way & the joy of the end-result is deeply satisfying . Its difficult to cover 2d and 3d Animation both in one blog. So instead we will be focusing on 2d animation today..

character animation, sprite animation, game, game animation, endless runner game, web game

2d animation as simple as it seems is used widely in different areas, There’s Typography,  Character Animations, Sprite sheet animation, Prop animations, etc and is spread in areas like E-learning, Games, Applications,  Product Videos, Motion Graphics, UI UX, Explainer Videos, etc

Looking at the points that are important in making an impressive animation for your Videos:


Character Animation

While making your Character come to life, you have to think about lots of things. Starting from the characters  if its male or female, kid or an adult, or even a human, an animal animation, lipsync, character expressions, mouth, lip sync, character design, adobe after effects, 2d animation, e-learning, kids learning, cartoon animationor a bird  if its personality is shy, bold, smart, introvert, calm, anxious, eager and so on.. Their body movements or body  language will depend on their personality. Their Persona would decide the facial expressions and their way of reacting to a situation. We also see those exaggerated animations  where we see Eyes popping, Eyebrows raising above the head, Wide smiles showing all the teeth inside that not so big  mouth. Well Wait..  There’s also another Creative way in Animation, where Characters are without eyes,nose or mouth, in such cases the  Expressions totally depend on Head Movement , nodding , and a little bit on the body movement, hand gestures. For example when  they are surprised , the Character would raise their hand and lean backwards, when in conversation they would move  back & forth and nod their head  in approval or disagreement

For Character animations, most of the Artists get reference from their surroundings, observing other people, or trying expressions or actions  in front of the mirror.

The best book to follow ”The Animator’s Survival Kit” by Richard Williams which guides you through  the basic bouncing ball animation to the technique of slowing in and slowing out  animations. From Keying to in betweens to make your animation smoother. Basic Walk cycles to exaggerated Walks and all sorts of other animations. There are also specific walks where hand swings and Weight shifts on different part of body has been given focus.

God..! I am so glad I am in this field  !!


Character Animation in a Story:


Props Animation


banking, motion graphics, animation, explainer video, character animation, props, 2d animation, social media ad, 2d ads, cartoon animation, adobe after effectsProp animations can be simple. Especially if it’s the objects in the background, like a table, lamp in the living room or a table & chair in a restaurant, by just popping/scaling some tiny objects in the Scene can be engaging for the viewer.  When it comes to Vehicles they can be given some exaggerated friction  while picking up speed or applying brakes .

Those props can also be a character riding a skateboard, holding a paper in hand  or wearing headphones. Animating those little things in the scene gives you the option of being a lot more creative with your video

Elements like Trees are animated in the Background:



Texts are an ideal way to put across your message as compared to Character or prop animations where there’s a storty to tell, Typography places the direct message in front of the viewer. With attractive colors and huge text which is easy to understand ,  eye catching fonts along with some Animations makes the Video even more attractive. Envato has amazing Typography elements for After Effects. Premiere, Final Cut Pro, Apple Motion and so on. Text animations can also be used in Titles, Openers, and End Slides

Some references:


Shapes Animation


Compositing with shapes and solid colors helps in making smooth animations. They are very pleasing to the eyes. The shapes transform into any size and any shape which actually makes the effort of seamless animation simpler.  Mostly used for creating loop animation and also quite handy in UI UX icon animations. Shapes like Arrows/Lines  are used for transition from one scene to another, Show directions for maps, graphs, etc

motion graphics, animation, after effects, social media ads, 2d ads, advertisement

This is a rather Simplified version of animating with shapes and conveying message across the audience

Shapes Animation for Transition:

Ultimately however simple animation you are thinking of doing, the secret tip is to keep your references in a layer inside the software you are working on .. to get the best timing and that exaggerated motion you are looking for.. Good luck Animating !

Do follow us on our social media


facebook :

Linkedin :