Class 5: Code, Lecture Notes, plus Homework.

Code examples here.

Lecture Slides here.

Homework:

1) Data collection for midterm. Continue to gather your data! Add a category or a new method of collection.  A new way of collection you want to try? Now that you’ve been collecting for a week, is there another category of data you’d like to add?

2) Processing. Look at the three example sketches for this week, read through the comments and code until you have a good understanding of how it works.Email me if you have any questions. Then create the following two sketches:
a) See if you can modify myAgesArray.pde to include the names of your classmates below  the circle representing their ages. Make a string array and use the text() function in the loop to print the names.
b) Extend the functionality of the above program to load an external text file with your classmate’s names. You’ll have to create the text file, add it to the sketch, and use loadStrings( ) to get it into an array.

Reading on Arrays, if needed: Ch. 10 in Getting Started With Processing (pp141-150); Ch. 9 in Learning Processing (pp141-162)

Homework #3

Throughout the week(s), gather data about your daily life to visualize. You can collect any kind of data: moods, sleeping habits, coffee intake, music listened to, text messages, phone conversations, commute times, etc etc. You may want to gather two categories of data to compare and explore relationships. Some data may be available to you on a device you use already (iTunes, for example or your smartphone records). Some data you may have to collect in other ways. Try to be as diligent and precise as possible, and get  as much data as you possibly can (at least 30-40 data points, so you have something to work with). Get this data into some kind of manageable format– a spreadsheet or table. We won’t visualize it yet, just collect if for now. But start thinking about the questions you might want to answer with this data now.

For inspiration, see Nicolas Felton’s Annual Reports (NYT article for background). Also, look at Daytum, though don’t use it for collection, since it’s functionality is limited and you may not be able to extract your data from the software.

Homework, plus code from last class.

For homework this week, make a screen drawing in processing, and then convert it to a flexible function that takes any xpos and ypos and draws that item there. See the series of robot sketches we looked at in class for help, but you’ll have to convert hard-coded values for position into variables by doing a little math. For extra credit, make a another variable for size so the size of your drawing can also be altered.

Once you have defined this function, see if you can draw multiples of your drawing using a loop (see the robot loop examples and the albers examples for help here). Finally, try turning on or off some element such as color in your sketch using a boolean (see the triangle sketches for an example).

Email me with questions!

Sample code is here.

Homework #2

This week, two assignments:
1. Redesign one of the inaccurate data visualizations from the Design for Data Lecture. Think about the design pitfalls we discussed, of misleading scales, missing context, improper labeling, design variation vs. data variation, data distortion, and chart junk. Aim for accuracy, showing something that was previously unseen, making understanding the data easier for the viewer, and making a visualization that is aesthetically appealing. You can do this work in ANY FORM YOU CHOSE… analog (paper pen, objects, etc), digital (Photoshop or Illustrator), etc.

2. Experiment more with Processing. Make at least two new sketches. As a challenge, take the sketch called “ifSatementSwitchDir” and try to get the ball moving along the x axis as well as the y axis. I demonstrated this in class, and you can use the if statement we wrote as a model. IF this goes well, add additional balls that move differently than the first one. Feel free to play with the colors, speeds of the balls, and “drawing” with the ball’s motion (hint: don’t refresh the background each time through the draw loop). I’d also like you to add text to your sketches, see “superSimpleTextDisplay” for an example. And, in advance of next weeks lesson, take a look at the sketch entitled “superSimpleLoop”, which is heavily commented. We’ll talk about for loops in the next class. All code examples are here.