• Work 28: Invaders... Possibly From Space

    Due: Monday 11/25 10:00am

    Submission name: work28_invaders

    a28_invaders

    With your TablesBuddies+™

    Start with a working version of yesterday’s assignment, you can grab one from the theSource if you like. Then, write code that will create the classic movement pattern from Space Invaders. The grid of Balls should move as a unit, one ball length at a time. When the grid hits the left or right edge, it should then move down one ball length, and then reverse direction.

    • The grid should move once per second.
    • The projectile should still be able to collide and remove balls.
    • You may want to add a new class to represent the grid of balls.

    For this assignment, discuss and plan with your TableBuddies+™ before diving into coding. This is not a trivial task.


  • Work 27: Have a Blast

    Due: Thursday 11/21 10:00am

    Submission name: work27_blast

    a27_blast

    Start by grabbing the modified Ball class code from thesource. You can find it in a new directory called Classes. This is similar to the Ball class with the following changes (these are already done, you need not change them):

    • The center of the ball is now a PVector.
    • The constructor takes the center of the ball and size as arguments.

    Create a driver file with the following:

    • Global variables:
      • Ball[][] grid
      • Ball projectile
      • You make also want to include other constants as needed.
    • setup()
      • Instantiate grid to a 3 (rows) x 5 (cols) 2D array.
      • Call makeBalls()
      • Call newProjectile()
    • draw()
      • Clear the screen.
      • Call drawGrid()
      • Move and display projectile
      • Call processCollisions)()
    • keyPressed():
      • space: set the yspeed of projectile to -1
      • LEFT/RIGHT: move projectile left/right
    • void makeBalls(Ball[][] g)
      • Populates g with Ball objects. They should all be the same size, arranged such that each ball is a size distance away from its neighboring Ball objects.
    • void newProjectile(int psize)
      • Set projectile to a new Ball at the bottom center of the screen.
    • void drawGrid(Ball[][] g)
      • Draw all the Ball objects in g
    • void processCollisions(Ball p, Ball[][] g)
      • Check if p collides with any Ball objects in g.
      • If so, set the entry in the array to null, and call newProjectile

  • Work 26: What a Bunch of Characters

    Due: Wednesday 11/20 10:00am

    Submission name: work26_chargrid

    You will write a program that works with a 2d array of char values. Remember that char values can be set to characters like '!' or integers like 33. I will provide setup and draw functions below. You will write the following functions:

    void orderedChars(char[][] cd)

    • Populates cd with characters starting at ! (which has an ASCII value of 33), and going up by 1 until the end of the array has been reached.

    void drawGrid(char[][] cd)

    • Draw cd to the screen.
    • Set the textSize so that the width of the screen evenly splits up a row of characters in cd.
    • Use, LEFT, TOP as the text alignment values.
    • Sample image for an array populated by orderedChars:
    • a16_collision

    void randomLetters(char[][] cd)

    • Populate cd with random upper case letters only.

    Use the following driver code:

    int NUM_ROWS = 6;
    int NUM_COLS = 15;
    
    char[][] grid;
    
    void setup() {
      size(600, 300);
    
      grid = new char[NUM_ROWS][NUM_COLS];
      orderedChars(grid);
      drawGrid(grid);
    }//setup
    
    void draw() {
      background(0);
      drawGrid(grid);
    }//draw
    
    void keyPressed() {
      if (key == 'o') {
        orderedChars(grid);
      }
      if (key == 'r') {
        randomLetters(grid);
      }
    }//keyPressed
    

  • Lab 02: Lightning CAN Strike Twice

    Due: Wednesday 11/20 10:00am

    Read the instructions in the code and write the requested methods. A

    Reference image (the gif will not run at the same speed as your program):

    lab02_lightning

    Skills

    Skill Minimal Competency Developing Competency Competency Mastery
    5. Working with Boolean Values Understands the purpose of boolean values. Demonstrates the appropriate use of comparison operators. Demonstrates the appropriate use of comparison and boolean operators. Writes functions that take in boolean values and/or return boolean values.
    6. Working with setup and draw Can write a valid setup function that sets initial conditions for a processing program. Can write a valid setup function, and can write a valid draw function that generates different program output each frame. Can create global variables that are initialized in setup and modified in draw. Can use global variables, custom functions, and setup and draw to produce a full processing program.
    9. Writing Readable Code Uses descriptive identifiers. Uses indentation and newlines to create more readable code, and descriptive identifiers. Uses inline and block comments when appropriate. Uses indentation and newlines, and descriptive identifiers. Can take a large programming task and break it up into smaller functions.
    10. Debugging Practices Can use println statements to help debug code. Consistently uses println statements while debugging. Consistently uses println statements and commenting while debugging. Creates visual output in the program window while debugging.
    11. Conditional Statements Can use a single if statement correctly. Can use combined if and else statements correctly. Can use if, else if, and else correctly multiples times in a program. Can use multiple styles of combinations of conditional statements (i.e. nested, sequential) in a single program.
    14. Using Objects Can declare and Object variable and instantiate an Object using a constructor. Can use multiple Objects in a program by calling methods on appropriately declared and instantiated Object variables. Can use Objects in a program, describe how reference variables work, and how they are different from primitive variables. Can use Objects and accurately make heap diagrams of Object variables and data.
    15. Writing Classes Can design a class by grouping together ideas that should be encapsulated into a single class. Can separate out the fields from the methods while designing a class. Can write a class with fields, a single constructor and methods. Can write classes with fields, and overloaded methods and constructors.
    16. 1D Arrays Can declare and instantiate a primitive 1D array. Can declare, instantiate, and use primitive 1D arrays, including iterating though them with loops. Can declare, instantiate, and use primitive and object 1D arrays. Can work with 1D arrays in non-sequential ways. Undertands the concepts of deep and shallow copies of arrays.

  • Work 25: You've Been... Thunderstruck!

    Due: Friday 11/15 10:00am

    Submission name: work25_lightning

    More Lightning!

    In assgnments 7 and 8, you generated lightning bolts by creating connected lines. Today, you have many more tools at your disposal to make even better lightning bolts. Using arrays and any other relevant tools we have covered so far, write a processing program that:

    • Will draw a randomly generated lightning bolt segment-by-segment over time (use the general guidelines for the bolt segments from the previous lightning assignments.)
    • When the bolt reaches its end, the entire bolt should be visible for a short period of time (keep the framerate to 30 or 60 fps).
    • After that period, have the whole screen be white for a short, but perceptible, amount of time.
    • Draw another lightning bolt in the same manner, repeating the entire process.

    Optional Additions

    If you get the above working, try some of these:

    • Instead of having separate arrays for x and y values, try using the PVector class.
    • Draw multiple bolts at the same time.
    • Draw multiple bolts, but not necesarily at the same exact time (i.e. the second bolt starts when the first one is halfway down).
    • Allow for the lightning bolt to fork off into two (or more) bolts.

  • Work 24: Moving Conections

    Due: Thurssday 11/14 10:00am

    Submission name: work24_connect

    Improve Upon Yesterday’s Work

    You can check for a working version of yesterday’s work on thesource. Add the following event listeners:

    • mouse press: add a new point at mouseX, mouseY.
    • ' ': Add a new random point.
    • 'r': Reset the “drawing” so that no lines are drawng. You DO NOT need to modify the arrays to accomplish this task.
    • arrow keys: move all the points up, down, left or right (depending on the key pressed).
    • +: Increase the magnitude of each coordinate by 25%.
    • -: Decrease the magnitude of each coordinate by 25%.
      • Both + and - will also move the “drawing” away from or towards the origin, this is expected and acceptable.

  • Work 23: Making Conections

    Due: Wednesday 11/13 10:00am

    Submission name: work23_connect

    Global Variables:

    • int[] xvals: Array of integers representing the x-coordiantes of a series of points.
    • int[] yvals: Array of integers representing the y-coordiantes of a series of points.
    • int numPoints: Number points currently stored in xvals and yvals.

    Setup:

    You should use this code to start testing. You may play around with values later if you want.

    size(600, 400);
    background(0);
    xvals = new int[100];
    yvals = new int[100];
    numPoints = 0;
    
    makeLines(xvals, yvals, 10);
    drawLines(xvals, yvals);
    

    Methods:

    • void makeLines(int[] xs, int[] ys, int points)
      • Populate xs and ys with points values.
        • Clarification: points is the number of values to generate. i.e. if points is 5, then the first 5 elements in each array should be assigned a new value.
      • Each coordiante should be a random value that fits in the current screen.
      • If points is larger than the size of the arrays, stop before the program would crash.
    • void drawLines(int[] xs, int[] ys)
      • Loop through xs and ys, drawing lines between consecutive points.
      • i.e. The lines should connect:
        • (xs[0], ys[0]) to (xs[1], ys[1])
        • (xs[1], ys[1]) to (xs[2], ys[2])
        • (xs[2], ys[2]) to (xs[3], ys[3])
    • Using the mousePressed() event listener, mouseX, and mouseY(https://processing.org/reference/mouseY.html), enable your program to:
      • Add points to xvals and yvals when t he mouse in pressed.
      • Specifically, add (mouseX, mouseY).
      • Now, each time the mouse is pressed, a new line should be drawn (after the very first mouse event).

  • Work 11: Test Prep

    Due: Friday 09/27 10:00am

    Submission name: work22.md

    You can find all the submitted test questions here: https://github.com/nextcs-dw/thesource/tree/main/test01

    Pick 4 of the programming questions to complete. Since the functions will most likely be fully working processing programs, you should put your answers in a makrdown file. Include the question number at the top and put your answer inside a code block (check the review template for an example of a code block). You are encouraged to use processing to test your solutions.

    You can (and probably should) work on more problems to prepare for the exam. You should also take a look at the multiple choice questions. I have not vetted all the questions, so there may be mistakes.

    If you find issues with the questions, post them to piazza!


  • Test Prep 01: Questioning

    Due: Thursday 11/07 10:00am

    Submission name: test02.md

    Write Possible Test Questions

    With your TableBuddy™ write three potential test questions.

    1. The first two should be multiple choice questions with 4 options.
    2. The third one should be a function to program.
      • This should be similar to the programming work you have had so far. Include all the information needed to write the function (formulas, etc).

    Put both questions, and the answers in a markdown file. Using the following format (there is also a sample file on thesource):

    #### MC Question
    Skill:
    
    
    
    Options:
    1.
    2.
    3.
    4.
    
    Answer:
    
    ---
    #### MC Question:
    Skill:
    
    
    
    Options:
    1.
    2.
    3.
    4.
    
    Answer:
    
    ---
    #### Programming question:
    Skills:
    
    
    Possible solution:
    ```
    
    ```
    
    

    Here is a filled in Example:

    #### MC Question
    Skill: 90001
    
    What is the air speed of an unladen swallow?
    Options:
    1. 2 mph
    2. 20 mph
    3. 200 mph
    4. African or European?
    
    Answer: 4
    
    ---
    #### MC Question:
    Skill: 9002
    
    Who you gonna call?
    
    Options:
    1. Transformers
    2. Ghostbusters
    3. Thundercats
    4. Teenage Mutant Ninja Turtles
    
    Answer: 2
    
    ---
    #### Programming question:
    Skills: 1,2,3
    
    Write a function that draws a circle in the middle of the screen. The size and color should be parameters.
    Possible solution:
    ```
    void drawCircle(int s, color c) {
      fill(c);
      circle(width/2, height/2, s);
    }
    ```
    

    Skills

    Skill Minimal Competency Developing Competency Competency Mastery
    5. Working with Boolean Values Understands the purpose of boolean values. Demonstrates the appropriate use of comparison operators. Demonstrates the appropriate use of comparison and boolean operators. Writes functions that take in boolean values and/or return boolean values.
    11. Conditional Statements Can use a single if statement correctly. Can use combined if and else statements correctly. Can use if, else if, and else correctly multiples times in a program. Can use multiple styles of combinations of conditional statements (i.e. nested, sequential) in a single program.
    13. Handling Events Can modify the state of a running program using the keyPressed() method. Can modify the sate of a running program using multiple keys via the keyPressed() method. Can modify the state of a running program using mouePressed(), using the mouse’s coordinates in some way, as well as using keyPressed() Can work with all the keyboard and mouse event handling Processing functions.
    14. Using Objects Can declare and Object variable and instantiate an Object using a constructor. Can use multiple Objects in a program by calling methods on appropriately declared and instantiated Object variables. Can use Objects in a program, describe how reference variables work, and how they are different from primitive variables. Can use Objects and accurately make heap diagrams of Object variables and data.
    15. Writing Classes Can design a class by grouping together ideas that should be encapsulated into a single class. Can separate out the fields from the methods while designing a class. Can write a class with fields, a single constructor and methods. Can write classes with fields, and overloaded methods and constructors.

  • Work 21: A Vast Array of Possibilities

    Due: Wednesday 11/06 10:00am

    Submission name: w21_array

    1. Pull code from thesource repository.
    2. Copy the barGraph processing program in to your work repository.
    3. Follow the following prompts. Place your answers at the top of your code using comments.
      • // is the inline comment symbol, used to comment a single line of code.
      • /* */ is the block comment symbol, anything between the two asterisks will be commented out, including newlines.
    • Task 0: Answer the following questions at the top of the processing file.
      • values is an array, the basic data structure that exists in Java. Data stored in an array are called elements. The position of an element in an array is called on index. The first index of any array is 0. On line 6, the array values is initialized. What the last index of values?
      • How can you determine the size of an array? Hint: You can find this in 2 spots in the code.
      • What syntax would you use to refer to the element at index 4 in values?
      • What does the randomArray function do?
    • Task 1
      • Fill in the drawBars function. It should go through the array and draw a bar graph based on the values in the array. The height of each bar should be equal to the value of the given element in the array. The width of each bar should be euqal to the barWidth parameter. It should look like this (bar heights will be different based on randomness):
      • bars
      • If you have this working, try inverting the graph so all the bars start at the bottom like this:
        • bars
    • Task 2
      • WWrite a new method: int arrayMax(int[] data). This method should return the index of the largest value in data. Modify drawBars so that the fill color of the bar for the largest value is different from the otehr bars.

  • Lab 01: This Game's a Drag

    Due: Wednesday 11/06 10:00am

    Read the instructions in the code and write the requested methods. All the methods involve covering the screen with rectangles that produce different color patterns.

    Reminder: Test next Friday, 11/08

    Reference image (the gif will not run at the same speed as your program):

    lab01_game

    Skills Assessed

    Skill Minimal Competency Developing Competency Competency Mastery
    2. Controlling Color State Can set the fill or stroke color of a 2D shape. Can set the fill and stroke color of a 2D shape. Can set the fill and stroke color and the stroke weight of a 2D shape. Can control the fill and stroke colors and the stroke weights of multiple 2D shapes.
    3. Using Colors Can set colors using separate Red, Green, and Blue values. Can set colors using RGB values or hexcode values. Can create and work with color variable types. Can explain how the color data type represents color values.
    4. Primitive Variables and Types Can declare, initialize, and use int variables. Can declare, initialize, and use int and float variables. Can explain the differences and use the different integer and floating point variable types. Can explain the differences between, use, and explain how the different primitive variables types represent data.
    5. Working with Boolean Values Understands the purpose of boolean values. Demonstrates the appropriate use of comparison operators. Demonstrates the appropriate use of comparison and boolean operators. Writes functions that take in boolean values and/or return boolean values.
    6. Working with setup and draw Can write a valid setup function that sets initial conditions for a processing program. Can write a valid setup function, and can write a valid draw function that generates different program output each frame. Can create global variables that are initialized in setup and modified in draw. Can use global variables, custom functions, and setup and draw to produce a full processing program.
    7. Controlling Program Speed Can set the frame rate for a processing program. Can set the frame rate based on a specified speed. Can control program output based on the current frame number. Can start and stop the action of a processing program.
    8. Custom Functions Can identify the return type, name, parameter list, and body of a function. Can write a function given a header and description. Can write a function, including selecting appropriate return and parameter types. Can write multiple functions and use variable scope accurately.
    9. Writing Readable Code Uses descriptive identifiers. Uses indentation and newlines to create more readable code, and descriptive identifiers. Uses inline and block comments when appropriate. Uses indentation and newlines, and descriptive identifiers. Can take a large programming task and break it up into smaller functions.
    11. Conditional Statements Can use a single if statement correctly. Can use combined if and else statements correctly. Can use if, else if, and else correctly multiples times in a program. Can use multiple styles of combinations of conditional statements (i.e. nested, sequential) in a single program.
    13. Handling Events Can modify the state of a running program using the keyPressed() method. Can modify the sate of a running program using multiple keys via the keyPressed() method. Can modify the state of a running program using mouePressed(), using the mouse’s coordinates in some way, as well as using keyPressed() Can work with all the keyboard and mouse event handling Processing functions.
    14. Using Objects Can declare and Object variable and instantiate an Object using a constructor. Can use multiple Objects in a program by calling methods on appropriately declared and instantiated Object variables. Can use Objects in a program, describe how reference variables work, and how they are different from primitive variables. Can use Objects and accurately make heap diagrams of Object variables and data.
    15. Writing Classes Can design a class by grouping together ideas that should be encapsulated into a single class. Can separate out the fields from the methods while designing a class. Can write a class with fields, a single constructor and methods. Can write classes with fields, and overloaded methods and constructors.

  • Work 20: Collision Alarm!

    Due: Thursday 10/31 10:00am

    Submission name: w20_collision

    When submitting, make sure to submit the whole processing sketch folder with the driver and Ball class files.

    Reference Image:

    a15_collision

    First, get the starter code

    Start with a working version of the object based bouncing ball program. get it here. Add these 2 lines to the top of your driver file, they will provide color values that you will be using in this assignment.

    color SAFE_COLOR = color(0, 255, 255);
    color COLLISION_COLOR = color(255, 0, 255);
    

    Add the following to the Ball class:

    • Instance Variables:
      • color c: represents the intended fill color of a Ball object.
    • Methods:
      • Constructor
        • Set c to SAFE_COLOR.
        • Set the speeds to random values in the range [-5, 5]
      • display()
        • Modify this so the Ball object has the appropriate fill color.
      • void setColor(color newc)
        • Set the color instance variable to newc
      • boolean collisionCheck(Ball other)
        • Returns true if the calling ball object and other are touching, false otherwise.
        • You will need to check the distance between the 2 Ball objects.

    Modify the driver file as follows:

    setup

    • Make the screen 400x400 (smaller to make collisions more likely).
    • Create two Ball objects using the default constructor.

    draw

    • Check if the two Ball objects are touching.
    • If they are, set the color instance variable of each to COLLISION_COLOR.
    • If not set the color instance variable of each to SAFE_COLOR.

    If you get everything working, try this with 3 balls.


  • Work 19: Further Fun With Flags

    Due: Wednesday 10/30 10:00am

    Submission name: w19_flag

    Team Flag Time!

    Time to get to know your new neighbors! In your brand new TableBuddies+™ groups:

    • Create a Team Name Portending Greatness
    • Design a team flag for your new team.
    • Write a processing program that draws your flag.
      • The last time you did this, you had much less processing at your disposal. Think about incorporating conditional statements, loops, etc.
    • Each team member should submit the SAME EXACT PROGRAM.
    • Select one representative to make a post to Piazza with your flag.
      • The post should be a note with the following features:
        • Summary: flag of greatness for TNPG of pdX
        • Folder: fam
        • Body:
             TNPG
             Member names
             PICTURE OF FLAG
          

  • Work 18: Drats! (definitely not Craps)

    Due: Monday 10/28 10:00am

    Submission name: w18_drats

    The Game

    You will use your work from yesterday to program the totally-made-up, not-based-on-a-real-gambling-game game of Drats. In Drats a player rolls 2 dice, attempting to roll as many times until they roll a 7 or 11, at which point they loose. Here are the rules:

    • Initially, a target value is not set. A player cannot increase their score until the target is set.
    • The first time a player rolls, they will set the target unless:
      • Their roll (both dice) is 2, which is an immediate loss.
      • Their roll is a 7 or 11, in which case they roll again.
    • Once a target has been set, the player rolls and follows these rules:
      • If they roll a 7 or 11, they lose.
      • If they roll the target, the target gets erased and they go back to the target setting phase. Their score does not change.
      • If they roll any other number, it gets added to their score.

    In order to make this game, add the following to your program from yesterday:

    Die Class Modifications:

    Constructor:

    • Takes 3 arguments representing the (x, y) position and size of the Die.
    • Initially set the value to 0.

    Methods:

    • void display()
      • If the value is 0, do not display the value at all.
    • int roll()
      • Return the value after it is set to a random number.
    • void reset()
      • Set value back to 0.

    Driver Modifications

    Global variables:

    • Add variables to keep track of the target, score and if the player has not lost yet (is still playing).

    New Methods:

    • void restart()
      • Initialize the target, score and playing variables.
      • Call reset on both dice.
    • void updateScore(int roll)
      • This is the main logic of the game.
      • roll will be the result of a roll of two dice.
      • Modify score, target and playing variables based on the rules of the game.

    Modified methods:

    • void keyPressed()
      • Only allow the player to roll (spacebar) if they have not lost yet.
      • Keep track of the result of the roll, and call updateScore with the total.
      • If the player types r, call the restart() method to start the game over.
    • void setup()
      • Call restart instead of setting the new global variables.
      • Leave the Die creation code in.
    • void draw()
      • Add text to describe the current state of the game.
      • If there is no target, display “no target”.
      • If the player has lost, display, “you lose”.
      • If the game is running, display the target and the score.
      • See the images below for an example.
           

    drats


  • Work 17: Number Cubes (definitely not Dice)

    Due: Thursday 10/24 10:00am

    Submission name: w17_dice

    dice

    Write the Die class for a processing program. The code for the Ball class can be found on thesource under bounceObject. It will be useful as a reference. For this assignment, use the following driver file code:

    Die d0, d1;
    
    void setup() {
      size(200, 200);
      d0 = new Die(25, height/2 - 25, 50);
      d1 = new Die(125, height/2 - 25, 50);
    }//setup
    
    void draw() {
      background(150);
    
      d0.display();
      d1.display();
    }//draw
    
    
    void keyPressed() {
      if (key == ' ') {
        d0.roll();
        d1.roll();
      }//roll
    }//if keyPressed
    

    Die Class Components:

    Fields:

    • You will need fields for the position, size and value of the die.
    • You may want to add other fields to enhance the visual presentation of the die, but this is not necessary.

    Constructor:

    • Takes 3 arguments representing the (x, y) position and size of the Die.
    • Sets the value to a random integer in the range [1, 6].

    Methods:

    • void display()
      • Draws the die as a square with the value printed inside the die as text. Use the image above as your guide.
    • void roll()
      • Sets the value of the die to a new integer in the range [1, 6]

    Optional Additions

    If you get all this working, here are some things you could try:

    • Add the capability to modify the number of sides a Die could have.
    • Instead of displaying a number, display “pips” (the little circles on a standard die).
    • Other visual flair.

  • Work 16: Let's Bounce

    Due: Tuesday 10/22 10:00am

    Submission name: w16_bounce

    1. Pull code from thesource repository.
    2. Copy the bounce processing program in to your work repository.
    3. Follow the following prompts. Place your answers at the top of your code using comments.
      • // is the inline comment symbol, used to comment a single line of code.
      • /* */ is the block coment symbol, anything between the two asterisks will be commented out, including newlines.
    • Task 0
      • Read and run the program, describe, in your own words, in at most 2 sentences, generally what you see and how the program works.
    • Task 1
      • The program has 2 keyboard controls. explain, in your own words, what they do.
    • Task 2
      • Why does the program need variables for udy and lrx but not corresponding variables for x and y for each distinct circle?
    • Task 3
      • WITHOUT ADDING ANY NEW VARIABLES, add a third circle to the program, when run, the program should behave like this:
      • a16_bounce
    • Task 4
      • Add a 4th circle that behaves as follows:
        • It should start at a random position inside the screen (but should be fully visible) and be the same size as the other circles.
        • Initially, it should move one pixel down and one pixel to the left.
        • When it reaches one of the screen edges, it should “bounce” in the same way that the other circles bounce.

  • Work 15: A Moving Experience

    Due: Monday 10/20 10:00am

    Submission name: w15_events

    Events

    This program should have a square and a circle, which will respond to events as follows:

    Mouse:

    • The circle’s location should be centered at the mouse’s coordinates.
    • When the mouse button is pressed, draw a line from the square’s upper-left corner to the circle’s center. The line should remain on the screen even after the mouse has been released.

    Keyboard:

    • Pressing the spacebar (' ') should enable or disable all movement (mouse or keyboard based).
    • Pressing q should move the square so that it’s upper left corder is at the center of the screen.
    • You should be able to move the square using the arrow keys or w (up), a (left), s (down), and d (right). (when moving the square, its ok if the line shifts position).

    Starter Code:

    Use the following global variables and setup for your program:

    int squareX;
    int squareY;
    int circleX;
    int circleY;
    int lineX;
    int lineY;
    boolean movement;
    
    void setup() {
      size(600, 400);
      squareX = width/2;
      squareY = height/2;
      movement = true;
      lineX = squareX;
      lineY = squareY;
      fill(255, 0, 255);
    }//setup
    

  • Project 00: Time Variance

    Due: Friday 10/18 10:00am

    p00_clock

    This is a project, as such, it will be graded for correctness. You may work either alone OR in groups of 2 (you can partner with anyone in the class). Use the following link to create a new github classroom repository for your project:

    Skill List

    Skill Minimal Competency Developing Competency Competency Mastery
    1. Basic Drawing Functions (line, circle, square, rect, ellipse) Can use one basic 2D drawing function. Can use two basic drawing functions. Can use all the basic drawing functions. Can use multiple basic drawing functions to draw a complex shape.
    2. Controlling Color State Can set the fill or stroke color of a 2D shape. Can set the fill and stroke color of a 2D shape. Can set the fill and stroke color and the stroke weight of a 2D shape. Can control the fill and stroke colors and the stroke weights of multiple 2D shapes.
    3. Using Colors Can set colors using separate Red, Green, and Blue values. Can set colors using RGB values or hexcode values. Can create and work with color variable types. Can explain how the color data type represents color values.
    4. Primitive Variables and Types Can declare, initialize, and use int variables. Can declare, initialize, and use int and float variables. Can explain the differences and use the different integer and floating point variable types. Can explain the differences between, use, and explain how the different primitive variables types represent data.
    5. Working with Boolean Values Understands the purpose of boolean values. Demonstrates the appropriate use of comparison operators. Demonstrates the appropriate use of comparison and boolean operators. Writes functions that take in boolean values and/or return boolean values.
    6. Working with setup and draw Can write a valid setup function that sets initial conditions for a processing program. Can write a valid setup function, and can write a valid draw function that generates different program output each frame. Can create global variables that are initialized in setup and modified in draw. Can use global variables, custom functions, and setup and draw to produce a full processing program.
    7. Controlling Program Speed Can set the frame rate for a processing program. Can set the frame rate based on a specified speed. Can control program output based on the current frame number. Can start and stop the action of a processing program.
    8. Custom Functions Can identify the return type, name, parameter list, and body of a function. Can write a function given a header and description. Can write a function, including selecting appropriate return and parameter types. Can write multiple functions and use variable scope accurately.
    9. Writing Readable Code Uses descriptive identifiers. Uses indentation and newlines to create more readable code, and descriptive identifiers. Uses inline and block comments when appropriate. Uses indentation and newlines, and descriptive identifiers. Can take a large programming task and break it up into smaller functions.
    11. Conditional Statements Can use a single if statement correctly. Can use combined if and else statements correctly. Can use if, else if, and else correctly multiples times in a program. Can use multiple styles of combinations of conditional statements (i.e. nested, sequential) in a single program.
    12. Loops Can use a basic while loop. Can use a basic for loop with a variable modified by an increment (++) or decrement (--) operator. Can use for loops with a variable controlled by --, ++, and other arithmetic operations as appropriate. Can use both for and while loops when appropriate, and explain why one is a better choice over another in a given situation.

  • Work 14: Graphic Programming

    Due: Thursday 10/10 10:00am

    Submission name: w14_graphs

    For this assignment, you may want to refer to:

    Write the following functions:

    • getSineY(int theta, float amplitude, int k)
      • Returns the y value given:
        • \[y = amplitude\sin(\theta) + k\]
      • Assume theta represents a measure in degrees.
    • drawSineCurve(int x, float amplitude, int k, int d)
      • Calls getSinY, using x as the value for theta.
      • Draws a dot of diameter d with the center of (x, getSineY...)
    • plotCircle(int theta, int r, int cx, int cy, int d)
      • Draws a dot of diameter d at (x, y) where (x, y) is a point on the circumference of a circle with center (cx, cy) and radius r.
      • Remember your algebra:
        • \[x = amplitude\cos(\theta) + cx\]
        • \[y = amplitude\sin(\theta) + cy\]

    Write a program with setup and draw to test these functions:

    • Create a 600x600 screen.
    • In draw use the current frame for theta.
    • Have the sine curve wrap back to the left side of the screen when it reaches the right edge.
    • Use the top half of the screen for the since curve.
    • Use the bottom half of the screen for the circle.

  • Work 13: Temperature Check

    Due: Wednesday 10/09 10:00am

    Submission name: w13_thermometer

    Write A Processing Program:

    Over the next few days, we will be making a processing program to display thermometers, showing temperatures in Fahrenheit and Celsius. This is but phase 0. This program should display a single thermometer made of:

    • A large rectangle to contain the entire thermometer.
    • A smaller interior rectangle to contain the temperature reading.
    • A smaller rectangle containing the actual temperature reading (red part).
    • Hashmarks along the side for numbers.

    Improve on Yesterday’s Work

    Make the following modifications to yesterday’s work.

    • Add these global constants to the top of your program to allow us to switch between temperature scales:
      int CELSIUS = 0;
      int FAHRENHEIT = 1;
      
    • Modify drawThermometer
      • Add a float temperature parameter to provide a temperature amount.
      • Add an int scale parameter which will set the correct scale.
      • When calling drawReading, make the reading area 40% of the width of the thermometer and 90% of the height.
      • Display the temperature on top of the reading area.
    • Modify drawReading
      • Include float temperature and int scale parameters.
      • In addition to the rectangle that represents the entire reading area, add a red rectangle that should represent the value of temperature.
    • Modify drawScale
      • Include int scale as a parameter.
      • The scale should go from freezing to boiling in the appropriate range (32-212 or 0-100)
      • Only draw hash marks on multiples of 5.
    • Add a new function float fToC(float fahrenheit)
      • It will return the Celsius value of fahrenheit.
      • Conversion: c = \((f-32)\dfrac{5}{9}\)
    • Use the following setup and draw when done (when working, you should just call drawThermometer in setup and omit draw until you get everything working):
      void setup() {
        size(300, 600);
        textAlign(CENTER, CENTER);
        frameRate(30);
      }//setup
      
      void draw() {
        background(150);
      
        if (frameCount % 30 == 1) {
          ft = random(32, 212);
        }
        drawThermometer(50, 50, 100, 500, ft, FAHRENHEIT);
        drawThermometer(150, 50, 100, 500, fToC(ft), CELSIUS);
      }//draw
      

    Reference Image:

    a13_thermometer

    The reference image includes numbers, you do not need to add them.


  • Work 13:

    Due: Tuesday 10/08 10:00am

    Submission name: w13_thermometer0

    Write A Processing Program:

    Over the next few days, we will be making a processing program to display thermometers, showing temperatures in Fahrenheit and Celsius. This is but phase 0. This program should display a single thermometer made of:

    • A large rectangle to contain the entire thermometer.
    • A smaller interior rectangle to contain the temperature reading.
    • A smaller rectangle containing the actual temperature reading (red part).
    • Hashmarks along the side for numbers.

    To Start:

    Write the following functions, they will be expanded upon in the coming days. For now, assume we are creating a celsius based thermometer from 0 - 100 degrees.

    • void drawScale(int x, float y, int h)
      • Draw the hashmarks along the side of the temperature reading.
      • (x, y) should be the left corner of the 0 degree hashmark.
      • h should be the height of the entire temperature reading bar.
    • void drawReading(int x, int y, int w, int h)
      • Draw the reading area of the thermometer.
      • (x, y) should be the upper left corner of the reading area box.
      • w should be the width of the reading area.
      • h should be the height of the reading area.
    • void drawThermometer(int x, int y, int w, int h)
      • Draw the entire thermometer, calling drawScale and drawReading as needed.
      • (x, y) should be the upper left corner of the entire thermometer.
      • w, h should be the total width and height of the thermometer.
      • When calling the other functions, make sure that the hash marks and reading area fit within the entire thermometer. You can assume that h and w will always be reasonable enough values to fit everything we need to.

    Reference Image:

    a13_thermometer

    The reference image includes numbers, you do not need to add them.


  • Lab 00: Tiling

    Due: Monday 10/07 10:00am

    Read the instructions in the code and write the requested methods. All the methods involve covering the screen with rectangles that produce different color patterns.

    Reference image (the gif will not run at the same speed as your program):

    lab00_tiles

    Skills Assessed

    Skill Minimal Competency Developing Competency Competency Mastery
    2. Controlling Color State Can set the fill or stroke color of a 2D shape. Can set the fill and stroke color of a 2D shape. Can set the fill and stroke color and the stroke weight of a 2D shape. Can control the fill and stroke colors and the stroke weights of multiple 2D shapes.
    9. Writing Readable Code Uses descriptive identifiers. Uses indentation and newlines to create more readable code, and descriptive identifiers. Uses inline and block comments when appropriate. Uses indentation and newlines, and descriptive identifiers. Can take a large programming task and break it up into smaller functions.
    11. Conditional Statements Can use a single if statement correctly. Can use combined if and else statements correctly. Can use if, else if, and else correctly multiples times in a program. Can use multiple styles of combinations of conditional statements (i.e. nested, sequential) in a single program.
    12. Loops Can use a basic while loop. Can use a basic for loop with a variable modified by an increment (++) or decrement (--) operator. Can use for loops with a variable controlled by --, ++, and other arithmetic operations as appropriate. Can use both for and while loops when appropriate, and explain why one is a better choice over another in a given situation.

  • Work 12: Circle Time!

    Due: Tuesday 10/01 10:00am

    Submission name: w12_circles

    Write A Processing Program:

    This program should produce a row of circles that move across the screen. When the row would go past the edge of the screen, it should instead go back to the left side, and move down. Your program should have the following features:

    • Global Variables
      • int cx, cy: The coordinates for the first circle in the row.
      • int csize: The size of each circle.
      • int circles: The numbers of circles in the row.
    • setup
      • Use the following:
        void setup() {
        size(500, 500);
        frameRate(30);
        csize = 50;
        cx = csize/2;
        cy = csize/2;
        circles = 4;
        }//setup
        
    • void circleRow(int startx, int starty, int numCircles, int d)
      • Draws a single row of numCircles circles.
      • The center of the first circle should be (startx, starty).
      • Each circle should have a diameter of d
    • draw
      • Calls circleRow
      • Every second, update cx to move to the right size of a circle.
      • If the entire row of circles would go past the edge of the screen, reset cx to the left side, and update cy to move down one circle.

    Reference Image:

    a11_circles

    • If you get this working, try making a function called circleGrid, that draws a grid of circles instead of a single row.

  • Work 11: Test Prep

    Due: Friday 09/27 10:00am

    Submission name: work11.md

    You can find all the submitted test questions here: https://github.com/nextcs-dw/thesource/tree/main/test00

    Pick 4 of the programming questions to complete. Since the functions will most likely be fully working processing programs, you should put your answers in a makrdown file. Include the question number at the top and put your answer inside a code block (check the review template for an example of a code block). You are encouraged to use processing to test your solutions.

    You can (and probably should) work on more problems to prepare for the exam. You should also take a look at the multiple choice questions. I have not vetted all the questions, so there may be mistakes.

    If you find issues with the questions, post them to piazza!


  • Work 10: FizzBuzz!

    Due: Friday 09/27 10:00am

    Submission name: w10_fizzbuzz

    Write a processing program withe the following features:

    This program will play out the game fizzbuzz by displaying a number or the appropriate text.

    • Global Variables:
      • fizz, buzz, count (all int)
    • setup
      • Set the screen size to 300x300.
      • Set the frameRate to 30fps.
      • Perform any functions needed to set your text defaults (see below for more info).
      • Initialize your global variables:
        • fizz should be 3, buzz should be 5, count should be 0.
    • draw
      • Clear the screen.
      • Increase count by one twice a second.
      • Display:
        • FizzBuzz! if count is divisible by both fizz and buzz.
        • Fizz if count is divisible by only fizz.
        • Buzz if count is divisible by only buzz.
        • count in any other case.
      • In order to show text or count to the screen, you should look at the following functions:

    Of course, you can always try to jazz it up

    Reference Image:

    a10_fizzbuzz


  • Work 09: Get Animated

    Due: Tuesday 09/24 10:00am

    Submission name: w09_animate

    Write A processing Program With the Following Features.

    1. Copy in your logo function from work 04 (if you would prefer a different “logo”, you can write a new function as well).
    2. Create a setup function that:
      • Sets the screen to 600x600
      • Sets the background to a color of your choosing
      • Sets the framerate to 30 frames per second.
      • Calls your logo function, drawing your logo at a random position on the screen such that the entire logo can be seen.
    3. Create a draw function that:
      • Clears the screen.
      • Every 2 seconds, have the logo move 1 pixel up.
      • If the logo reaches the top of the screen, it should no longer move.

    Skills for Test I

    Skill Minimal Competency Developing Competency Competency Mastery
    1. Basic Drawing Functions (line, circle, square, rect, ellipse) Can use one basic 2D drawing function. Can use two basic drawing functions. Can use all the basic drawing functions. Can use multiple basic drawing functions to draw a complex shape.
    2. Controlling Color State Can set the fill or stroke color of a 2D shape. Can set the fill and stroke color of a 2D shape. Can set the fill and stroke color and the stroke weight of a 2D shape. Can control the fill and stroke colors and the stroke weights of multiple 2D shapes.
    3. Using Colors Can set colors using separate Red, Green, and Blue values. Can set colors using RGB values or hexcode values. Can create and work with color variable types. Can explain how the color data type represents color values.
    4. Primitive Variables and Types Can declare, initialize, and use int variables. Can declare, initialize, and use int and float variables. Can explain the differences and use the different integer and floating point variable types. Can explain the differences between, use, and explain how the different primitive variables types represent data.
    5. Working with Boolean Values Understands the purpose of boolean values. Demonstrates the appropriate use of comparison operators. Demonstrates the appropriate use of comparison and boolean operators. Writes functions that take in boolean values and/or return boolean values.
    8. Custom Functions Can identify the return type, name, parameter list, and body of a function. Can write a function given a header and description. Can write a function, including selecting appropriate return and parameter types. Can write multiple functions and use variable scope accurately.
    11. Conditional Statements Can use a single if statement correctly. Can use combined if and else statements correctly. Can use if, else if, and else correctly multiples times in a program. Can use multiple styles of combinations of conditional statements (i.e. nested, sequential) in a single program.

  • Work 08: Ride The Lightning... Again

    Due: Monday 9/23 10:00am

    Submission name: w08_lightningTimed

    1. Clone this repository outside of your work repository: https://github.com/nextcs-dw/thesource
    2. Copy the lightningTimed processing program in to your work repository.
    3. Follow the following prompts. Place your answers at the top of your code using comments.
      • // is the inline comment symbol, used to comment a single line of code.
      • /* */ is the block coment symbol, anything between the two asterisks will be commented out, including newlines.
    • Task 0
      • Read the entire program (do not run it yet), make note of anything you have not seen or used before in class.
    • Task 1
      • Run the program, describe, in your own words, in at most 2 sentences, generally what it does.
    • Task 2
      • Now that you have read & run the program, answer the following specific questions about the code. Use your own words, do not look these up in the processing reference manual. You may want to alter the program slightly to test things.
        1. What is the purpose of the draw method?
        2. What does the frameRate method do?
        3. What does the frameCount variable represent?
        4. What is the puprpose of this piece of code frameCount % 30 == 0?
    • Task 3
      • Modify the code so that only 1 lightning bolt can be seen at a time. Specifically, just the new lightning bolt that has been drawn. This can be done by adding a single line of code. What line of code did you add?
    • Task 4
      • Modify the code so that 5 frames before a lightning bolt is drawn, the entire screen turns white. (i.e. black screen, white screen, lightning bolt on black screen, repeat…). This will require at least 2 lines of code. What lines of code did you add?

  • Work 07: Ride The Lightning

    Due: Friday 09/20 10:00am

    Submission name: w07_lightning

    For this assignment, you may want to refer to:

    lightning

    Make a lightning function

    Write drawLightning:

    • Use the following function header: void drawLightning(int x, int y, int numParts)
    • The function should draw numParts connected lines starting at (x, y).
    • Each line should start at the previous (x, y) coordinates and end at random coordinates with the following restrictions:
      • The next x coordinate should be an int in the range [x - 5, x + 5).
      • The next y coordinate should add a random int in the range [y + 5, y + 20).
    • Use a while loop to draw the appropriate number of lines. Do not worry if your lightning bolt goes past the bottom of the screen or doesn’t make it all the way.

    Write a setup function

    setup should:

    • Set the screen size to 500x500.
    • Run drawLightning at least 5 times.

    Optional modifications

    • Play around with stroke and strokeWeight to make better looking lightning bolts.
    • Use random in conjunction with stroke and stokeWeight
    • Add other features to make the image more interesting.
    • If you create an interesting lightning image, save it (as a png or jpeg), and share it on piazza, use the tag nextjourney.

  • Work 06: Further House Keeping

    Due: Thursday 09/19 10:00am

    Get it together

    In class, these were today’s action items

    1. Complete Team Flag!
    2. Post Team Flag to Piazza.
    3. Make sure Github repository is in order. This assignment is to make sure you’ve gotten all those things taken care of.

    1: Complete Team Flag

    • Make sure all memebers of your team have the same code for your flag.
    • Your repostories are public for the time being, so you can grab the code from your teammates if need be.
    • Make sure you w05_flag work submission is updated to your current flag.

    2: Piazza Setup

    1. Check your stuy.edu email for a piazza invitation link, follow the link (if you have a piazza account already, use it).
    2. Once logged in, click on the gear icon to the far right. Select Acoount/Email Settings
    3. Add your nycenet email to your account.

    2.a: Team Piazza Post

    Reminder: This is only one post per team

    1. Come up with a Team Name Portending Greatness (TNPG) to equal the magesty of your team flag.
    2. Select one representative to make a post to Piazza with your flag.
    3. The post should be a note with the following features:
      • Summary: flag of greatness for TNPG of pdX
      • Folder: fam
      • Body:
           TNPG
           Member names
           PICTURE OF FLAG
        

    2.b: Personal Piazza Post

    1. Create a post to introduce yourself and your ducky. (Questions about ducky? Then https://rubberduckdebugging.com/).
    2. The post should be a note with the following features:
      • Summary: DUCKY_NAME of pdX has entered the chat
      • Folder: quack
      • Body:
           Import ducky origin story
           Picture of you holding your ducky, your face should be visible.
        

    3: Github Repository

    At the point your github repository should contain the follwoing processing programs:

    • w03_logo
    • w04_function
    • w05_flag

    For an example of what your repository should look like, go to:

    https://github.com/stuycs-gh-classrooms/04-nextcs-work-jonalf

    (it’s just your url but with the username jonalf, if your in period 5, make sure you swap out the 5 for a 4).


  • Work 05: Fun With Flags

    Due: Wednesday 09/17 10:00am

    Submission name: w05_flag

    Make a team flag!

    • Group up with your TableBuddies+™ to Design a team flag that incorporates the designs from each members logo/avatar/pet from the previous assignment.
    • Write a processing program that draws the flag, using the functions your teammates created, adding features as required.

  • Work 04: Functional Programming

    Due: Tuesday 09/17 10:00am

    Submission name: w04_function

    Make a logo method

    For this assignment, you can either use the logo you made for Work 03, or make a different one.

    1. Turn the logo drawing algorithm into a method that has parameters for the (x, y) coordinates of the center.
    2. Write a setup method that will:
      • Set the screen size to 500x500.
      • Set a background color (to something of your choosing).
      • Call the logo drawing method from step 1 4 times, placing your logo on the screen at locations of your choosing.

    If you want to try something a little harder, add a parameter to your method to represent the overall size of your logo (the dimensions of a square that would contain your logo). The method should then scale the drawing functions in order to make your logo fit within the specified size.


  • Work 03: Personalization

    Due: Monday 09/16 10:00am

    Important Notes:

    • From now on, programming assignments will have a submission name. When saving your work, use that name. (For example, today’s assignment should be saved as w03_logo.pde).
    • Design a logo/avatar/pet. That should fit within a 200x200 pixel area.
    • Write a processing program that draws your logo, using variables for all the shapes so that the logo is not anchored to a specific location.
    • Make your screen size 500x500 when testing.
    • Add your program to your work GitHub repository.

  • Work 02: Git Going!

    Due: Friday 09/13 10:00am

    Important Note

    • The Dojo is open! You can stop by 307 today 3:45 - 5, they are very good at helping with Github issues!
    • On Thursday 9/12 more was added to this assignment that must be done from your home computer. The addition starts at Clone Your Repository

    Preamble:

    • The notes page has some more detailed information about the terminal, git and GitHub similar to what we discussed in class today.

    Windows Users Only:

    Download & install https://gitforwindows.org/. It provides a number of useful utilities for navigating git in a windows environment. Including a git and windows friendly terminal environment called gitbash.

    SSH Key Setup

    • Create SSH keys for your home computer and upload the public key to GitHub. You should be able to do this in Terminal on MacOS or linux or Gitbash on Windows.
    • $ ssh-keygen -b 4096
      • You will then be prompted to select a location for the keys that will be generated (keep the default).
      • The keys will be stored in the ~/.ssh directory.
      • The private key will be called id_rsa and the associated public key will be called id_rsa.pub.
      • You will then be prompted to provide a password protect this key, please use a secure password for this.

    Add your public ssh key to GitHub

    • Use cat to display the contents of your public key in the terminal:
      • $ cat ~/.ssh/id_rsa.pub
    • Log into your GitHub account in a web browser
    • In the upper-right corner of any page, click your profile “photo”, then click Settings.
    • In the user settings sidebar, click SSH and GPG keys.
    • Click “New SSH key” or “Add SSH key”.
      • Paste your entire public key into the “Key” field.
      • And add a label to the “title” field (e.g. “home laptop”)
      • Click “Add SSH key” and possibly, confirm your git password.

    Test Your Keys

    • Use the following command:
      • $ ssh -T git@github.com
      • You will be prompted to type the ssh-key password that you chose when creating the key.
      • Read the response message from the above step! If it worked, you should see a message like this:
        • Hi jonalf! You've successfully authenticated, but GitHub does not provide shell access.

    Clone Your Repository

    1. Find your repository on the GitHub website.
      • Should look something like https://github.com/stuycs-gh-classrooms/05-nextcs-work-jonalf).
    2. Get the clone link. You can find this through the green Code button. Make sure to select ssh.
      • The link should look like this: git@github.com:stuycs-gh-classrooms/nextcs-work-jonalf.git
    3. Open a terminal, clone your repository into your home directory:
      • $ git clone SSH_LINK (replace SSH_LINK with the link from step 2)
    4. Change into the cloned repository:
      • $cd REPOSITORY (if you don’t know the name of your repository, try ls).

    Modify README.md & Commit Your Changes

    1. On your computer, open README.md in a text editor (do not use something like Microsoft Word or Apple Pages).
      • On windows, use Notepad.
      • On MacOS, use TextEdit.
    2. Directly below your name, add the following line:
      • updated from home!
    3. Save the file.
    4. Commit your changes from the terminal:
      • $ git commit -am "updated README from home"
      • The message in "" will be associated with this specific commit. It allows you to document what has changed.
    5. Push your commits from the terminal:
      • $ git push
    6. Go back to your repository on the GitHub website and refresh. You should see your updated file.

  • Work 01: Getting to Know Processing

    Due: Wednesday 09/11 10:00am

    Create Your First Processing Program

    • Create a processing program that draws something cool!
    • Use at least 5 drawing functions.
    • Change the fill or stroke color at least once.
    • Don’t forget to save before the end of class We will discuss how to submit this in class tomorrow.

    Join GitHub Classroom

    All Work will be submitted using Github. Github Classroom is a utility that streamlines making repositories and supplying tempalte code. All normal “work” assignments will be submitted using the GitHub classroom repo you will create by following the instructions below. We will discuss git and Github in more detail tomorrow.

    1. Join the GitHub classroom assignment via this link (select the correct one for your class period):
    2. After following that link, click “Accept this assignment”
    3. After ~1 minute (maybe less), refresh the page.
    4. You should see a link that looks something like: https://github.com/stuycs-gh-classrooms/04-nextcs-work-jonalf
      • The end of that url will differ based on your GitHub username, the beginning based on your class period. Click on that url.
      • This will create a GitHub repository for you, and add a basic README.md file to it.
    5. You will be taken to the repository page for your work. You will see the contents of README.md, which should display: “Work For NeXtCS” and then “Name: YOUR NAME HERE”.
    6. Edit README.md by clicking on the pencil icon found to the far right of README.md
      • Replace “YOUR NAME HERE” with your full name, first then last (use preferred name if you’d like).
    7. Find the “Commit changes” button and click it.
    8. Do not worry about adding any work to this repository yet.

  • Work 00: Getting to Know You

    Due: Monday 09/09 10:00am

    1. Please fill out the student info form found here: https://forms.gle/uTqXxaRQkbX8yZwk6
    2. You will need a GitHub account in order to submit work for this class. If you don’t have one already, go to https://github.com/ and create one.
    3. Read and acknowledge the Stuyvesant Computer Science Lab and Network Usage Policy
    4. Download & install Processing.
      • Make sure to install version 4.3 for your appropriate operating system (OS).