top of page

Conditional Drawing with Functions

Lesson Overview

This course builds on the concept of the condition “if ... then ...”, prompting students to explore the graphical representations of various functions, from linear to quadratic curves. The conditional drawing serves as a paradigm for visual representations of different relationships. Through exploration, students will engage with the properties of different functions with different coefficients.

Learning Objectives

  • Build up “scan the whole stage”, and “draw when meeting certain conditions” as a drawing paradigm.

  • Explore the condition of x = 0, y = 0, x < 0, y < 0.

  • Explore the geometric expression of function: y = ax + b.

  • Free exploration of any relationship between y coordinate and x coordinate.

Task Description and Resources

Task 1: Scan and Condition

Purpose: Get students familiar with the drawing paradigm of “scan the whole stage”.

Key Concepts: conditions; repeat in repeat; coordinate system.

Suggested Steps:

  • Program a sprite to systematically move across the stage.

  • Leaving a pin at every step to cover the entire stage.

Reference Code:

Painting 1.gif

Task 2: Simple conditions with x and y coordinate

Purpose: Explore the significances of x or y = XX (constant) and inequality signs in the coordinate system.

Problem Statement: Use Scratch to draw with conditions like x = 0, y = 50, x < 10, and y > -50. Discuss the significance of these conditions in the coordinate system.

Key Concepts: Significances of x or y <, = or > constant in the coordinate system

Suggested Steps:

  • Program a sprite to systematically move across the stage (as in Task 1).

  • Use the “if … then …” structure to pin at the points where Sprite’s position satisfies certain condition.

Reference Code:

Painting 2.gif

Task 3: Relation of y and x

Purpose: Explore the covariational relationship between y and x and create figures representing such relationship.

Problem Statement: Use Scratch to draw with the conditions y = x, y=x2, etc., and elucidate why it represents a straight line. As an additional task, apply inequality signs to these conditions and interpret the outcomes.

Key Concepts: Covariational reasoning.

Suggested Steps:

  •  Program a sprite to systematically move across the stage (as in Task 1).

  • Use the “if … then …” structure with conditions being the relationship between y and x, then pin on the points that satisfy the relationship.

  • Change the operator from “=” to “<” or “>”, then run the program again.

Reference Code:

Painting 3.gif

Task 4: Distance to Two Fixed Points

Purpose: Explore how the parameters in linear function (a and b) can impact its graph, and introduce the ideas of slope and intercept.

Problem Statement:

Use Scratch to draw different conditions like y = ax and y = ax + b, varying 'a' and 'b' to see how the function's graph changes.

Suggested Steps:

  • Set up to variable a and b.

  • Follow the steps in the above tasks, and set the conditions to be “y-coordinate = a * x-coordinate + b”, and change a, b by certain values

Key Concepts: functions; slope; intercept.

Reference Code:

Painting 4.gif


This course guides students through conditional drawing to explore the relationship between y and x coordinates in linear and non-linear functions. It offers opportunities to understand coordinate geometry and examine how the change of coefficients in a function influence its graphs.


The author would like to thank Zhi Hao CUI for designing this lesson and appreciate all the anonymous teachers and students who participated in this research.

bottom of page