Skip to content

Homework Dano Wednesday

Jump to bottom Edit New page
ats421 edited this page Dec 11, 2014 · 252 revisions

Documentation

You will not receive a passing grade for the ICM without good documentation of your final project. You will be glad you did this. At a minimum you need a image and a description. Better is video and some description of your journey. A link to your code is required but you might want to make that separate if it is on your portfolio blog.

Final Project Documentation

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 here.
  3. Post documentation. Something visual + your code. e.g. Blog post with code, screenshots, video, or a web version of your sketch here.
  4. Place a copy of your sketch folder in our class' Google Drive Folder.

Final Project Proposals

Please link your name below to your final project proposal. It's up to you to figure out how to best demonstrate your idea, but I suggest you include the following:

###Get Laptop and phone use out of your system before class. This is a strict lids down session.

  • Title
  • One sentence "What is it"?
  • How did you become interested in it?
  • Who is the audience?
  • Something visual for us to look at in class: drawings, images, video, etc.
  • A sample Processing sketch that demonstrates a first step
  • References: links to related projects, code samples, etc.
  • Questions for the class (conceptual or technical)
  • If you are collaborating, please consolidate the list below!
  • Plan to present your idea in ~5 minutes leaving about 5 minutes for discussion.
  • Here are some sample final project proposals.

Proposals

Week 8

Develop a project that uses an external data source. For this project you should document your work in a blog post (and link below) in addition to creating the Processing sketch. You can present in class using your laptop or put your sketch into dropbox. Here are some ideas:

  • Create a game that saves a high score list to a text file.
  • Track personal data over the course of a few days (exercise, sleep, computer use, eating, etc.). Enter the data into a CSV file and visualize.
  • Count word frequencies in two different text sources (i.e. two different authors, two different newspapers, two different political speeches) and visualize the results.
  • Visualize weather data

Questions

  • What does a computer call its father?
  • Jia -- If many values in one column (4) of a table are the same, but their corresponding values in another column (5) are different. What is the best way to count the numbers of the same values in (4), visualize the same values in (4) only once, and still be able to visualize all values in (5)?
  • Melissa -- How can you load many .txt files, join the lines and split the tokens, while still keeping each files string separate?

Post Your Homework Here:

Week 7

Develop a project that uses images and pixels.

PREPARE FOR NEXT WEEK

Questions

  • Why oh why?

Post Your Homework Here:

Week 6

Using arrays, write a program that creates multiple instances of an object (feel free to use an object you developed previously or create something new). Here is an example you can use as a model. You should probably stop here, but here are some additional (more difficult) possibilities.

  • Experiment with the resizable nature of ArrayLists. Can you add objects one at a time? Remove them after a certain amount of time or when they leave the screen? Can objects from on ArrayList trigger the birth of other objects? See this example.
  • Create an object that stores the history of its own path. This might be a drawing program where you keep a history of mouse locations in an ArrayList or a shape that moves around the screen autonomously and draws its own trail. Can you have an ArrayList of these objects (each of which tracks its own ArrayList?). Example 1 Example 2
  • Once you have an array of objects, you can have each object check every other object with a nested loop. Try incorporating this idea into a sketch by having objects react to intersecting with others. Example demonstrated in class
  • A String is like an array of characters. Can you create a sketch that plays with text by looping through the "array" inside a String. See: charAt(). We'll get into this in more detail during the data week.
  • A PImage contains an array of pixels. Experiment with image processing by looping through all the pixel colors of an image. This tutorial will help you get started. We'll get into this in more detail next week.
  • Create a system that involves a two dimensional grid. Use a 2D array to store the data of this system. This tutorial will help you get started.

PREPARE FOR NEXT WEEK

Post Your Homework Here:

