Home > Tutorials > Processing > Processing Examples > Introduction to Processing for Scratch Users

# Introduction to Processing for Scratch Users

It's a fun and simple but powerful programing environment.

I would recommend starting with some basic shapes. Take a look at Daniel Shiffman's tutorial on Coordinate System and Shapes

The first thing to learn about Processing is that instructions are written. Processing does not use blocks like Scratch.

` `

A first program

Things you can do with processing that you can't do with Scratch

One thing that you can do with processing is to save your frames and then turn them into a gif usinig an online tool like .https://ezgif.com/maker

# Basic Gif

// Code to save frames for animated gif

int count = 0;
void setup() {
size(400, 400); // Canvas size 400 pixels
}

void draw() {
fill(255, 0, 0); // fill with red

if (mousePressed == true) {
ellipse(mouseX, mouseY, 10, 10);
count ++;
} else {
save("frames/frame" + count + ".png");
}
}

The second thing to learn about Processing is that shapes are drawn using a coordinate system.

Every point on the screen has an x & y coordinate with 0,0 at the Top Left corner of the screen.

Remember "Across the room and Down the stairs"

.

If we want to draw a point in the center of the screen we need to give Processing the following instructions:

1) how large the screen is

2) how large to draw the point

3) where to draw the point

in Java this translates to the following 3 lines of code

size(200, 200);        // a canvas 200 x 200 pixels large
strokeWeight(10);   // a thick pen size
point(100, 100);      // draw a point at 100 x 100
// (the center of the screen)

APA citation:
Russell, R. (2018, June 30, 08:56 am). Introduciton to Processing for Scratch Users.
Retrieved September 24, 2018, from http://www.rupert.id.au/tutorials/processing/examples/introduction/index.php

Last refreshed: September 24 2018. 05:02.33 am