Skip to content

Homework Shawn Wednesday

RSofiaC edited this page Sep 12, 2016 · 257 revisions

Guidelines

A big part of learning at ITP is learning from each other. So share your work and in exchange you'll get to see everyone else's!

  1. Do your assignment.
  2. Contribute a question.
  3. Post documentation in the form of a blog post. Ideally something visual, some written thoughts, and code. If you are struggling with your sketch and can't get things to work, you should feel free to put your energy into writing about what didn't work (and vent any frustrations!).
  4. Post your sketch online.

Week 1

  • SET UP:

  • DO:

    • Create your own screen drawing: self-portrait, alien, monster, etc. Use only 2D primitive shapes – arc(), curve(), ellipse(), line(), point(), quad(), rect(), triangle() – and basic color functions – background(), colorMode(), fill(), noFill(), noStroke(), stroke(). Remember to use createCanvas() to specify the dimensions of your window.
  • READ AND WATCH:

  • ASK QUESTIONS: Contribute at least 1 question below. (Name optional.)

Questions | Examples

  • How do we use arc() ? I don't understand the start and stop angles. (i also do not entirely understand arcs)
  • How can we flip arcs to flow right to left?
  • How do we smooth lines that travel at an angle?
  • How to combine shapes together? like square and ellipse? or Shapes like Pentagon? - Shir
  • Is there a way to change position of an object to a new place like Null object in AE? - Shir
  • What systems can I use to better to understand the outcomes of my curves and more efficiently place objects in relationship to one another? -Danielle
  • How can programatically repeat shapes across a line or curve? - Leslie
  • How can you loop a color change that is visible without using key down or mouse down, make it automatic (if?) - Regina

Add Your Homework

Week 2

  1. Create a sketch that includes (all of these):
  • One element controlled by the mouse.
  • One element that changes over time, independently of the mouse.
  • One element that is different every time you run the sketch.

Homework Links

  1. Read and Watch:
  1. Questions (example questions)
  • How can I control randomized lines? Can I create a radial pattern? I want to have my sun rays dance!
  • Is it possible to have two different "frame rates" or the appearance of it, for two different elements in a sketch? *Are there other ways I can time the appearance and disappearance of things other than with frameRate or mouseClick? *How can I add and layer multiple images? *If I make changes to my sketch whats the best way to update on cyberduck, does it automatically replace the older file? How do I best organize cyber duck in general? *how to make the Mouse draw only in Y or X axes? *Can I create an alternate state "draw" function where after the mouse clicks you are in a whole new draw function? Is this the same as just writing a new loop function?
  1. Links/Inspiration/Examples (Contribute at least 1 link below)

Week 3

  1. This week, start working with more use interaction and adding logic into animations (bouncing ball, etc). Try working in pairs. Explore different ways to do that, one person coding, one looking for mistakes or bugs and keeping an eye on the overall.

    • Try making a rollover, button, or slider from scratch. Compare your code to the examples on github. Later we'll look at how this compare to interface elements we'll get for free from the browser.
    • Create an algorithmic design with simple parameters. (One example is 10PRINT, example code).
    • Tie the above two together and have an interface element control the visual design or behavior of other elements in your sketch.
  2. READ / WATCH (Nothing required, read or watch what you find most helpful)

Questions (example questions)

  • how can i make a roll over for an object in motion? - rl
  • Can I randomize the outcome of a mouse click or another action so a different if statement is used each time?
  • How can I have my code effected by an analog sensor read out?

Homework Links

Week 4

  1. The idea this week is to explore re-organizing your code. If you can, use an existing/previous project and restructure the code using functions and if you are ambitious with objects. If that isn't possible you can to try something new with the use of functions and objects. Aim to keep setup() and draw() as clean as possible, and do everything (all calculations, drawing, etc.) in functions that you create yourself. Possibilities (choose one or more):

    • Reorganize "groups of variables" into objects.
    • Break code out of setup() and draw() into functions.
    • Use a function to draw a complex design multiple times with different arguments.
    • If you are feeling ambitious, try embedding a function into an object.
  2. READ / WATCH (Nothing required, read or watch what you find most helpful)

    • Stay tuned for a PDF link to Getting Started with p5.js
  3. Examples

