Advertisement
  1. Design & Illustration
  2. Stickers
Design

How to Create a Celebration Countdown Sticker Set in Adobe Illustrator

by
Difficulty:BeginnerLength:MediumLanguages:
This post is part of a series called 10 Years of Envato Tuts+!.
10 Essential Tools & Tips All Photoshop Beginners Should Learn
10 Essential Adobe Photoshop Brushes You Should Own
Final product image
What You'll Be Creating

In today’s tutorial we’re going to learn how to create a set of messenger stickers to share on our chat apps. We will use basic Adobe Illustrator geometric shapes and tools, grasping some quick, useful tips along the way.

I have roughly sketched out the concept that we will be creating: the numbers from 10 to 1 in various balloon forms and fireworks. If you're looking to speed up your workflow or buy similar illustrations, you can always head over to GraphicRiver to buy graphics to decorate the pack.

Let’s start popping with our balloon countdown!

sketch concept celebration baloon countdown tutorial

Tutorial Assets

In order to complete this tutorial, you'll need the following:

1. How to Set Up the New Project File

Step 1

Start up Adobe Illustrator.

Let’s set up a New Document (File > New or Command-N) using the following settings:

  • Name: Celebration_Countdown
  • Width: 512 px
  • Height: 512 px
  • Units: Pixels
  • Number of Artboards: 11
  • Color Mode: RGB
  • Click Create
Create New Document Pixels RGB

2. How to Illustrate the Balloon Shapes & Numbers

Step 1

Begin by typing in the countdown numbers, 10 to 1.

Open the Character panel: Window > Type > Character (Command-T). Select the Type Tool from the Tools panel. Choose a bubble-like font; for example, I used SnigletSet the stroke color to null, with black fill color. 

From the Character panel, set the font size to 215 pt, and type onto each Artboard the corresponding countdown number, 10, 9, 8, 7, 6, 5, 4, 3, 2, 1, and leave the last artboard empty.

Sniglet font Type countdown Number characters Type Tool

Step 2

Let's begin drawing our balloon shapes.

First you need to transform all the type into objects. To do so, Select > All (Command-A), to select all the numbers. Next, Type > Create Outline, to turn the numbers into objects.

Select All Type Create Outlines

Step 3

From the Tools panel, select the Pen Tool (P), and set the stroke color to black, with no fill color. Draw in all the balloon shapes freehand except the circular ones, for which you can use the Ellipse Tool (L).

Then from each artboard select the elements, expand them gradually to fit within the artboard space, and rotate them slightly to create a floating illusion.

Pen tool Ellipse Tool Draw Balloons

Step 4

Next, take the Selection Tool (V), select all the black filled numbers, and  Shift-X as a shortcut to swap fill with stroke color.

Then select the balloon shapes and Object > Path > Offset Path. Set Offset at -13px and Joins: Round, then OK.

Object > Ungroup (Command-Shift-G), to ungroup them from one another.

Path Object Offset path SWap Shift X

Step 5

Select the Pen Tool (P), from the Tools panel, keeping the black stroke color, with no fill. Draw the inner balloon highlight and shadow areas.

Pen tool Draw highlights shadow Balloons

Step 6

We need to put in the balloon strings.

Start by opening the Brushes panel: Window > Brushes. Then from the panel menu: Open Brush Library > Show Calligraphic Brushes > Artistic > Artistic_Calligraphic library.

Choose the 10pt Calligraphic Brush, from the Artistic_Calligraphic library. Then select the Paintbrush Tool (B), with a black stroke, no fill, and draw the balloon strings for each balloon.

File > Save (Command-S).

Calligraphic Brush Paintbrush tool draw balloon strings

3. How to Color & Add Effects

Step 1

Let's color!

