August is a very special month in the Hindu calendar. People are celebrating the annual festival dedicated to the birth of the Hindu deity Krishna, the eighth avatar of Vishnu. This holiday is called Krishna Janmashtami.
Let's make a contribution to this wonderful holiday and create a congratulations card! We'll be depicting young stylized Lord Krishna in a trendy flat style, using basic geometric shapes and modifying them with the help of Live Corners, the Pathfinder panel, and other handy tools of Adobe Illustrator.
Even if you have nothing to do with this holiday, don’t pass it by—try it! By the end of this tutorial you will not only learn to work with basic shapes, but you will also be able to create any kind of flat human character, applying the techniques that we’ve discovered! Go check out these lovely Krishna illustrations on Envato Market, get inspired, and let’s start right away—this is going to be fun!
1. Create the Head
We’ll start by making a New Document of 450 x 450 px, working on a square Artboard.
Arm yourself with the Rectangle Tool (M) and let’s start forming the head from a 60 x 65 px rectangle. Fill the shape with a gentle blue color.
Select the top left anchor point with the Direct Selection Tool (A) and hit Enter to open the Move window. Set the Horizontal position to 5 px, moving the point to the right. Repeat the same for the opposite point, setting the Horizontal value to -5 px, and moving the point to the left.
Keeping the shape selected, go to Object > Path > Add Anchor Points, adding an extra point to each side of the rectangle.
Select the bottom left and right anchor points with the Direct Selection Tool (A) and use the Move function to move the point 10 px up. This way we block out the face, forming a chin.
Use the Direct Selection Tool (A) and the Live Corners feature to make the selected points rounded. You can either set the desired Corner Radius value in the control panel on top or just pull the circle markers up with the Direct Selection Tool (A).
Now we’ll form a simple nose. Take the Ellipse Tool (L), hold down Shift, and make an even circle of 10 x 10 px size, filling it with blue color, slightly darker than the face.
Select the top anchor point, head to the control panel on top, and Convert selected anchor point to corner. Drag the point up, making a drop-like shape.
Next we’re going to form the eyes. Make a 10 x 10 px circle with dark-blue Stroke. Head to the Stroke panel and set the Weight to 1.5 pt, and set Cap and Corner to the middle positions.
Grab the Scissors Tool (C) and click the side anchor points to split the shape apart. Delete the top half the circle, forming a closed eyelid.
Place the nose and the eye on the face. Hold Alt-Shift and drag the eye shape to the right to form a second eye. And let’s use the same shape and squash it a bit to make a smiling mouth.
Use the Rounded Rectangle Tool to make a rounded shape of 10 x 20 px size for the ear. Remember that you can adjust the Corner Radius in the control panel on top. Send the ear to Back (Shift-Control-[) and attach it to the head. Don’t forget to make a copy for the second ear.
Let’s create the curly hairdo. Use the Ellipse Tool (L) to make a 26 x 31 px shape in the middle of the forehead. Add two smaller ellipses on both sides of it. Continue adding ellipses moving along the left side of the face, placing them beneath the head (Shift-Control-[).
Select the circles and double-click the Reflect Tool (O). Select the Vertical Axis and click the Copy button, creating a mirrored copy for the opposite side of the head. Switch the color of all the shapes to dark brown.
Let’s decorate the head with a golden accessory. Use the Rectangle Tool (M) to make a row of rectangles. In order to make the shapes stick to each other, go to the Align panel, select Align to Key Object and use the Horizontal Distribute Space function with 0 px value. That means that there will be no gap between the objects.
Select all the top anchor points with the Direct Selection Tool (A) and use the Live Corners feature to make them rounded. Fill the elements with bright-yellow color and finish up by adding red rounded rectangles on top to make the crown look more detailed.
Let’s make the hair above the forehead a bit more detailed as well. Copy the middle circle and Paste in Front (Control-C > Control-F). Make it smaller while holding Alt-Shift. Set the Fill color to none and the Stroke color to light brown with 1 pt Weight.
Add more circles of the same type, making the hair look curly.
Let’s create a peacock’s feather to decorate the head. Copy the nose and scale it up to about 25 x 35 px. Fill the shape with green color. Copy the shape and Paste in Front (Control-C > Control-F). Make the copy a bit smaller and fill it with orange color. Make two more smaller copies inside, changing the colors to sky blue and dark blue.
Attach the feather to the head, rotating it 45 degrees and placing it beneath the crown (Control-[).
Finish up with the head by adding a golden decorative element above the forehead, using the Rounded Rectangle Tool.
And that’s it for the head! Now we can move on to the body!
2. Render the Body
Let’s start forming the body from a 70 x 80 px rectangle. Connect the body and the head with a smaller, darker rectangle, depicting a neck.
Select both top anchor points of the body shape and use the Live Corners feature to make rounded shoulders, setting the Corner Radius to 30 px in the control panel on top.
Make a couple of rectangles of the same width as the body shape (that is 70 px) and place them at the bottom of the body. You can Align both shapes to the center, using the Align panel. Just select the body together with the stripes and click the body once again to make it a Key Object. Use Horizontal Align Center and you’re done!
Let’s add some neck accessories here. Make a 35 x 30 px yellow rectangle and place a smaller one on top of it, as shown in the picture below. Select both shapes and use the Minus Front function of Pathfinder to cut out the inner shape.
Use the Live Corners feature to make the bottom part of the necklace rounded.
Now let’s get rid of the unneeded part. Select both the body shape and the accessory, take the Shape Builder Tool (Shift-M), hold Alt and click to delete the top piece.
Add minor details to the accessories and to the body.
Now let’s create the stylized legs!
Use the Rectangle Tool (M) to make two narrow yellow shapes of 90 x 12 px and 72 x 12 px. Place them one above the other, as shown below, and connect them with a vertical shape of 12 px width. Use the vertical shape as a Key Object to align the horizontal shapes to the left side of the Key Object, as well as to the top and bottom sides.
Unite all three shapes in the Pathfinder, and delete any unneeded anchor points that may have appeared on the sides of the shape after uniting. Make the left side of the shape rounded, using the Live Corners feature, forming a bent ankle.
Now we’re going to add a foot. Use the Rectangle Tool (M) to make a group of shapes of the same blue color as the body. Make a bigger rectangle for the foot and three smaller rectangles for the stylized cartoon toes. Select the top right anchor point of the foot shape and make the corner smooth and rounded, forming the heel. Make the tips of the toes rounded as well and stick the shapes to each other.
Finish up with the leg by connecting the foot and the leg using a small blue shape for the ankle. Add narrow orange and red shapes to the leg, forming the decorative elements of the pants.
Group (Control-G) all the elements of the leg together and attach the group to the body. Double-click the Reflect Tool (O) and create a mirrored copy for the second leg.
Now let’s create the arm, using a similar technique. Make a narrow 10 x 40 px blue rectangle. Copy it twice, rotate the copies, and place them as shown in the screenshot below, varying the sizes a bit. The Align panel will help you to Align all the shapes to the bottom.
Attach the copies to each other and Unite them in Pathfinder.
Select the two inner anchor points and pull the Live Corners marker to make the inner part of the arm rounded. Do the same for the bottom points on the outer side of the shape, forming a stylized bent elbow.
Now let’s form the hand, with cartoon fingers in the mudra position. Start by making a 23 x 23 px even circle of blue color. And make another smaller circle on top. Select both shapes and use the Minus Front function to cut out the inner part.
Let’s create the fingers. Use the Line Segment Tool (\) and hold Shift to make a vertical line across the ring. Align the line to the Horizontal Center of the ring, using it as a Key Object. Keeping both shapes selected, Divide them, splitting the ring apart.
Now we can use the Live Corners to make the tips of the shape rounded by pulling away the circle markers, indicated in the image below.
Create three more fingers from the rounded rectangles. Attach the arm to the body and make a second one, using the Reflect Tool (O).
If you wish to add more details, feel free to decorate the arms with bracelets, using the Rectangle Tool (M) to make the stripes and the Shape Builder Tool (Shift-M) to delete the unneeded pieces.
Well done—our Krishna character is ready! Group (Control-G) all the elements and let’s move on to the background.
3. Create a Simple Background and Add Text to the Janmashtami Postcard
First of all, let’s make a 450 x 450 px square of peach color. Send it to Back (Shift-Control-[), beneath the character. Duplicate (Control-C > Control-F) the square and squash it, making a narrower shape in the bottom of the Artboard. Fill the shape with light-yellow color.
Use the Ellipse Tool (L) to make a group of circles of the same light-yellow color, varying their sizes and thus forming a fluffy cloud.
Add a few squashed darker ellipses above the cloud, forming a shadow from Krishna, making him float in the air.
Add another set of circles for the second cloud, making it darker and placing it between the background and the first cloud.
Finish up with the clouds by adding a third row of circles, making the composition look balanced.
We have a blank space in the bottom of our card. Let’s use it to add a congratulation message!
I’m using the Sophia free script to make our text look playful and hand-written. We can add a smaller context line below, using any straight sans-serif font from our collection.
When you're happy with the result, go to File > Save for Web and set a desired size of the Artboard. This will allow you to export your postcard in raster format without the unneeded pieces outside the Artboard.
Congratulations! Our Krishna Janmashtami Card Is Finished!
Great job! We’ve successfully finished this tutorial and the ended up with a lovely congratulation card that we can send to our nearest and dearest if they are celebrating too!
The techniques described in this tutorial are very flexible and useful. I hope they will help you to create more flat characters of different types! Play with the colors, and change the position of the body parts, the hairdo, clothes, and accessories. In this way, you can make as many new unique characters as you can probably think of. Have fun!