- Programming content overview
- Tracking progress of programming students
- Classroom debugging guide
- Pair programming in the classroom
- Teaching guide: Intro to JS - Drawing Basics
- Teaching guide: Intro to JS - Coloring
- Teaching guide: Intro to JS - Variables
- Teaching guide: Intro to JS - Animation basics
- Teaching guide: Intro to JS - Interactive Programs
- Teaching guide: Intro to JS - Resizing with variable expressions
- Teaching guide: Intro to JS - Text and strings
- Teaching guide: Intro to JS - Functions
- Teaching guide: Intro to JS - Logic and if statements
- Teaching guide: Intro to JS - Looping
- Teaching guide: Intro to JS - Arrays
- Teaching guide: Intro to JS - Objects
- Teaching guide: Intro to JS - Object-oriented design
- Programming classroom handouts
- Additional programming projects
- Lesson plans: teaching programming in the classroom
- Programming case study: Encouraging cross-disciplinary projects
- Programming case study: Going beyond the KA curriculum
- Programming case study: Teaching an elementary school class
Teaching guide: Intro to JS - Coloring
What the student will learn
- How to use the
background()command to change the color of the entire canvas.
- How to use the
fill()command to change the color of shapes and
stroke()to change their outline.
- How to use
noStroke()to modify the stroke outline.
- A brief overview of the RGB (Red-Green-Blue) color scheme and using the color picker.
- The importance of looking up functions in the documentation to remember how to use them, especially when working on projects.
The student will be able to write code like:
Where students struggle
- Students often struggle with the order of the commands. They must always call the color-changing functions before they draw the shapes they want to be colored. Encourage them to think carefully about the order and try moving lines of code around (copy/paste) to see what happens.
- Students sometimes confuse when to use
stroke(), especially for lines - lines have no fill, so they must be colored with
Additional materials: Discussion questions
These are questions that you can ask students individually after they've done the lesson, or lead a group discussion around, if everyone's gotten to the same point.
- How often do you find yourself using the documentation? Do you scroll to it or open it in a new tab?
- Have you seen the RGB color scheme used anywhere else? Have you seen any other ways that computers describe colors? (HSB and HSV are examples)
- How do you mix colors when you’re painting? How is different from specifying a color when programming?
Additional materials: Trivia questions
These can be fun to do as a class after everyone’s gotten through the lesson. They can also lead to discussion about which questions are the hardest. Play them on Quizizz.