function setup() {
// I'm setting up my canvas. 400x400 feels like a good space to build in.
createCanvas(400, 400);
// I picked a light gray background because it makes the white snow stand out.
background(220);
// I don't want any black outlines around my shapes — it looks cleaner without.
noStroke();
}
function draw() {
// I’m redrawing the background every frame so that the snowman doesn’t smear when/if it moves.
background(220);
// I’m starting with the snowman’s body — bottom to top feels the most logical.
fill(255); // White for the snow
// Bottom circle – this is the base of the snowman. I’m keeping it centered.
ellipse(200, 300, 100, 100);
// Middle circle – a little smaller and placed above the bottom one.
ellipse(200, 220, 75, 75);
// Head – smallest circle on top. This one felt a bit tricky to size at first.
ellipse(200, 160, 50, 50);
// Now I’m adding the eyes. I want them to look evenly spaced.
fill(0); // Black
// Left eye – slightly to the left of center
ellipse(190, 150, 5, 5);
// Right eye – slightly to the right
ellipse(210, 150, 5, 5);
// Nose time! I’m making a little triangle for the carrot nose.
fill(255, 102, 0); // Orange
// I didn’t get this triangle right the first time — had to play with the points.
triangle(200, 155, 200, 160, 220, 157);
// Adding buttons now to break up all that blank white space.
fill(50); // Dark gray
ellipse(200, 210, 5, 5); // Upper button
ellipse(200, 230, 5, 5); // Lower button
// Finishing it off with a little hat — this part was fun to visualize.
fill(0); // Black hat
// Brim of the hat – wide and short
rect(185, 135, 30, 10);
// Top of the hat – a little box on top
rect(190, 110, 20, 25);
}
Clean Up my code
function setup() {
createCanvas(400, 400); // Set canvas size
background(220); // Light gray background
noStroke(); // No outlines on shapes
}
function draw() {
background(220);
// Snowman body
fill(255); // White color
ellipse(200, 300, 100, 100); // Bottom circle
ellipse(200, 220, 75, 75); // Middle circle
ellipse(200, 160, 50, 50); // Head
// Eyes
fill(0); // Black color
ellipse(190, 150, 5, 5); // Left eye
ellipse(210, 150, 5, 5); // Right eye
// Carrot nose
fill(255, 102, 0); // Orange
triangle(200, 155, 200, 160, 220, 157);
// Buttons
fill(50);
ellipse(200, 210, 5, 5); // Upper button
ellipse(200, 230, 5, 5); // Lower button
// Hat
fill(0);
rect(185, 135, 30, 10); // Hat brim
rect(190, 110, 20, 25); // Hat top
}