Easy Guide on How to Make Color Tween Animation

Lighting affects our mood and color makes an impression on our feelings. In the morning, we feel full of energy and in the evening we are more relaxed. Soft sunshine calms us. Stormy skies make us more alert and a little anxious. In animation, people use color to communicate a mood.

Here are examples of how color changes the mood of Animatron Hero. In each picture, Our Hero is exactly the same, but colored differently:

Sad Animatron Hero:

and happy Animatron Hero:

Every single detail of Our Hero and the landscape behind him is exactly the same in both pictures – only the colors have changed, but the mood feels entirely different.

To make this change happen gradually, we need to use color tween. Here is how we do it in four easy steps, using the Background color as an example:

  • Make sure you are in the Animation mode. Select the object that you want to change. If the color tween starts at 0 seconds, there is already a keyframe at the beginning; just place a play head at the time when you want the color tween to end:
  • Click on the Fill field in Object inspector:
  • Select the new color, or, in this case, the new gradient:
  • The new color is in place!

Here is how the color tween appears on the timeline:

And here is how the color tweens look on the other layers (which have been expanded in this screen shot to show all of the tweens):

And here is the animation itself:

Good luck! and Have Fun Working in Animatron!