Questions (example questions)

  • Post your question here

Add your homework here

Week 5

  • Reminder! All ICM students meet at 11am in the lounge this Friday, Oct. 2nd!
  • If you are looking for supplemental material, checkout Chapters 10 and 11 from Getting Started with p5.js
  • Design a sketch in an object-oriented fashion. Follow these steps:
    1. Build a single object out of a class definition. Use a constructor and methods such as "display" and "move".
    2. Duplicate the object using an array and make as many as you like!

Can you make Smoke? Fireworks? Rain? Snow? A starry sky?

Questions (example questions)

  • Post your question here

Add your homework here

Week 7

Questions (example questions)

  • When trying to change slider volume - do you get the information from "volume" inside the DOM library or you use the p5 "Sound Library"?..Could't figure how to connect my slider to the volume..

Add Homework Here

Week 8

  • READ AND WATCH

  • DO

    • Create a sketch that uses an external data source. Here are some ideas:
      • Track any data over the course of a few days (exercise, sleep, computer use, emails sent, emails read, phone usage, eating, etc.). Create a JSON file with the data and visualize the results.
      • Use weather data to affect elements in a sketch
      • Gather data from a Google Form/Spreadsheet and use in a sketch.

Add Link Your Homework

Note that only the names in bold (1/2 of the class) on the wiki will present next week. The second half will present the "media" (video/sound) assignment the following week. You should all complete both assignments. Feel free e-mail me if you would like to switch weeks.

Week 9

*DO

  • Create a sketch that uses external media (sound or video). Some ideas are:
    • Make something responsive to microphone input.
    • Create a "photobooth" with augmented snapshots from a camera.
    • Create a "painting" system that colors pixels according to camera input.

Add Homework Here

Final Project Proposals

Final projects are a creative idea inspired by the concepts in this class. There is no requirement to use a particular aspect of programming. The idea and your enjoyment and interest in the idea is what counts. Some things to remember.

  1. Keeping things simple and small in scope is a plus. If your project idea is a big one, consider documenting the larger idea but implementing just a small piece of it.
  2. Also think about making a final project for a small audience, even one single person like a family member or friend. . . or yourself. This can be a good way to focus your idea and design process. "Generalizing" the idea can come later (or maybe not at all.)
  3. Final projects can be collaborations with anyone in any class.
  4. Final projects can be one part of a larger project integrated with Physical Computing or another class.

What you need to do now:

  1. Create a blog post documenting your idea for a final project and be prepared to present the idea in class. Your proposal should include the following (though feel free to use this as loose guidelines, you can document your idea however you see fit.)
  • Title
  • One sentence answering: "What is it?"
  • Written description of the idea.
    • How did you become interested in this idea?
    • What is the audience?
    • What questions do you have for the class (conceptual or technical)?
  • Visual material (images, videos, hand-drawn sketches etc.) that demonstrate your idea.
  • Links to any projects or references that inspired you.
  • Links to in progress sketches that demonstrates any part of the idea.
  • Questions for the class (conceptual or technical)
  1. Plan to present your idea in ~2-3 minutes leaving about 5 minutes for discussion.

Final Project Proposals

Link to Proposals

Week 12

Final Project Documentation

  • Final project presentations are Wedneday, December 2nd. In class presentations will be approximately 7 minutes each, I will be strict about the time to keep everything fair. We also need 10 minutes at the end to do course evaluations.
  • Please post your final project documentation to a web page (blog post is fine) and link next to your name below. This is due Friday, December 18.
  • It's up to you to figure out how to best document your project, here are some loose guidelines if you aren't sure what to include.
    • Title
    • Brief written description - Include some background; why you built it.
    • Visual Documentation: sketch running online, images, video, etc.
    • References: links to any related projects, code samples, etc.
    • Source code (please cite any sources in the code comments)

Schedule and links