🎯 Worksheet 1: Click the Circle

Your first Python game! Today we’re making a simple clicking game. In Scratch, you’d drag blocks. In Python, you’ll type the code. Same ideas, new way of writing them!

Game Screenshot

📝 IMPORTANT: Type, Don’t Copy!

Type every line of code yourself - don’t copy and paste! Making mistakes and fixing them is how you learn. Your fingers need to learn where the symbols are!

After each step:


Part 1: Make a Window

Let’s start super simple. Type this code exactly as shown:

def setup():
    size(800, 600)

def draw():
    background(173, 216, 230)

run_sketch()

Run it! You should see a light blue window appear.

What’s happening?

🔬 Experiment Time!

Before moving on, try changing:

Change it back when you’re done experimenting!

đź’ˇ Not working?

Check that:

  • You have def before each function name
  • The : colon is at the end of each def line
  • The lines inside each function are indented (use Tab or 4 spaces)
  • You spelled everything exactly right (Python is picky!)

Part 2: Add a Circle

Now let’s put a circle in our window. Add these lines to your draw() function:

def draw():
    background(173, 216, 230)

    # Draw a red circle
    fill(255, 100, 100)
    circle(400, 300, 80)

Run it! You should see a light red circle in the middle of your window.

What’s new?

🔬 Experiment Time!


Part 3: Make It Clickable

Time to detect clicks! Add this new function at the bottom (before run_sketch()):

def mouse_pressed():
    print("You clicked!")

Run it and click anywhere! Look at the console/output area - you should see “You clicked!” appear each time you click.

🔬 Experiment Time!

đź’ˇ Nothing happening when you click?

Make sure:

  • The function is called exactly mouse_pressed() with underscore
  • It’s not indented (starts at the left margin like setup() and draw())
  • You’re looking at the console/output window for the message

Part 4: Add a Score

Let’s count the clicks! Add a score variable at the very top of your program:

score = 0

def setup():
    size(800, 600)

def draw():
    background(173, 216, 230)

    # Draw a red circle
    fill(255, 100, 100)
    circle(400, 300, 80)

    # Show the score
    fill(0)  # Black text
    text_size(32)
    text(f"Score: {score}", 20, 40)

def mouse_pressed():
    global score
    score = score + 1
    print(f"Score: {score}")

run_sketch()

Run it! Click anywhere and watch the score go up!

Important: The global keyword

🔬 Experiment Time!


Part 5: Only Count Circle Clicks

Right now clicking anywhere adds to the score. Let’s fix that! We need to check if the click is inside the circle.

Update your mouse_pressed() function:

def mouse_pressed():
    global score

    # How far is the mouse from the circle center?
    distance = dist(mouse_x, mouse_y, 400, 300)

    # Is it inside the circle? (circle radius is 40)
    if distance < 40:
        score = score + 1
        print("Hit!")

Run it! Now only clicking the circle increases the score!

What’s happening?

🔬 Experiment Time!

đź’ˇ Score not going up?

The circle is at position (400, 300) with size 80, so radius is 40. Make sure your if statement checks: if distance < 40: Don’t forget the : colon at the end of the if line!


Part 6: Make the Circle Move

Let’s make it a real game! First, add the random library and circle position variables at the top:

import random

score = 0
circle_x = 400
circle_y = 300

Now update your code to use these variables:

def draw():
    background(173, 216, 230)

    # Draw circle at its position
    fill(255, 100, 100)
    circle(circle_x, circle_y, 80)

    # Show the score
    fill(0)
    text_size(32)
    text(f"Score: {score}", 20, 40)

def mouse_pressed():
    global score, circle_x, circle_y

    # Check if clicked on circle
    distance = dist(mouse_x, mouse_y, circle_x, circle_y)

    if distance < 40:
        score = score + 1
        # Move circle to random position
        circle_x = random.randint(50, 750)
        circle_y = random.randint(50, 550)

Run it! Click the circle and it jumps to a new spot!

What’s new?

🔬 Experiment Time!


