Unit 3 - INTRO TO PROGRAMMING
Lesson 18 - design a digital scene
Lesson 18 - design a digital scene
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- Write programs that address one component of a larger programming problem and integrate with other similarly designed programs.
- Collaborate to break down a complex programming problem into its component parts.
- Use code written by other programmers to complete a larger programming task.
- Write responses to AP-style prompts
Supplementary Resources
Supplementary Resources
VOCABULARY
VOCABULARY
- Abstraction - a simplified representation of something more complex. Abstractions allow you to hide details to help you manage complexity, focus on relevant concepts, and reason about problems at a higher level.
Lesson 16 - FUnctions with parameters
Lesson 16 - FUnctions with parameters
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- abstract code even further, by making it possible to “pass” values into a function from the code that calls it.
Supplementary Resources
Supplementary Resources
VOCABULARY
VOCABULARY
- Abstraction: is the process of taking away or removing characteristics from something in order to reduce it to a set of essential characteristics. Through the process of abstraction, a programmer hides all but the relevant data about an object in order to reduce complexity and increase efficiency.
Lesson 15 - collision detection
Lesson 15 - collision detection
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- detect collision between two rectangles
- see the connection that similar algorithms can be applied to 2D games
- detect collision between sprites in our game so we can trigger some actions. (removing sprites, updating score, etc.)
Supplementary Resources
Supplementary Resources
VOCABULARY
VOCABULARY
- Hitbox: An invisible shape commonly used in video games for real-time collision detection.
- It is often a rectangle (in 2D games) or cuboid (in 3D) that is attached to and follows a point on a visible object (such as a model or a sprite)
Lesson 14 - KeyIsDown Function (Keyboard Control)
Lesson 14 - KeyIsDown Function (Keyboard Control)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- navigate sprites(game characters) via keyboard keys.
- prevent sprites to move out of the canvas borders.
Supplementary Resources
Supplementary Resources
VOCABULARY
VOCABULARY
- Sprite: a computer graphic that may be moved on-screen.
Lesson 13 - Create and Display Images - Animated GIFs
Lesson 13 - Create and Display Images - Animated GIFs
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- Learn how to load and display animated GIFs in a P5.js sketch.
Supplementary Resources
Supplementary Resources
Lesson 12 - Load and Display Images - JPG & PNG
Lesson 12 - Load and Display Images - JPG & PNG
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- Learn how to load pre-existing media into P5 sketches.
Supplementary Resources
Supplementary Resources
Lesson 11 - Javascript Objects & Key Control
Lesson 11 - Javascript Objects & Key Control
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- create simple objects in our program to store and access data in a more organized way.
Supplementary Resources
Supplementary Resources
VOCABULARY
VOCABULARY
- Object: A collection of properties, and a property is an association between a name (or key) and a value. The way of storing group of data in key-value pairs.
Lesson 10 - FUNCTIONS 2 - BOUNCING BALL
Lesson 10 - FUNCTIONS 2 - BOUNCING BALL
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- understand that functions are the parts of a program which separates them out into modular pieces.
- analyze how a program produces different results based on varying circumstances via conditionals.
Supplementary Resources
Supplementary Resources
Lesson 09 - Simple Functions & Conditional Statements
Lesson 09 - Simple Functions & Conditional Statements
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- understand that functions are the parts of a program which separates them out into modular pieces.
- analyze how a program produces different results based on varying circumstances via conditionals.
Supplementary Resources
Supplementary Resources
Lesson 08 - SCALE
Lesson 08 - SCALE
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- Learn transformation techniques(scale) to change the size of what gets drawn on the canvas.
Supplementary Resources
Supplementary Resources
Lesson 07 - TRANSLATE & ROTATE
Lesson 07 - TRANSLATE & ROTATE
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- Learn transformation techniques(translate, rotation) for changing where and how shapes get drawn to the canvas.
Supplementary Resources
Supplementary Resources
Lesson 06 - VARIABLES & DATA TYPES
Lesson 06 - VARIABLES & DATA TYPES
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- declare and initialize variables that hold primitive values.
- trigger sets of instructions when keyboard and mouse is pressed.
Supplementary Resources
Supplementary Resources
VOCABULARY
VOCABULARY
- Variable: A placeholder of information that can be changed at run-time. A piece of computer memory holding some value.
- Data Type: All values in a programming language have a "type" - such as a Number, Boolean, or String - that dictates how the computer will interpret it. For example 7+5 is interpreted differently from "7"+"5"
- Boolean: A data type that has one of two possible values, intended to represent the two truth values of logic and Boolean algebra.
- Concatenation: is the operation of joining two strings together. The term"concatenation" literally means to merge two things together. name = (firstname + lastname); console.log(“Score: ”+ points);
- String: A string is a data type used in programming, such as an integer and floating point unit, but is used to represent text rather than numbers.
Lesson 05 - MOUSE INTERACTION
Lesson 05 - MOUSE INTERACTION
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- control the flow of the program by running setup() and draw() functions.
- handle program events when the mouse is moved.
Supplementary Resources
Supplementary Resources
Lesson 04 - Drawing 2D Shapes
Lesson 04 - Drawing 2D Shapes
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- Draw various 2-D primitive shapes on the canvas.
Supplementary Resources
Supplementary Resources
- Video Tutorial : Shapes & Drawing - p5.js Tutorial
- P5.js Documentation (Reference)
Lesson 03 - INTRO TO P5.JS
Lesson 03 - INTRO TO P5.JS
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- Learn each pixel of the screen is a coordinate that determines the location of a point in space.
- Create a custom canvas and draw lines and rectangles on it.
Supplementary Resources
Supplementary Resources
Lesson 02 - intro to programming languages
Lesson 02 - intro to programming languages
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- learn various creative and helpful purposes for programming.
Supplementary Resources
Supplementary Resources
- Video : The First Programming Languages: Crash Course Computer Science #11
- Video: Understand Programming Languages
- Video: p5.js Web Editor - p5.js Tutorial
VOCABULARY
VOCABULARY
- Computer Program: A list of instructions that tell a computer what to do.
- High-level language: A programming language that enables a programmer to write programs that are more or less independent of a particular type of computer. Such languages are considered high-level because they are closer to human languages and further from machine languages.
- Low-level language: used to write programs that relate to the specific architecture and hardware of a particular type of computer. They are closer to the native language of a computer (binary), making them harder for programmers to understand.
- Assembly language: A low-level programming language designed for a specific type of processor.
- Machine language: The lowest-level programming language. It is the only language a computer is capable of understanding (binary).
- Compiler: A program that processes statements written in a particular programming language (High) and turns them into machine language(Low).
Lesson 01 - ALGORITHMS
Lesson 01 - ALGORITHMS
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
LESSON MATERIALS (YOU CAN ACCESS ONLY VIA @BERGEN.ORG ACCOUNT)
Objectives
Objectives
Students will be able to:
Students will be able to:
- answer the question, "What is an algorithm?"
- explore algorithms described in English
Supplementary Resources
Supplementary Resources
- Ted-ed Video: What's an algorithm?
- Lightbot Game - Lightbot is an educational video game to command a little robot to navigate a maze and turn on lights.
VOCABULARY
VOCABULARY
- Algorithm: precise step-by-step instructions for solving a specific problem or accomplishing a specific goal.
- Pseudocode:
- An outline of a program, written in a form that can easily be converted into real programming statements.
- It uses short terms or simple English language syntax to write code for programs before it is actually converted into a specific programming language.
- Flowchart: A diagram that represents a set of instructions.
- Normally use standard symbols to show the step-by-step solution to the problem.