Lesson 5: Board Events

App Lab | Maker Toolkit


This lesson transitions students from consider the Circuit Playground as strictly an output device towards using it as a tool for both input and output. Starting with the hardware buttons and switch,sing the hardware buttons and switch, students learn to use onBoardEvent(), analogously to onEvent(), in order to take input from their Circuit Playgrounds.


This lesson marks the transition from using the board solely as an output device to using it for both input and output. The onBoardEvent() block works much like onEvent(), with the most significant different being that the first parameter is a board object (a variable) while onEvent() takes a UI element ID (a string).

Assessment Opportunities

  1. Attach an event handler to a hardware input

    Code Studio: See rubric on bubble 4.

  2. Choose the appropriate event for a given scenario

    Wrap Up: Students should describe different scenarios that would be more appropriate for different events.


Lesson Modifications

Warm Up (5 min)

Activity (45 min)

Wrap Up (2 min)

View on Code Studio


Students will be able to:

  • Attach an event handler to a hardware input
  • Choose the appropriate event for a given scenario

Introduced Code

Teaching Guide

Lesson Modifications

Attention, teachers! If you are teaching virtually or in a socially-distanced classroom, we have recommendations for alternate lessons that can be used for this unit on physical computing. Click Here to read our recommendations for Unit 6.

Warm Up (5 min)

Maker App Updates

For Windows & Mac users: we've recently updated the way that students can log in with Google using the Maker App. Please see this forum post for more information about these updates and how to continue using Google to log in to the Maker App.

Board Inspection: Inputs

Distribute: Pass out a board and USB cable to each pair of students. Let students know that they should not yet plug the boards in.

Prompt: Ask pairs to spend one minute looking over the board, focusing on potential input devices. Based on what you already know about this board, how do you think you might use it to get input?

Share: Have groups share back their thoughts to the whole group, keeping track of ideas on the board. Push students to support their ideas with evidence from reviewing the board, but don't worry about ensuring correctness at this point.

Activity (45 min)

Taking Input from the Board

Transition: Send students to Code Studio.

Wrap Up (2 min)

Assessment Opportunity

Students should make reasonable choices for when one board event might be better than another. You may want to have a short class discussion before or after this journal prompt to highlight the advanages and disadvantages of each event type.

Journal 3-2-1:

  1. What are three types of board events you have seen so far?
  2. Describe two different situations and how they would need two different events.
  3. What's one other event you haven't learned yet, but you think might exist?
  • Board Events
  • 2
  • 3
  • 4
  • (click tabs to see student view)
View on Code Studio

Student Instructions

Board Events

The onBoardEvent() block allows you to start taking input from your Circuit Playground. Look at the program with a partner and discuss what you think it'll do. Once you've come up with an answer, click "Run" to check your answer.

  • What will happen when you press the left button down?
View on Code Studio

Student Instructions

Using Board Events

Right now the LED turns on when the left button (buttonL) is pressed down. It should turn off when the right button (buttonR) is pressed down.


Do this

  • Add another onBoardEvent() block to turn the LED off when the right button is pressed down.
View on Code Studio

Assessment Opportunities

Key Concepts:

Develop a program that responds to a variety of hardware input.

Assessment Criteria:
Extensive Evidence

The program works as described, with the LED turning on when the user pressed the button down and turning back off when the user releases the button. There is no unnecessary code.

Convincing Evidence

The program uses an event handler to detect the button release, but it may not respond as described, or there may be unnecessary code included in the program.

Limited Evidence

The program uses a board event handler, but there are errors significant enough that the program cannot detect the button release.

No Evidence

The program does not use a board event handler.

Student Instructions

Other Board Events with the Buttons

Instead of using the right button, you can make the LED turn off when the left button comes back up.

Do this

  • Create an 'up' event for the left button.
  • Add code to turn the LED off when the button pops back up.
  • Using the Switch
  • 6
  • 7
  • 8
  • (click tabs to see student view)
View on Code Studio

Student Instructions

Using the Toggle Switch

The toggle switch can flip in one of two positions: open and close. This program uses it to make a light switch. Right now it can only turn the light on.

Do this

  • Create a new toggle switch event that is triggered when the switch is flipped to close.
  • Add code so that when the toggle switch is flipped to close the light turns off.
View on Code Studio

Student Instructions

More on the Toggle Switch

You can also check whether the toggle switch is in the open or close position anywhere in your program.

What different things does the button do when the toggle switch is open or close?

View on Code Studio

Student Instructions

State and the Toggle Switch

This program tells you whether the toggle switch is opened or closed, but it needs the toggleSwitch.isOpen block to work. toggleSwitch.isOpen is true if the switch is opened and false if the switch is closed.

Do this

  • Complete the if-statement with the toggleSwitch.isOpen property.
  • Run the program and press the left button, then flip the toggle switch and press the button again.
View on Code Studio

Student Instructions

Using the Buzzer

You can use the buzzer in a lot of different ways, but right now we're just going to use the buzzer.frequency().

Do this

  • Pull out a buzzer.frequency() block from the toolbox and play around with it. You'll notice it has two parameters, what happens when you change either, or both of those?
  • Run the program and enjoy the music of your Circuit Playground.
View on Code Studio

Student Instructions

Buzzer Duration

As you've noticed, buzzer.frequency() has two parameters: frequency and duration. Both of these take a number as input.

  • Frequency changes how the buzzer sounds. The bigger the number you give it, the higher the buzzer's sound will be.

  • Duration determines how long the buzzer is going to play a sound for in milliseconds.

For right now we're going to focus on duration, the second parameter.

Do this

Try out a few things with duration:

  • Change the duration of the buzzer to something longer than 100.
  • Try setting the duration to 0, what happens?

Run the program multiple times to see what happens before you move on.

View on Code Studio

Student Instructions

Buzzer and the Buttons

This program should use the buttons to play long and short buzzes.

Do this

  • Change the duration parameter of buzzer.frequency to make the left button play a long buzz, and the right button play a short buzz.
  • Levels
  • Extra
  • (click tabs to see student view)
View on Code Studio

Student Instructions

Challenge: Sound Board

Check with your teacher before starting the challenge.

Now that you know how to use board events, the buttons, switch, and the buzzer, try making a program that turns your board into a sound board when you press the buttons or flip the switch. Play around with the duration and frequencies of the sounds, and listen to how it turns out.

Standards Alignment

View full course alignment

CSTA K-12 Computer Science Standards (2017)

AP - Algorithms & Programming
  • 2-AP-11 - Create clearly named variables that represent different data types and perform operations on their values.
  • 2-AP-12 - Design and iteratively develop programs that combine control structures, including nested loops and compound conditionals.
  • 2-AP-13 - Decompose problems and subproblems into parts to facilitate the design, implementation, and review of programs.
  • 2-AP-16 - Incorporate existing code, media, and libraries into original programs, and give attribution.
  • 2-AP-17 - Systematically test and refine programs using a range of test cases.
  • 2-AP-19 - Document programs in order to make them easier to follow, test, and debug.
CS - Computing Systems
  • 2-CS-01 - Recommend improvements to the design of computing devices, based on an analysis of how users interact with the devices.
  • 2-CS-02 - Design projects that combine hardware and software components to collect and exchange data.
  • 2-CS-03 - Systematically identify and fix problems with computing devices and their components.