Skip to content

Latest commit

 

History

History
51 lines (48 loc) · 2.68 KB

decode.md

File metadata and controls

51 lines (48 loc) · 2.68 KB

Decode

*A process modified from the PRIMM approach (official website)

Steps to start practicing reading and interpreting the code before running sketches:

  1. Predict • Before you run the sketch, look at the code and decide what it will do.
    • Read through the code as if "you" were executing it like the computer, line by line.
    • What elements will appear? What will they look like, and how will they behave?
    • How many are there? Are they related to one another? How?
    • What's the logic or flow structure?
    • If it helps, draw what you think the output will be.
  2. Run • Run the sketch and test your prediction(s). Is the output what you expected?
  3. Investigate • Go back to the code and map the individual lines or blocks of code to the output features that you observed when you ran the sketch. If it helps to test/reinforce your understanding, try:
    • Logging the values of variables and operations to the Console instead of calculating them in your head, i.e. console.log(some variable or operation)
    • Changing function parameters and variable values in substantial ways, i.e. make some numbers really big or really small
    • Commenting out parts of the code to see what happens or to help you focus on smaller sections at a time.
    • Write tracing statements to test the order in which statements are executing.
    • Consulting the resources for the assignment if you see anything new.
  4. Annotate • Duplicate the sketch into your own p5 account, and comment the code to explain what the different parts do, i.e. can you tell the story of the program?
    • If you need to, annotate each line, especially those with functions, syntax, and techniques that are new to you.
    • For example: describe how a function's parameters work, e.g. instead of // draws a circle, include the how: // the x parameter is the circle's distance from the origin of the canvas.
    • If you get stuck, write yourself a question to return to later.
  5. Modify • Use your understanding of the code to change it and make it do different things. Make it your own; modify the code in some way to make it distinct from the original. If there’s something tricky that you’re still wrapping your head around, use that as a starting point. For example, try:
    • Changing the appearance by playing with scale, speed, color, etc.
    • Reordering lines or blocks of code.
    • Simplifying or extending the sketch, e.g. removing code or adding more functionality.
    • Make it interactive!