Talk with Culrs — Week 03

via Culrs Instagram

Rupak Mishra
Culrs Team
7 min readFeb 11, 2019

--

This week on Talk with Culrs, we have a series of animations. We are going to talk about the process of making these animations and how we chose the color palettes for each scene.

Colors can fill emotions into any image or illustrations. That’s why creative directors tend to pay a lot of attention to colors in their work, to set the right mood right for the users/audience. The same image can evoke a different emotion, just by changing up the colors. We often see in animated movies that the same setting in different situations feels different. A combination of bright yellow colors can cheer up the mood, setting up the scene for a happy morning, and a little calm orange color can set up the scene for a pleasant sunset.

There are endless ways to execute creativity. Let’s check out what we have here for you.

Trippy Leaves

What can we do with a couple of leaves? With this question in my mind, I opened my favorite tool, Adobe After Effects.

Dark Tetradic: Stock

Before starting with the animation, we wanted to set the colors right. The animation had to be mysterious and upbeat at the same time. So, we went with a dark tetradic color palette with contrasting tones. Dark blue (#02142F) was chosen for the background which would act as the mysterious night in a dark forest. The other three colors, green (#65B948), sky blue (#D5F5FF), and purple (#570F6D) were used for the leaves. These are totally opposite to each other, and yet bring out a nice contrast when used on the dark background.

This animation has two different scenes, with the same set of leaves in different positions. Let’s break it down. (Those who are familiar with this tool know the basic properties of animation, like position, scale, rotation, and opacity.)

Rotating Leaves

You can see above that the leaves are simply rotated, making them smoothly enter the scene and then move out. You can play with rotation keys in different ways, according to the type of animation you want. In the above clip, the animation looks very plain, without any perspective or depth.

Increased Scale for the Rotating Leaves

What brings life into the scene is playing with scale. As the rotation progresses, increase the scale to the point where the leaves are out of the scene. Now we get the perspective of leaves coming towards the camera.

We made another scene with the same set of principles but changed the position of leaves to make it look different from the first scene. When we put these two scenes together, we achieve our final result. But there was something missing in the animation, it looked a little flat. So for the second scene, we add a blur effect, which made the scene appear like it was far behind and out of focus. As it scales, the blur is faded out, putting the second scene in focus. Repeat these two scenes one after the other, and match them at the start and end of animation to form a perfect loop, and we are good to go.

Check out the dark tetradic color palette on our website.

Desert Shrub

Sometimes, a warm breeze is all you need. This animation was made by using the same principles as above.

Dark Analogous: Rhythm

We wanted to create a warm vibe through this animation, and so we chose the color palette consisting of warm tones like (#E85472), (#E96658), (#EB945B), (#ECC15F), and (#EEED63). For the land and the background, we used darker colors of the palette as a gradient.

The leaves were filled with all the colors in the palette to make them look bright and warm.

In the animation, you can see several layers of scenes put together to create depth for the shrubs at the front and the back. A little rotation is used to make it appear like the leaves are moving gently with the breeze. This time we used position and scale to make the scene look like it’s coming towards the camera and then moving out. Then, we matched the first screen with the last screen to create a loop.

Check out the warm analogous color palette on our website.

Fall Time

More leaves on the way! This time we wanted to do something simple yet attractive.

Light Tetradic: Lineage

This animation had to be light and pleasant. So, we went with a light tetradic color palette. Yellow (#F4FFC7) was used for the background to make the environment pleasant, and the rest of the colors purple (#576AFF), orange (#FFC688), green (#8BE6CB) were used for the leaves. And the result was beautiful. The color of the leaves created a perfect contrast on the background.

Here also, there are mainly two layers to this animation.

Layer 1

The first layer has three leaves scaled up, with an animated position, entering from the above the slowly moving out of the scene. A little scale animation is also added to get depth as leaves fly towards the camera.

Layer 2

Another layer consists of many small leaves falling down animatedly. First, we animated a few leaves with their rotation and position properties in such a way so as to make them appear as they are falling from above. Then, we used the same layer a couple of times, with changed positions. Blur effect was added on the layers below, to give depth and make it look like those leaves are falling back at a distance.

When all the leaves are put together on the background, we get our beautiful animation of falling leaves. The layers are adjusted in a way to form a loop.

Check out the light tetradic color palette on our website.

Rain and Thunder

I was wondering what should we make next when it suddenly began raining outside. And I had an idea!

Dark Analogous: Fall

This animation had to be dark and fearful, and we found the perfect color palette for it. We used the darkest shade of blue (#0F0190) for the background, with lowered brightness, to get the exact feel of the night. The remaining colors (#03796D), (#03667F), (#024484), (#011D8A) were used for the shrubs. We used white to depict the flow of wind and flashes of lightning. Once the animation was ready, it looked like a perfect rainy night. The colors were well-balanced with lighter colored leaves in the front and darker leaves at the back.

Let’s break down the different layers of this animation.

Leaves

Firstly, we animated the shrubs using rotation properties and used the puppet pin tool to move the position of leaves. The animation was made in such a way that it looked like a sudden, strong breeze of air was flowing through. I copied the same layer a couple of times to place it behind one another, with a slight change in the position. Also, as you can see in the final animation, I added an extra leaf different from others, at the corner, using the same properties. Since different weights flow differently, the heavy leaves, like the one in the corner, are animated with very less change in their positions.

Air

The next part was animating the air, which can be easily achieved by drawing lines and using trim path properties to animate it. Air is animated fast and smooth with a nice flow.

Once its done, put together all the layers along with the background. For the rain, we used the same principle as the air and played with trimming to achieve the final result. Then, we copied the layers of air and rain a couple of times and changed their positions, and reduced the opacity to get depth in the scene.

Flashes of Lightning

But there was something missing. We decided to create a lightning effect. We added a masked white layer just above the background and adjusted its opacity to make it look like lightning and it was done! We got nice heavy rain with flashes of lightning, and strong winds flowing through the shrubs.

Check out the dark analogous color palette on our website.

That’s all for Week 03! Stay tuned and we’ll be back with more exciting stuff next Monday. Subscribe to our Newsletter here if you haven’t already to get our publication right in your inbox.

--

--