AP CSP - Python with CodeX - RGB

← AP CSP: Python with CodeX
RGB Colors Lesson Plan

RGB Colors

Students learn how the NeoPixels mix red, green, and blue light, and write functions that set the pixels to colors they choose.

⏰ 45 min 🎯 Grades 9-12 💻 CodeSpace 🎮 CodeX 🐍 Python
View Lesson Outline
📋

Overview

This supplemental lesson continues Mission 3 and Defining Functions. Students learn about RGB colors and the tuples, or triplets, that represent them. They use a color picker to find RGB values, then add functions to their Pixels1_functions program to expand the light show with their own colors, including a random color. The lesson is completed in the CodeSpace sandbox and is not part of a mission.

🎯 Mission Goal: Students will learn about RGB lights in the NeoPixels and how to control the amount of each light.

🎯

Learning Targets

  • I can identify the Red, Green and Blue values of a color using color-picking software.
  • I can define a color triplet for a specific color.
  • I can define a function that sets the NeoPixels to a specific color using RGB values.
  • I can use random numbers to generate a random color.
💡

Key Concepts

  • NeoPixels are made up of 3 lights: red, green and blue. Each light has a brightness level that combines together to create color.
  • A color can be defined by its RGB values, and those values can be used in code.
  • Python includes a random library with functions that generate random numbers.
  • The randrange() function in the random library generates a random integer between 0 and one less than the range in parentheses.
✅

Assessment Opportunities

☑️

Success Criteria

  • Use RGB triplets to control LEDs
  • Use random integers in a program
  • Correctly define a function
  • Understand how and when to call a function
  • Define and call one or more functions in a program
📁

Digital Resources

🧰

Classroom Materials

  • ▸CodeX (one per student or pair)
  • ▸USB-C cable
  • ▸Computer with internet access for CodeSpace and the color picker website
🌍

Real-World Applications

🎨Most digital devices with a color screen use RGB colors.
📱Smart phones and computer monitors (LCD)
📺Television screens (modern HD and 4K televisions)
💡LED strip lighting
🎭Stage and theater lighting
📷Digital cameras and scanners
🚀

Extensions & Cross-Curricular

ExtensionChallenge 1 - Turn off pixels: the pixels stay on after the program ends. Define a function that turns them off (color = BLACK), then call it at the end of the main program.
ExtensionChallenge 2 - Random brightness: select an already-defined color function, add a variable for brightness, assign it a random number between 0 and 100, and use the variable in the pixels.set() command.
ExtensionChallenge 3 - Different pixel colors: define a function that sets all four pixels to different colors. Use the pre-defined colors, tuples, or random colors in each pixels.set() command, or any combination.
🔤

Vocabulary

▾
Tuple - A read-only list. With RGB colors, a tuple is a triplet of numbers representing the values of red, green and blue light.
🐍

New Python Code

▾
display.fill(BLACK)Clear the display.
pixels.set(0, BLACK)Clear a single pixel by displaying BLACK
from random import randrangeImport the random module
red = randrange(256) green = randrange(256) blue = randrange(256)Assign a random number between 0 and 255 for each RGB color.
color = (red, green, blue)Assign a color variable the tuple (red, green, blue)
pixels.set(0, color)Use the color variable as an argument for a pixel color.
pixels.set(0, color, brightness)Add a third argument to set the brightness, from 0 to 100.
📐

Standards

▾

CSTA Standards - Grades 9-10

3A-CS-03 3A-DA-09

CSTA Standards - Grades 11-12

3B-AP-16 3B-AP-22 3B-AP-23

AP CSP Framework - Learning Objectives

AAP-3.A - Write statements to call procedures.
AAP-3.E - Write expressions to generate possible values, and evaluate expressions to determine the possible results.

AP CSP Framework - Computational Thinking Practices