First, give the following colors to the inner, outer and balloon knots:

  • Pink: Inner (#FA3D9E) : Outer (#FFA1D5) : Knot (#DD1482)
  • Blue: Inner (#2B8EF9) : Outer (#5FD2FF) : Knot (#0977DB)
  • Red: Inner (#F63536) : Outer (#FF9CBB) : Knot (#E01C1D)
  • Green: Inner (#71BA0B) : Outer (#ABED27) : Knot (#5F9B00)
  • Yellow: Inner (#FFDC0D) : Outer (#FFFB73) : Knot (#FFBC00)

Make sure to change the stacking arrangement of your objects as you move along.

To Arrange top or bottom in position: Object > Arrange > Bring to Front (Shift-Command-]) or Object > Arrange > Send to Back (Shift-Command-[).

To Arrange one step front or back: Object > Arrange > Send Backward (Command-[) or Forward (Command‑]). Object > Arrange > Bring Forward.

Give the fireworks red and yellow colors.

Color Fill and Arrange Objects Front Back Shortcuts

Step 2

Next, let's add gradient color to the numbers.

Open the Gradient panel: Window > Gradient. Apply the following gradients:

  • Yellow: #FFDC0D to #FFBC00 set at -90° angle
  • Red: #F63536 to #E01C1D set at -90° angle
  • Green: #71BA0B to #5F9B00 set at -90° angle
Color Gradient panel 90 degree angle

Step 3

Next, let's add some highlights.

Open the Transparency panel: Window > Transparency. Take the Selection Tool (V) and select all the balloon highlights. Remove the black stroke color, and select Fill (X).

Then from the Transparency panel, set Blending Mode to Screen. On the Gradient panel, choose a white fill for the left gradient slider, and set an Opacity of 80%, fixed at a -45° angle.

Afterwards, choose a white fill on the right gradient slider, and set its Opacity to 0%.

gradient opacity screen transparency panel highlight 45 angle

Step 4

Then move on to placing the shadow gradients.

Start with the shadow area of the pink: Take the Selection Tool (V) and select all the balloon shadow areas. Remove the black stroke color, and select Fill (X). Choose Blending Mode: Multiply, from the Transparency panel.

Then on the Gradient panel, choose a dark pink color fill on the left gradient slider, and set Opacity: 80%, at a 120° angle. On the right gradient slider, keep it white and set Opacity at 8%.

color gradient mulitply transparency opacity angle shadows

Repeat the same steps for the other shadows, except match the dark color gradient slider with the respective colors, so dark red slider with red, dark green on green balloons, etc.

color gradient mulitply transparency opacity angle shadows

Step 5

After, with the Selection Tool (V), select each balloon string and give it a stroke color of your choice. Make sure all are sent back: Object > Arrange > Send to Back (Shift-Command-[).

apply color stroke strings balloon

Step 6

Let's add some shine.

From the Tools panel, under the Paintbrush Tool (B) dropdown, select the Blob Brush Tool (Shift-B). Select a white fill.

Then choose a Blob Brush Tool size by holding the left square bracket key ([) to decrease and the right square bracket (]) to enlarge the brush size, to draw some shine blobs on the balloons.

Paintbrush Tool Blob Brush Shift B Highlights

Step 7

Afterwards, add highlights to the numbers.

Use the Blob Brush Tool (Shift-B), but instead of a white fill use light color tones, and apply Screen: Blending Mode from the Transparency panel.

Blob Brush tool Transparency Screen Blending Mode Highlights

Step 8

Let's draw some confetti!

Draw the confetti using the Paintbrush Tool (B). Use the 5pt Oval brush from the Artistic_Calligraphic library and use a 2-3pt Stroke Weight.

Try drawing confetti swirls with different colors and stroke weights.

Paint Brush Tool Artistic Calligraphic Brush Stroke

Step 9

Add more confetti using the Ellipse Tool (L), Star Tool and Rectangle Tool (M), and use different colors and shape sizes. Note: Don't draw tiny elements.

Then Arrange to the front or back: Object > Arrange > Bring to Front (Shift-Command-]) or Object > Arrange > Send to Back (Shift-Command-[).

Looking colorful!

USe ellipse Star Rectangle tool Arrange Front Back Color

Step 10

Next, we need the numbers to pop out a bit.

Use the Selection Tool (V) to select the numbers inside the balloons: 10, 9, 7, 5, 4, 3, and 1. Duplicate the selection by Shift-Option-Dragging slightly lower.

Give the selection a yellowish gold color #CCB842. Then set the Blending mode to Multiply, from the Transparency panel.

You will need to Arrange one step back: Object > Arrange > Send Backward (Command-[.

Selection Duplicate Blending Mode Multiply Arrange Balloons

Step 11

Finally, use the Selection Tool (V) to Group (Command-G) each balloon with its respective parts, center it on the artboard, scale it, and modify anything you find misfitting.

File > Save (Command-S).

Group Selection Center Artboard Modify Balloons

4. How to Export & Share

Step 1

Once you've finalized the artwork, you need to Export your files.

File > Export > Export As, and select a location for the file. Make sure to choose a PNG format, and select Use Artboards to Export.

Set the PNG Options settings:

  • Resolution: Screen (72 ppi)
  • Background Color: Transparent
  • OK
PNG Options Export transparent background files

Step 2

Now that you have created your sticker set, it's time to upload it.

Head over to Sticker Market, and Register yourself a Creators Account, and wait to get verified. This is a relatively quick process, compared to other sites. Once you are verified, fill in your details.

Follow the sticker upload GuidelinesUpload the set, fill in the description, price and tags, and Save.

StickerMarket Misschatz Creator Upload Set Celebration Stickers

Step 3

On the next page, select the type of Action and Emotion for each sticker. Fill in the details and Save for submission.

sticker market details tags sticker set save

Wait for approval, and your stickers will be ready for the public to purchase.

stickermarket celebration countdown sticker set sell

10, 9, 8, 7, 6, 5, 4, 3, 2, 1.....Congratulations!!!

Hope you had fun following this tutorial and you were able to learn some useful tips.

I would love to see what you create! Please feel free to share your sticker designs with us.

Count down, have fun, and share with your friends on chat messengers like WhatsApp, Viber, Line, iMessage and more on Android or iPhone!

Final Balloon Countdown Sticker Set Stickermarket
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.