Explore the future.
Home
More
Scratch Drawing Guide
Discover the Scratch graphic editor!
Introduction

This guide will show you how to use the graphic editor of Scratch in vector mode. It is easy, and makes drawing very simple. You can find the images of this guide in this Scratch project:

If you haven't tried Scratch yet, click here to get started.

Simple shapes

The simplest way to use the vector editor is drawing circles, rectangles, and lines. Click here to get to know these first simple shapes.

figure
Complex shapes

Once you master the simple shapes, you can start using the reshape tool to get more advanced ones. Click here to read about the reshape tool.

figure
Complex shapes

Are you a master of shapes? Time to make patterns out of them!. Click here to see how to use symmetry and repetition in your images.

figure
Getting started
Step 1

First, let us get to the graphic editor of Scratch 3. If you’re already familiar with Scratch, feel free to skip this section.

Go to the Scratch website in your favorite browser (Firefox, Chrome, Opera, Safari, Edge).

figure
Step 2

If you don’t have an account yet, create one clicking on “Join Scratch”; otherwise click on “Sign in” and enter your username and password.

figure
Step 3

Click on “Create” to start a new project.

figure
Step 4

The Scratch online editor appears. If you want to use it in your own language, click on the globe symbol at the top. Right to the globe, you can name your project:

figure
Step 5

The cat you see is called Scratchie. Click on the Costumes tab to edit her (or his?) costumes. The graphic editor appears.

figure
Step 6

The editor has two modes: pixel graphics (like Paint, Gimp, and Photoshop), and vector graphics (like InkScape and Illustrator). The vector mode is the default one; we will only use this one in this guide.

Drawing with simple shapes
Step 1

Let’s begin with dressing up Scratchie. Click the Fill tool and choose your favorite color using the three sliders.

figure
Step 2

Click the Circle tool, and draw a horizontal oval shape.

figure
Step 3

Click the Select tool (arrowhead icon), and drag the oval shape over Scratchie’s forehead.

figure figure
Step 4

Draw another, less elongated one, and drag it above the first one. Now Scratchie has a nice cap. Resize the ovals if they are too big or too small dragging them by their corners.

figure
Step 5

If you prefer hats to caps, you can click the Rectangle icon and draw two rectangles instead.

figure
Step 6

To make it fancier, you can also rotate the parts of the hat using the curved arrows underneath.

figure
Step 7

If you change your mind about a color, just click the Fill tool and repaint your shape:

figure
Step 8

Choosing the transparent option in the Fill tool’s palette you can even add glasses to Scratchie. You can also set the color and the width of the outline. Connect the lenses with straight lines after clicking the Line tool.

figure
Step 9

And so on; decorate the costume according to your own creative ideas. It is amazing how many things you can draw using just these few shapes: ovals (ellipses), rectangles, and straight lines. Create as many versions as you want.

figure figure
Step 10

Is the hair of the girl made of more complex shapes? No, it isn’t! You can see it in a version with outlines.

figure
Advanced shapes with the reshape tool
Step 1

Let’s dress up Scratchie again, but this time using more complex shapes. Just as before, you can start with an oval shape.

figure
Step 2

Now click the “Reshape” icon right to “Select”. This lets you move the four blue points on the outline, and thus reshaping the oval.

figure figure
Step 3

You can add more points by clicking on the outline. When you select a point, you can choose whether you want it curved or pointed by clicking on the icons above:

figure figure
Step 4

Keep adding points until Scratchie gets a crown.

figure
Step 5

You can add a bit of shading using the gradient options of the Fill tool.

figure
Step 6

Now let’s add a robe on Scratchie. You can start with two oval shapes, one for each side of the robe.

figure
Step 7

Reshape it until it starts looking like a robe.

figure
Step 8

Use the layering tools to move parts in the background or the foreground.

figure figure
Step 9

And so on, keep adding new elements until your character is ready.

figure
Drawing patterns: repetition and symmetry
Step 1

Sometimes you can spare a lot of work reusing your shapes. For instance, you don’t need to draw all the petals of a flower.

Draw a heart-like shape for your petal. The top needn’t be fully pointed; instead, you can just shorten the two helping lines.

figure
Step 2

Use your favorite colors to fill it with gradients, and remove the outline by setting its width to 0.

figure <
Step 3

Now select it with the Select tool, and press Ctrl + C and Ctrl + V on your keyboard (if you have a Mac, Cmd + C and Cmd + D), or click the copy and paste tools above the picture. You get a copy of the petal.

figure
Step 4

Rotate it a bit, and move near the original one.

figure
Step 5

Keep doing this, until you get a full circle.

figure
Step 6

If you want perfectly symmetric flower, you can use the Eraser tool to remove the parts of the last petals that cover the first petal. This move is not very easy though, so feel free to skip it.

figure figure
Step 7

Another circle in the middle, and the flower is ready.

figure
Step 8

Now you can select, resize, rotate, copy, and paste the whole flower. It is useful to use the Group tool here, so that the flower becomes a single object.

figure figure
Step 9

Let’s add a leaf, once again starting from an oval shape, and then using the Reshape and the Fill tool just as we did before.

figure figure figure
Step 10

Copying and pasting the leaves lets you complete the plant.

figure
Step 11

Use the Line tool to draw the stems, adding a point in the middle with the Reshape tool to make them curved.

figure figure
Step 12

Finally, you can draw a simple backdrop to finalize your sill life.

figure

It’s easy, isn’t it? :)