1.D - Evaluate solution options.
4.C - Identify and correct errors in algorithms and programs, including error discovery through testing.
📝
Preparing for the Lesson
  • The Activity Guide is best distributed and completed digitally, but it can also be printed. Prepare it to give through your LMS.
  • Students need software to pick a color and see its RGB values. HTML Color Codes is recommended, but any website that lets students pick a color and see the RGB values will work.
  • Decide whether students will modify their own Pixels1_functions code or start from the solution code for Pixels1_functions (from Defining Functions).
  • Have the Clearing CodeX slides ready for the end of the lesson.
  • If you have a word wall, or another form of vocabulary presentation, prepare the new term.
🧑‍🏫
Teacher Notes
  • This lesson has students modify the program they created in Defining Functions by defining more functions that use RGB triplets.
  • The lesson is completed on the computer, using the CodeSpace sandbox for programming. It is not part of a mission.
  • Students should use "Save As" with each program to keep the original code.
  • The best experience comes from students modifying their own code. To keep every student engaged, you can give them the original code to modify if needed.
  • Follow the slides for instructions and guidance. Slide 3 includes a short video on RGB colors, embedded in the slide deck. A link to the YouTube video is also in the speaker notes.
  • Solution code for the final program with functions is provided. It includes a function for each challenge as an example.
  • At the end of the lesson, discuss clearing the CodeX before turning it in. You can use the Clearing CodeX slides.
  • You can also add vocabulary to a word wall and keep a document or chart of the Python code learned during each mission.
🗺️

Lesson Outline

This outline gives the narration for one way to present the lesson.

🗣️Warm-up (5 min)

Review the last two lessons with students: Mission 3 Pixels and Defining Functions.

Then pass out the Activity Guide to students. It is best distributed and completed digitally, but it can also be printed.

🎨Learn about RGB Colors (10 min)
Teaching tip: Slides 1-4. Slide 3 has a short video from Code.org on RGB colors (watch from 0:45 to 2:35). You can show the video embedded on the slide, or use the YouTube link. If you cannot show YouTube videos in your classroom, the video can also be found on other digital platforms, or you may need to download it to show it. You can also use a different short video on RGB colors. Students fill out notes on their Activity Guide.
Teaching tip: Slides 5-7. Students take notes as needed on their Activity Guide.
💻Programming Activity (15 min)

Students work in pairs or individually at their computers.

Teaching tip: Part 1, slides 8-11. You can go over the instructions with the students, or you can use the slides. Students modify their code from Defining Functions and add another function for an RGB color. Students should use their own code. If you want to give them code to use, use the solution code for Pixels1_functions (Defining Functions). Students should run the code and make sure it is error-free before continuing. Students can take notes in their Activity Guide as needed.
Teaching tip: Part 2, slides 12-13. You can go over the instructions with the students, or you can use the slides. Students create another function for another RGB color. Little instruction is given here. Students should run the code and make sure it is error-free before continuing.
Teaching tip: Part 3, slides 14-17. You can go over the instructions with the students, or you can use the slides. Students create another function for a random color. Students must import the randrange() function from the random library. Students should run the code and make sure it is error-free before continuing.
🚀Programming Challenges (15 min)

After the programming exercises, students can try more variations to the program by completing the challenges. These are optional, so if you don't have time, that is okay. If you do have time, they give students additional experience.

Teaching tip: The challenges can be completed in any order, and they don't all have to be completed. The solution code for this activity includes a function for each challenge as an example. Each student program will be different.

✅ You decide what you want students to turn in for a grade, and how they turn it in: the Activity Guide and/or the Pixels1_RGB program. You can look at the code on student computers, or have them submit code. The Activity Guide can also be turned in.

🧑‍🤝‍🧑Wrap-Up (5 min)

Students answer two questions in their Activity Guide. You can also have a class discussion on the questions, or have students share their answers.

  • How did you use functions in this lesson?
  • What did you learn about RGB colors during this lesson?

Discuss clearing the CodeX before turning it in. You can use the Clearing CodeX slides.

Formative assessment:

  • Daily reflection journal
  • Class discussion on what they learned about functions and RGB colors
  • Activity Guide completion
  • Pixels1_RGB program
  • Exit ticket
← Back to AP CSP: Python with CodeX