🎉 Complete Game!

You’ve made your first Python game! Here’s the complete code:

import random

score = 0
circle_x = 400
circle_y = 300

def setup():
    size(800, 600)

def draw():
    background(173, 216, 230)

    # Draw circle
    fill(255, 100, 100)
    circle(circle_x, circle_y, 80)

    # Show score
    fill(0)
    text_size(32)
    text(f"Score: {score}", 20, 40)

    # Instructions
    text_size(16)
    text("Click the circle!", 20, 70)

def mouse_pressed():
    global score, circle_x, circle_y

    distance = dist(mouse_x, mouse_y, circle_x, circle_y)

    if distance < 40:
        score = score + 1
        circle_x = random.randint(50, 750)
        circle_y = random.randint(50, 550)

run_sketch()

🚀 Make It Your Own!

Try these changes - type them yourself and see what happens!

Easy Changes

Color picker tip: Use rgbcolorpicker.com to pick any color! Copy the R, G, and B values (in that order) into your fill() or background() commands.

1 - Change circle color - Make your circle any color you want using RGB values

đź’ˇ How to do it

Find the line fill(255, 100, 100) and change the three numbers.

  • Try fill(100, 255, 100) for green
  • Try fill(100, 100, 255) for blue
  • Each number goes from 0 to 255

2 - Change background color - Give your game a different background

đź’ˇ How to do it

Find background(173, 216, 230) and change the numbers.

  • background(0, 0, 0) makes it black
  • background(255, 255, 255) makes it white
  • Mix your own RGB values!

3 - Make it harder - Shrink the circle so it’s harder to click

đź’ˇ How to do it

You need to change TWO things:

  1. Find circle(circle_x, circle_y, 80) - change 80 to something smaller like 40
  2. Find if distance < 40: - change 40 to half of your new circle size

If your circle is size 30, the distance check should be 15!

4 - Change window size - Make your game area bigger or smaller

đź’ˇ How to do it

Find size(800, 600) at the beginning.

  • First number = width, second = height
  • Try size(1000, 800) for bigger
  • Try size(400, 400) for a square window

Note: If you make it smaller, adjust the random numbers too (like random.randint(50, 350) for a 400px window)

5 - Personalize the score - Add your name to the score display

đź’ˇ How to do it

Find text(f"Score: {score}", 20, 40)

Change the text inside the quotes:

  • text(f"Anna's Score: {score}", 20, 40)
  • text(f"{score} points for you!", 20, 40)
  • Be creative!

Challenges

🎮 Challenge 1: Victory Message

Show “YOU WIN!” when the player reaches 10 points.

Hint: In your draw() function, add:

if score >= 10:
    text_size(48)
    text("YOU WIN!", 300, 300)
🎮 Challenge 2: Color-Changing Circle

Make the circle change to a random color each time it’s clicked.

Steps:

  1. Add three variables at the top for colors:
circle_red = 255
circle_green = 100
circle_blue = 100
  1. Use them in your fill: fill(circle_red, circle_green, circle_blue)

  2. In mouse_pressed() when you hit the circle, randomize them:

circle_red = random.randint(0, 255)
circle_green = random.randint(0, 255)
circle_blue = random.randint(0, 255)
🎮 Challenge 3: Multiple Circles

Can you make TWO circles appear and keep track of which one you click?

This is tough! You’ll need:

  • Variables for circle2_x and circle2_y
  • Another circle() command in draw
  • Check distance to both circles in mouse_pressed()
🎮 Challenge 4: Hover Points (No Clicking!)

Make the score go up just by hovering over the circle - no clicks needed!

Hint: Instead of checking in mouse_pressed(), check the distance in draw():

def draw():
    # ... your existing draw code ...

    global score
    distance = dist(mouse_x, mouse_y, circle_x, circle_y)
    if distance < 40:
        score = score + 1
        # Move circle immediately

Warning: This will make the score go up REALLY fast (60 times per second)!


🤔 Think About It

How is this similar to Scratch? How is it different?