Post Your Question Here:

  • Greg - One of my arrays (the planets) keeps on deleting the previous one when I'm birthing a new planet. You can see this on level 2 when I try to have a second planet appear on the frame at the same time. I can't seem to find the solution and I don't understand why the if statement I use is birthing new planets that interfere with the current ones.
  • Magdalena - I was wondering if we could go through dfferent types of movement in the array? I have problems to code in the move() function the x and y coordinates combined with speed, direction, turning, +/-/* etc in order to get a certain movement. I tried to look up different types like natural movement, swarms, floating movement, fluid, chopped, around turning, straight, etc.. (actually I am working on flying around leaves) on the open processing webside, but as usual it seems that it really depends on the structure of you code.. that would be great! Ok, I guess that#s rather a request than a question..
  • Magdalena - How can I tell the array that it only draws the objects on a certain location, within a given fraem/circle/etc, or only on an image?

Week 5

  • READ AND WATCH:

  • DO:

    • Design a sketch in an object-oriented fashion. Try to eliminate all code from the main tab (setup() and draw()) except for the core requirements (size(), background(), etc.) and calls to objects.
      • For example: Consider building a particle system. A particle system can be used to simulate: rain, snow, fireworks, explosions, smoke, etc. For this week, you would create a Particle class to describe a single particle and try to get two particles on the screen using separate variables. (Then next week, after we learn arrays, you would visualize hundreds (or thousands) of particles on the screen.)
    • E-mail the code for a class to your assigned partner on the wiki. You'll get one from them too. Try incorporating the class sent to you into your sketch. Write some thoughts about this process on your blog -- Did anything not work? Could you follow your partner's code? Were comments helpful? (If you are feeling saucy, you could try to use github for this collaboration.)
    • Post a question about this week's assignment or content below.

Object Swap:

  • Joseph Mango -- Jiashan
  • Brett Stiller Ava Huang
  • Ashley Cortez -- Hugo
  • Melissa Felderman Gabriel Andrade
  • Crystal Brusch Andy Sahlstrom
  • Francisco Ramirez -- Greg Housset
  • Magdalena -- Nikolaj

Questions

  • Melissa: Is there a way to change the background with a mousepressed or keypressed function? Also, I wanted the ellipses to pick up the pizel data of the point at which they were created but couldn't figure out the logic, so I went with mouseX, mouseY. Is there a way to do that?
  • Why do I keep getting null pointer exception?
  • Greg Housset - I have three question, no need to address them all:
  1. The sketch tends to considerably slow down after it's been open for a little
  2. Sometimes hitmode (the boolean that makes the planet start blinking and fall) does not revert back properly and affects the following planet in the array.
  3. Lastly, I can't seem to get my score to increment simply by 1 when you hit the planet... it behaves very inconsistently.
  • Gabriel - I was trying to use dist between two objects variables called the same, how i can refer them both without declaring as global variables? or it is able to return 2 variables from a function?
  • Sometimes when I export the sketch to the website using javascript, some functions might be missing (but it works at Java mode), why is that? Andy- I have a idifficult time understanding how classes and arrays work. I am able to make a demonstrative code, but it's still more than a little confusing.
  • Nikolaj - How do you rotate objects, so you can manage a specific direction they will point to?
  • magdalena: 3 questions: * How to deal with a moving vbezierVertex()? What am I doing with the 'z' coordinate in the constructor arguments of the automnFall function? It's clear that the position for 'x' and 'y' is width and height, but how about 'z' ?
  1. When I initialize in the class my color, I can't use 'random 'for the different RGB positions of my color. Did I something wrong or got I something wrong basically? Is it because it's not an 'int'?
  2. How can I define in the constructor arguments in the function that the leaves have random color in a scale between for exp. yellow, orange and red?

Add Your Homework

Week 4

  • READ AND WATCH:

  • DO: The goal for this week is to start organizing your code into modular and reusable parts. We'll start with functions (before moving to objects next week). Work individually or in pairs (no pairs will be assigned this week.) Some exercise ideas for you to pick from:

  • Take a previous assignment with code in setup() and draw() and break everything out into separate function.
  • Take the idea for a design and break it out into its own function. Add parameters to the function so the design can be drawn differently based on the selected parameters. Draw three or more instances of the design on the screen to show the differences possible by changing the parameters. Here is an example
  • Advanced: Create a design from a recursive function. How could you animate or change this design over time? Can you make it interactive or have it controlled with random(), sin(), or noise()? Here are some samples.
  • ASK QUESTIONS: Contribute at least 1 question below. (Name optional.)

Questions | Examples

  • What is so great about objects? Seems like a lot of work to hide complexity. My program is not that complex.
  • Crystal - If I'm trying to get two objects to interact with each other and they both share variables, how does that work if there are no global variables? How can I access the local variable in one object to use in another object?
  • Ava - Any easier way to create piles of objects sharing the same class? It’s kind of troublesome to call it again and again like d1.drawDot(); d2.drawDot(); d3.drawDot();d4.drawDot()...
  • Jia - What is a good way to restructure a messy program after it has been coded? Would it be better to start over from scratch? *Gabriel - How can I use a variable of one function in another? without this being a global variable *Melissa - I was having trouble resetting the ball speed when resuming gameStat 0 without breaking the bounce. I'm not sure why it broke it and I tried to do it several different ways. I would like to go over how to do that.
  • Ashley - I need a play by play of collision functions, can we do this?

Add Your Homework

Week 3

  • READ AND WATCH:

  • DO:

    • Homework: In general this week, you should work with rule-based animation, motion, and interaction. You can use the ideas below or invent your own assignment. Start by working in pairs according to the wiki. Can you divide an idea into two parts and combine those parts? Can you swap sketches and riff of of your partner's work? You can post together or break off and complete the assignment individually. Some ideas:
      • Recreate Pong. Remember, start by thinking about all of the small elements you need in order to make the game and only combine them into a larger program when you have each part working.
      • Continue your GUI elements from in class this week. Examples on Github here.
      • Create an algorithmic design with simple parameters. A good model is 10PRINT based on the examples provided here. There is also a nice discussion on the Processing forum. You can also read the 10 Print book online as a PDF.
      • Consider tying the above two together and have a GUI control your 10PRINT visualization or motion sketch.
      • Invent your own exercise related to animation and interaction.

    -Work Shoulder To Shoulder for a While (you can continue to work together on a single project if you choose).

    • Melissa and Brett
    • Nikolaj and Crystal
    • Andy and Jia
    • Francisco and Greg
    • Ashley: and Magdalena
    • Ava and Joe
    • Hugo and Gabriel
    • Post a question below about this week's content or assignment. Here are some examples of how to ask or phrase questions!

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

Questions | Examples

  • Ashley - Is there a way to turn a PImage into an object to manipulate? (Such as an ellipse)
  • Jia - What is the best way to create a pattern of shapes where each shape rotates around its center? What is the best way to create a pattern of elements that continuously flow in the background?
  • Brett - Combining elements of different sketches doesn't appear as simple as just 'cutting and pasting'. Could you go over the rules of hierarchy in 'draw'?
  • Crystal - Can I affect generated shapes in a particular area? If I use a for loop, none of those generated shapes have an individual assignment that I can refer to so I can manipulate their movement independent of all the other shapes. Can I assign variables in a for loop too?
  • Ava - What can I do if I want something to change in a certain condition but don't want it to be replaced when it's no longer included in the conditional statement?
  • Gabriel - How can i put a delay to a specific part of the code?
  • Melissa - How do I make a game over sreen before the game restarts?

Add Your Homework

Week 2

  • READ AND WATCH:

  • DO: -Work Shoulder To Shoulder for a While (you can continue to work together on a single project if you choose).

  • Melissa and Joe

  • Magdalena and Nikolaj

  • Andy and Crystal

  • Ava and Greg

  • Ashley and Brett

  • Gabriel and Francisco

  • Jiashan and Hugo

    • Create a animated application. Start over from scratch and build something with a very simple design. Focus on the logic of variables and avoid using hard-coded values. Play with mouseX and mouseY. Start by working in pairs (according to list below). You can post together or break off and complete the assignment individually. If you are stuck, here are some ideas.
      • Experiment with motion using a single simple shape. Can you create a randomly jittering "nervous" square? (Here is a sample). A circle that spirals around the window? How could user interaction affect the shape's motion?
      • Use random() to create a painting system. Here are some examples.
    • Post a question below about this week's content or assignment. Here are some examples of how to ask or phrase questions!

Add your homework here:

Post your question here:

  • Your name (optional) -- Your question
  • Brett - How can you restrict randomization, so that say, only shades of Blue are used? How would you mobilize an entire shape made from different components?
  • Ashley - In "Learning Processing" Shiffman talk about changing a float to an int (in regards to random), what does this actually do? Is one just moving at a more clearly defined path? (one that can contain locations with decimal points?) What would be an example of a time when something like this becomes necessary to use?
  • Gabriel - I had trouble running my program in java.script using the CHORD mode in the arc reference, is there a similar mode to use arc in java.script?
  • Ava - A question about while function in the video. I'm confused about the two initial value given in the code. One is at the very top, and the other one is in void draw (which is call reset?) Why we have to initial it twice?
  • Jia - My programs takes some time to load. How to make it faster? How can I draw an ellipse over a trail of another ellipse? (how can I still show the ball in a different color over the stroke?)
  • Melissa - How can I make my shapes fade over time?
  • Andy - In my Pong Solo game, I was interested in adding points for the player each time they volley 3 times. I'd also like the loop to start over three times until a "game over" appears, whereupon the player could start over and their score could be saved.
    Also, I have a difficult time using the proper language to describe my Processing queries and would be interested in any advice in regards to how I can word my questions appropriately and properly.
  • Nikolaj: How do you increment a value if the mouse is pressed at a certain place?

Week 1

Questions | Examples

  • Your question here.

Hugo - I understand thats better to declare the variables at the top of you code. Bit Is there any difference in efficiency to assigning the values ( x = 100 ) of variables at the end or the beginning of the code?

Joe - How do you make something repeat? Like a repeating pattern.

Brett - Is there an easier method of drawing complex shapes (like stars)? And how can I duplicate a shape and place it elsewhere? Potentially even resize it? Can an image made elsewhere (Illustrator) be imported?

Ashley - Is there a way to create things in a ratio sense against a background? That is, instead of picking a pointed position for one object, is there a way to code it in such a way that if the background changes the item remains the same relative position and size?

Melissa - How do I make ameba-like shapes? Does everything need to be broken down into simple quads, triangles, and ellipses?

Crystal - How can I create a static triangle using the theta, sin, cos features?

Gabriel- I wanted to know if we could play with opacity with alpha in background colors so if at the last of the code we put background (R,G,B,alpha) we can create an atmosphere, like water?

Ava - I really don't get the idea of curve/bezier. For now I'm just trying random values and adjusting it with the result on canvas. I can't expect the outcome when trying to give the value. I guess I'm missing somewhere in between anchor/control point and the slant things.

Jia (Jiashan) - What are some math formulas we can use in Processing to create more organic looking patterns? What's the best way to create gradience?

Nikolaj - In what kind of professions is processing currently used? E.g. Webdesign, visual design. Any good examples out there?

Add Your Homework

Processing on the Web - Javascript

  • JavaScript mode in Processing is a nice magic trick that allows you to run a Processing sketch in a web browser. However, there are lots of reasons why it may not work from obvious ones like no third party libraries to less obvious ones like no functions with the same name as a variable. To make matters worse, some of Processing's 2.0 API is not implemented for JS. Use JavaScript mode cautiously and don't let it get in the way of the important stuff like just making what you want to make. Instructions for JavaScript Mode
  • Just to make things even more confusing, we are also teaching something at ITP called p5.js. If you take Commlab: Network Media, you'll encounter this. p5.js is a JavaScript library that starts with the original goal of Processing, to make coding accessible for artists, designers, educators, and beginners, and reinterprets this for today’s web. p5.js is a framework you want to use if you want to write your code natively in JS whereas processing.js is something that will translate your code behind the scenes for you.
Add a custom footer
Add a custom sidebar
Clone this wiki locally