45
Create a Set of Fun Chat Stickers in Adobe Illustrator

karakter kartun

Embed Size (px)

DESCRIPTION

kartun

Citation preview

Page 1: karakter kartun

Create a Set of Fun Chat Stickers in Adobe Illustrator

Page 2: karakter kartun

1. Creating the Basic Character Design

Step 1

For a project like this, I like to start with the face of my character. Since the majority

of the design is just a head (for the sake of this tutorial), it's the best place to begin

anyway.

1. Using the Ellipse Tool (L), draw a circle. This will form half of the head.

2. Use the Pen Tool (P) to draw the lower left half of the jaw. Note how the

jawline curves around to the chin softly, but moves upward at a right angle.

3. Here you can see the placement of the lower left jaw. I often start a jaw on the

left side of a circle, making sure it aligns with both the horizontal and vertical

centers.

4. Copy (Control-C), Paste (Control-V), and Reflect the left jaw to create the

right side.

5. After making sure each component of the head aligns as you'd like, Unite all

three shapes in the Pathfinder panel. Delete any extraneous anchor points

with the Delete Anchor Point Tool (-).

Page 3: karakter kartun

Step 2

The ear is a fairly simple process. You'll need two of these for your final design

(unless hair or additional design elements obscure them completely, in which case

feel free to skip this step).

Draw a circle with the Ellipse Tool.

Use the Direct Selection Tool (A) to pull the lower anchor point downward.

Angle the lower anchor point to the right.

Manipulate the anchor point's handles so the shape is rounded and looks

more like an ear.

Copy, Paste, and Reflect the ear so you have two. Align them on either side

of the head.

Page 4: karakter kartun
Page 5: karakter kartun

Step 3

Much like the head and ear, the eye also begins with a simple circle.

1. Draw a circle with the Ellipse Tool.

2. Use the Pen Tool to draw a sharp point at the lower left of the circle (on the

diagonal) and follow the contour of the circle to the center. Note how these

shapes look a bit like a bird's head or a raindrop shape rotated on its side.

3. Unite the two shapes in the Pathfinder panel.

4. Draw your character's lash line or eye lashes, or simply outline the eye shape,

depending on what details you'd like to add.

5. Open the Gradient panel to recreate the Linear gradient seen below: dark purple ( #2a0551 ) to white to dark purple again.

6. Apply the gradient to the white of the eyes (the raindrop-like shape).

7. Draw a smaller dark purple circle for the eye's iris and place it beneath the

lash line shapes in the Layers panel.

Page 6: karakter kartun

Step 4

Let's add in some details to each eye.

1. Group (Control-G) together your eye components.

2. With the Pen Tool, draw a half-moon shape over the top half of the eye in dark purple ( #2a0551 ).

3. Reduce the Opacity to 50% or less in the Transparency panel. Place it over

the iris and white of the eye in the Layers panel.

4. Set the iris's fill color to your eye color of choice. Draw a smaller circle in the

iris to form the eye's pupil. With the Pencil Tool draw some additional shapes

in white to create shiny highlights (circles, stars, or hearts).

5. Add additional details like little scallops (drawn with the Pen Tool or Pencil

Tool) in the outer corner or define the eyelashes.

6. Draw some cute eyebrows. I chose little hearts rather than a traditional brow

design. Once again, I used the Pencil Tool.

Repeat these steps for the other eye (or Copy, Paste, Reflect, and adjust the

position of the pupil and iris).

Page 7: karakter kartun

Step 5

For the nose, a few simple shapes defining the nostrils and shadows do the trick.

1. Start with teardrop-like shapes drawn for each nostril.

2. The sides of the nostrils, drawn with the Pen Tool, are like peach-colored ( #ff786b ) parentheses.

3. The shadow below the nose outlines both nostrils and the philtrum above the mouth. The Linear Gradient goes from a rosy peach ( #ff786b ) to light

peach ( #ffde9e ).

4. The highlight shape (a messily drawn teardrop) goes from light cream ( #fff7d4 ) to light peach ( #ffde9e ).

Page 8: karakter kartun

Step 6

Let's complete the head.

1. Set the fill color of the head to a Linear gradient that goes from  #ffae85  to #ffde9e  to  #ffbc8c . The ears are set to light peach

( #ffde9e ).

2. I added a stroke to the head shape of  #ffae85 . Group together all of the

head components. Copy and Paste the head and go

to Expand under Object. Make sure only Stroke is selected and

hit OK. Unite these copied components in thePathfinder panel. Set the fill

color to dark purple and Align it behind the original head in the Layers panel.

Set the Stroke width to 1–2 pt in the Stroke panel.

Page 9: karakter kartun

2. Drawing a Cute Hairstyle

Step 1

Now that we've got the basic head of our character done, let's create her main

hairstyle. Double-click the Blob Brush Tool (Shift-B) to bring up its options. Set

the Fidelity slider to the right (though not all the way over). As we'll simply be

sketching with it, set the size to 1 pt.

Step 2

Make sure your head components are Grouped together. This will allow you to keep

your Layers panel organized.

1. Using the Blob Brush Tool, start sketching out the character's hair. I've opted

for choppy bangs (fringe).

Page 10: karakter kartun

2. Continue drawing the hair. Think of the hair as being defined by large sections

versus strands.

3. Once you've completed the front portion of hair, Group together your

sketched components and trace the hairstyle with the Pen Tool.

4. Delete the sketch so you're left with a single object for the hair. Set the fill color to something bright and fun. I chose purple ( #6f28ba ).

Page 11: karakter kartun

Step 3

My little character has a ponytail. As such, we'll be drawing the following hair

components behind the rest of the head.

1. Start with drawing a shape that denotes the hair being pulled behind the head

into the elastic of the ponytail.

2. The shape of the hair at this point is up to you: is it straight, curly, braided, or

tied into a bun?

3. Repeat what we did previously with tracing the sketch.

4. Outline the hair components by placing stroked copies of them behind the

original shape (as we did for the head) in the Layers panel.

Page 12: karakter kartun

Step 4

Now let's render the hair.

1. Using the Pencil Tool or the Pen Tool, draw gradient filled sections of hair

that define shadows. Note how these shapes curve in such a way that mimics

the contour of the ponytail. The gradient goes from purple to dark purple.

2. Further define the shadows and sections of the hair.

3. Note how the bangs have a shadow shape for each separation and what side

they're on.

4. Play with additional shadow or highlight shapes in order to give your

character's hair some fun variations. I drew an inverted scallop shape on the

ponytail.

5. Reduce the Opacity of your shadow shapes in the Transparency panel to

your liking. Add highlights or additional colors to your main hair design if you

see fit. 

Page 13: karakter kartun

Step 5

Now let's add a cute little bow.

1. Draw a lumpy heart shape with the Pencil Tool, making sure your path is

closed.

2. Repeat on the other side. Don't forget to draw a connecting shape in the

center of the bow. Unite your bow components in the Pathfinder panel and set the fill color to something bright, like the fuchsia ( #f01e8c ) seen below.

3. Outline your bow in the same fashion as we outlined the head and hair. Use

the Blob Brush Tool in order to draw details on the bow.

4. Use the Pen Tool to add a couple of shadow shapes to the bow beneath the

details drawn previously. Set the fill color to dark purple and

its Opacity to 50%or less.

5. Group together your bow components and place the hair accessory on top of

your character's head.

Page 14: karakter kartun

Step 6

Finally, Expand (Object > Expand...) the strokes of your character so the sticker

base is forever scalable without having to change the stroke size later. We'll be using

this icon as the basis for each character sticker within the rest of this tutorial. Make

several copies of the design as it is now (six in total).

3. Current Status: Playing Games

Step 1

Now we begin the fun! Let's start with a sticker for all of those times you want

someone to know you're playing a game (or want to play a game with them!).

Page 15: karakter kartun

1. Starting with the mouth, I've used the Blob Brush Tool to draw a line curving

upward.

2. Draw another, smaller line curving downward.

3. Fill in the center of the two curving lines with dark purple and the Pen Tool.

4. Draw the bottom lip. Note how it's a bit flat on the bottom edge.5. Fill in the shape with peach ( #fe8c82 ).

6. Draw the top lip. Mine has no pronounced Cupid's Bow, though perhaps your

design has a different shape to it.7. Fill in the top lip with a bright rose color ( #ff305a ).

8. Draw in the teeth. Note how they follow the contour of the top lip and curve a

bit on the bottom.

9. Set the fill color to the same gradient as was used for the white of the eyes.

Step 2

1. The hands are cartoony and simple, consisting of only three fingers. I drew

mine with the Pencil Tool, not bothered about them being too detailed.

2. Outline the hands.

3. Draw a rounded rectangle in gray and outlined in dark purple for the game

controller.

Page 16: karakter kartun

4. Group your design together and give it a thicker overall outline in the same

manner as was done with the head and hair previously. Make sure

to Expandany strokes before creating your outline. Then draw a brightly

colored circle with the Ellipse Tool and place it behind the rest of the design.

This completes your first sticker.

4. Current Status: Watching a Movie

Step 1

Pass the popcorn! Next up is a chat sticker perfect for denoting something

entertaining or letting others know you're viewing a fantastic film.

Page 17: karakter kartun

1. Draw two rectangles over the eyes with the Rectangle Tool (M). Set the fill color of the left one to teal ( #00d1c5 ) and the right one to fuchsia

( #f01e8c ).

2. Draw two larger white rectangles behind the first two. Use the Direct

Selection Tool to pull the Live Corners inward in order to round them out a

bit. You can also adjust the corners' radii in the Transform panel.

3. Draw a thin horizontal rectangle for the bridge of the glasses.

4. Unite the white rectangles in the Pathfinder panel. Outline the glasses by

adding dark purple strokes to the white object as we outlined the head

previously in this tutorial.

5. Duplicate the white frames of the glasses, and set the fill color to dark purple

and the Opacity to 40% in the Transparency panel. Place this shadow shape

behind the glasses in the Layers panel, off to the lower right slightly.

6. Finally, draw a couple curved shapes in each lens in white with their Blend

Modeset to Overlay in the Transparency panel. Group all of your 3D

glasses components together.

Step 2

Now that she's got her 3D glasses on, our little chat sticker friend needs some

popcorn. Let's start by drawing a container for it!

Page 18: karakter kartun

1. Use the Ellipse Tool to draw a thin ellipse. Use the Rectangle Tool to draw a

rectangle the same width as the ellipse.

2. Align the ellipse to the bottom of the rectangle (I manually aligned the bottom

of the rectangle to the center of the ellipse). Unite these shapes in

the Pathfinderpanel and clean up any extraneous anchor points.

3. Using the Direct Selection Tool, angle the bottom of the object inward.

Repeat on the other side.

4. Use the Anchor Point Tool (Shift-C) to manipulate the handles of the top

edge of the object so it curves downward slightly.

5. Draw white stripes over the shape, following its contour. Group these

components together.

6. Copy and Paste two copies of the red base shape. The first copy will be set

to a linear gradient that goes from dark purple at 100% to 0% to 100% with

the opaque colors on the edges of the shape. Place this shape over the

others. The second copy's fill color is set to dark purple with a stroke of 1–2

pt and set behind the other popcorn container shapes.

7. Group together your objects and adjust the overall shape as wanted.

Page 19: karakter kartun

Step 3

The popcorn will be made into a simple custom brush. Draw a puffy popcorn shape

in light yellow with the Pencil Tool. Outline the shape and make sure

to Expand your strokes. In the Brushes panel, go to New Brush > Scatter Brush.

Set the Rotationto Random and play with its angle as much as you need. Test out

the brush with the Paintbrush Tool (B).

Page 20: karakter kartun

Step 4

1. The mouth on this sticker was created entirely with the Blob Brush Tool.

Start with two curved lines for the puffy cheeks.

2. Set the cheek outline color to peach, the lips to rosy red, and the mouth

opening to dark purple. Note the direction of each shape's curve.

3. Fill in the lips with peach and add highlight colors (light peach, cream, or

white) as you see fit.

Page 21: karakter kartun

Step 5

Let's put it all together! Use the custom popcorn brush you made to draw a couple of

squiggly lines of popcorn behind the popcorn box. Copy and Paste one of the hands

from the previous sticker design so it looks as if she's chomping on the popcorn.

When you're satisfied with the placement of the popcorn brush, Expand the brush

strokes and use the Magic Wand Tool (Y) to select the transparent boxes around

the brush components to delete them. Give the final sticker design a thick outline to

finish it.

Page 22: karakter kartun
Page 23: karakter kartun

5. Current Status: Sleeping

Step 1

For the sleeping status we begin again with the base head created earlier in this

tutorial.

1. Using the Blob Brush Tool, I sketched out the basic look of the closed eye,

which covers most of the current eye.

2. Trace the closed eye sketch with the Pen Tool on both sides. Set the fill color

to peach. Draw thin, outline-like shapes that curve over the closed eye.

3. Set these shapes to the same rosy peach as used on the nose.

4. Redraw or adjust the eyelash shapes and place the newly drawn eye

components under the hair in the Layers panel.

Page 24: karakter kartun

Step 2

1. Delete the ponytail from your design.

2. With the Pen Tool draw a top of a hat (it looks a bit like a beret at this point).

3. Behind the head, draw a cute curving shape. This forms the sleeping cap. It

looks a bit like a ponytail. If it helps, sketch it out first before drawing with

the Pen Tool.

4. Outline the top of the cap.

5. Outline the bottom of the cap.

Step 3Use the Star Tool to draw a yellow ( #ffbc04 ) star. Adjust the corner radii by pulling

in the live corners with the Direct Selection Tool. In the Pattern Options panel

create aNew Pattern, setting the H Space and V Space to 5 px, and the Tile

Type to Brick by Column.

Page 25: karakter kartun

Step 4

Copy and Paste the main sleeping cap pieces and apply the star pattern to them.

Draw a yellow circle for the pompom on the end of the sleeping cap.

Page 26: karakter kartun

Step 5

1. Draw a puffy pillow shape behind the sleeping head. Draw a simple closed

mouth with the Pen Tool.

2. Set the fill color to white and the stroke color to dark purple.

3. Draw a cute teal shape (a bit like a curving teardrop) on the right side of the

pillow. Add white or lighter teal stripes if you wish.

Page 27: karakter kartun

Step 6

Give your final sleepy sticker design a thicker outline as has been done previously.

Don't forget to Expand any strokes before doing so. Additionally, you can draw little

messages with the Blob Brush Tool or use a cute font with the Text Tool.

Page 28: karakter kartun

6. Current Status: In a Silly Mood

Step 1

Let's get weird. Copy and Paste the fuchsia bow. Reflect it over a vertical axis and

place it on the right side of the head. Copy, Paste, and Reflect the ponytail so that

the character has two pigtails. Rotate them around as you see fit.

Step 2

1. To draw smiling eyes, draw a half circle overlapping the lower half of the eye

in light peach.

2. Draw a dark purple line outlining the top half of the half circle.

3. Repeat on the other side.

Step 3

1. Use the drawing tool of your choice to draw a smiley, pointed mouth.

Page 29: karakter kartun

2. Don't forget to add an upper and lower lip. I found it easiest to do so with

the Blob Brush Tool.

3. Draw a small, three-fingered hand.

4. Make sure it overlaps the character's mouth a bit. Outline it and define the

fingers slightly with dark purple lines. Apply the same linear gradient as was

used on the head.

Step 4

1. Use the Blob Brush Tool, or a font you enjoy, to repeatedly draw lines of

letters in whatever onomatopoeia your language may use for laughter.

2. Group together your laughing letters and draw a circle overlapping them.

3. With both the group and circle selected, Make a Clipping Mask (Control-7). 

Page 30: karakter kartun

Step 5

Place the clipping mask group behind the sticker design to finish it off.

Page 31: karakter kartun

7. Current Status: Listening to Music

Step 1

Let's create a simple set of headphones by embellishing a gray half circle.

1. Draw a circle and a rectangle. Let the rectangle overlap the circle slightly and

hit Minus Front in the Pathfinder panel.

2. Overlap part of the right side of the newly cut circle with a pink rectangle.

3. Use the Shape Builder Tool (Shift-M) to select the non-intersecting

component of the rectangle. Deselect and delete it.

4. Draw several rectangles over the pink shape to create stripes.

5. Delete them from the pink shape with the Shape Builder Tool.

6. Draw a star with the Star Tool over the left half of the headphone.

7. Use the Shape Builder Tool to delete it from the half circle. Change the

stripes' colors to fuchsia and the pink shape to dark fuchsia.

8. Draw shadow and highlight shapes in a manner similar to what was done with

the hair. Use Linear gradients of dark purple and light yellow for each. Use

the Shape Builder Tool to delete extraneous portions of these shapes from

the gray half circle.

9. Give the headphone a dark purple outline and group all of the components

together.

Page 32: karakter kartun

Step 2

1. Copy and Paste the headphone group so you have one for either side of the

character's head. Place them beneath the front portion of her hair in

the Layerspanel.

2. Draw a fuchsia shape on the top of her head to denote the band of the

headphones.

3. Draw little teal music notes, hearts, and sparkles coming out of the right side

of the headphones. Use the same mouth from one of the previous chat

stickers, or draw a new one.

Page 33: karakter kartun

Step 3

Finally, give the entire design a thicker outline.

8. Current Status: Belting Out a Diva Number

Let's change up the final design by drawing a tiny, doll-like body for it.

Sketch over the design using the drawing tool of your choice. Denote the basic body

shape in a simple gesture drawing as well as any props being held. This one has a

simple wide stance with a microphone in one hand. Group together all sketch

components.

Page 34: karakter kartun

Step 2

1. Draw a gray circle over the end of the microphone.

2. Using the Blob Brush Tool, I drew the top lip, curving in a half circle.

3. Draw the bottom lip and the inside of the mouth. I also used the same closed

eye components from the sleeping chat sticker design created previously.

Page 35: karakter kartun

Step 3

The dress is a series of angles.

1. Start with the outline, drawing two peaks for the neck line, following the curve

of the hips, and connecting at an asymmetrical angle.

2. Fill in the design with fuchsia.

3. Draw two little pointed legs coming out of the bottom of the dress.

4. Keep the neck a simple rectangle while the chest, at this point, is a triangle

with a couple of curving lines denoting the character's bust.

5. You can hide the sketch in the Layers panel at this point.

Page 36: karakter kartun

Step 4

Use either the Ellipse Tool or one of the brush tools to draw a series of white dots in

varying sizes all over the dress.

Page 37: karakter kartun

1. Group the dots together and set their Blend Mode to Overlay in

theTransparency panel.

2. Layer additional dots over the others with varying Opacities and Blend

Modesso the dress looks sparkly.

3. Group together the sparkle components, Copy and Paste the dress,

and Create a Clipping Mask so the sparkles stay within the dress's

boundaries.

Advertisement

Step 5

1. Outline the dress and body. Make sure, when creating a duplicate shape for

the outline, that you've deleted the clipping mask in the copied shape.

2. Place the body beneath the head. Add tiny shoes if you wish and create a

slightly more detailed microphone in the style of your choosing.

3. For additional sparkles, draw circles with the Ellipse Tool all over the

design. Group them together and go to Effect > Transform & Distort >

Pucker & Bloat and enter -78% into the slider. Expand your sparkles. 

Page 38: karakter kartun

Fantastic Job, You're Done!

Well done you! What other activities, moods, emotions, and silliness can you create

in a chat sticker set? Kick the challenge up a notch and create a self portrait set of

chat stickers. Share your creations in the comment section below. 

For similar tutorials like this one, check out these:

How to Draw a Doll Base Body for a Dress-Up Game in Illustrator

How to Create a Beautiful Set of Zodiac Portraits in Illustrator - Part One

How to Create a Beautiful Set of Zodiac Portraits in Illustrator - Part Two

How to Create Stylish Flat Space Icons in Adobe Photoshop

Page 39: karakter kartun