One down, two to go. This is one of my final projects for my interactive studio. I figured I'd go ahead and document it before I forgot about it. Plus, I just got back a 42x30" poster and it's perty.
So this graph is the updated version of its little cousin. I just changed the proportions of the graph so it would fit in a traditional poster size (and was therefore cheaper to print), let the highest bars display off the chart so it was easier to see the smaller number of mentions, and rewrote the code a tad so it would display the number of mentions and the war mentioned on the actual bar as well as printing the months at the bottom of the print. I also removed the random opacity. It added a nice texture but it didn't really add any information. Instead, I made all the bars slightly transparent so it was possible to see other wars underneath it. Here's a close-up.
Yay! One project down. Two more to complete.
Labels: api, data visualization, interactive, print, processing, programming, school workWednesday, April 29, 2009 // 0 Comments
For our Interaction Scripting Studio final project, I am focusing on my data visualizations of war, films, media and probably death counts (or maybe just make puppy viewer work dynamically).
So tons of websites with large amounts of data are making APIs available to developers for application development and visualization (Flickr, Twitter, NYTimes, pretty much any next gen website, etc). There are also sites that provide visualization tools for you and encourage experimentation. The NYTimes Viz Lab is one of them. They provide a set number of datasets and a number of tools (like Wordle) and let people go crazy. Google also provides tons of tools including their Google Visualization API. IBM's Many Eyes takes it a step further and allows users to add their own data sets.
It's an exciting field and it makes my brain buzz. However, I found this article in SEED Magazine Getting Past the Pie Chart that talks about how, perhaps, the data viz explosion may not be making data any clearer. There is also a very real danger of making causal connections where none exist.
Still, data visualization done well can be a combination of design and science which becomes beautiful, meaningful and inspiring. I absolutely love it. Here is a screenshot of a project I'm working on. It's the further refinement of one of my original circle graphs. What I'd like to do is see if I can add some more stats to the graph without overloading it. In my head that means tilting the graph back to add a third dimension and perhaps including casualty data vertically from each war (and if I can find it, for each movie the films are about).
Labels: api, data visualization, graphs, interactive, processing, programming, school workSaturday, April 18, 2009 // 0 Comments
The end of the semester is three weeks away. I have a game to program, a visualization or two to finish and a research paper and business plan to write. Yet for whatever reason, all I could do today was start making this thing. (For some context, Miss Trish is the name of a stray dog with a crazy under bite that I saw in a book called Street Dogs.)
So this is a tag search for the word "pomeranian" on Flickr. I wrote a Processing program that takes tag input, creates a url, sends it, parses the response and then spits out an html page. I spend such an inordinate amount of time looking at cute (and ridiculous) dogs on the internet that I thought it might be fun to see how many dogs I could handle looking at at once. A lot, apparently.
Anyway, it's in progress. If I have time I will figure out a way to add a web interface (so, perhaps if someone wants to look at tons of pictures of butterflies on flickr all at once, they need not go through page after page of scrollin'). Also, the images should probably link to the flickr page instead of just the image. Either way, I should probably get back to my school work, even though it doesn't involve hundreds of pictures of puppies.
Labels: api, flickr, interactive, processing, programmingSaturday, April 11, 2009 // 0 Comments
More data visualizations. These all use Processing. The data I eventually was able to scrape includes info from IMDB and the NYTimes API. The first one pulls total instances of the wars as keywords in NYTimes articles from 1981-2008 (they don't have anything indexed before 1981 at the moment), then it spits it out into a long bar chart. The large orange spike is the beginning of the Gulf War. The subsequent yellow/orange spikes are 9/11 and the brownish color spike is the start of the Iraq War. I have no idea what the strange WWII peak around 10/95 is.
This visualization uses both the NYTimes Articles API and the scraping from IMDB. It is a comparison between word counts in the NYTimes abstracts where WWII is a keyword and the descriptions on IMDB of WWII movies. I haven't actually looked at this that much as I just wrote it today (this stuff is all due tomorrow) but the first thing I notice is that in "reality" (the NYTimes articles) Japan features much larger than Germany whereas in the movie descriptions, Germany shows up more often.
These last two visualizations are of the same data set. The most popular movies about wars (according to IMDB) from 1900-2008.
Labels: data visualization, interactive, processing, programming, school workThursday, March 12, 2009 // 0 Comments
So for one of my interactive studios (all my posts start off this way, I should think of something different to say, perhaps involving time vampires) we're doing small programs using sound and choice. Our first two projects were to make a soundboard out of a comic and make an instrument. I predictably pulled something from TekkonKinkreet and added some Buddhist chanting. Then I made some virtual bongos. Painfully simple projects as my brain needed a bit of a Processing break. We have four more projects using sound and choice to create for next Thursday and I've started slowly on a couple with ideas for more in the works.
One is an applet that takes words and plays sounds with them. I'm not entirely sure how I want this to work, or, more correctly, I know exactly what I want this to do, I just don't entirely know how to make it work so that it does what I want it to do. I've spent most of the day poking around with code (making sure a sample plays once instead of starting and restarting over and over again, attempting to split apart tracks so that I can make the applet color-sensitive, etc) and I accidentally ended up with a simple Processing music visualizer. It looks something like this:
I can't really use this for class because it doesn't involve any choice (and I think it'd be kind of lame to slap a text field on here and say "you can change the music" and have *that* be the choice aspect) but I think it's a lovely accident. Much thanks to my awesome classmate Bryan Bindloss, who provided the fantastic samples I've been playing with all day.
Labels: interactive, processing, programming, school workSunday, March 1, 2009 // 1 Comments
For my interactive studio, we're working on data visualizations. As we're only going over it for a couple of weeks, we're doing really basic stuff. I've decided to look at movie data and so far I've got a couple of draft visualizations.
This first one is a simple plot of the top 20 most popular movies (according to IMDB) from various genres over time. Though the colors are too dark, the graph shows basic trends like the popularity of Westerns in the 60s or how more recent animation is much more popular than, say, Fantasia.
I also took the roles of Oscar winning actresses and actors and grouped them into categories so we could see media-based gender roles. This is a much looser interpretation of the data (my categories are obviously somewhat arbitrary based on what I saw as trends) but it's an interesting study nonetheless. As these sketches are done in Processing they take a bit of time for me and my non-programmer brain so I've only fully completed the actresses sketch but here's a screenshot.
This assignment is quite a bit of fun and while the math and programming for most of the beautiful visualizations at places like Visual Complexity is beyond me at the moment, I hope to do some hand drawings, some more intricate illustrations in Illustrator and perhaps a physical data representation of some sort.
Labels: data visualization, interactive, school workThursday, February 26, 2009 // 0 Comments
So we presented our final versions of our clocks yesterday. I was up for most of the week trying to complete them all, unfortunately I did not finish the rain clock or the atomic clock, but there's a bunch of other stuff that's up now (though it requires serious polishing). Here are some of my favorites.
Petri dish clock from below ended up being new petri dish clock above. Sound/cat clock doesn't display the time visually other than responding to a heartbeat sample that beats every second and speeds up over the course of the minute. Every 15 minutes a sample of my cat's voice plays and at the top of the hour, an alarm with a scary cat sound plus a chime that rings the hours goes off.
Block clock just spins. The hours are the darkest, the minutes are the lighter brown (in 5 minute chunks) and the white smaller blocks are the seconds.
Storm clock is the least clock-like of my clocks. Rain falls according to the milliseconds but it's impossible to read. At the top of every minute lightning flashes and thunder booms to tell the hour. Growing up in the South, thunderstorms were common. We'd count "one-one thousand, two-one thousand" after every lightning flash to see how far away the storm was. My storm clock takes that memory and applies it telling the time. If you count the seconds after the lightning hits, the thunder will sound at the correct hour.
Labels: interactive, school workFriday, February 13, 2009 // 0 Comments
I did not document any of my work from last semester online. Or it is all online, but at the CCA Graduate Design website where it doesn't really stand out in any particular way. We did a lot of work, however, and at some point (in the fantastic future where free time is cheaper and more readily available than, say, cat fur in my apartment) I will post them. In the meantime, here are a couple of screenshots of some of my Processing work last semester. I have all the pieces posted on the CCA dada website but I don't imagine that will stick around once I graduate plus I hate tildes.
(UPDATE: I've posted all of my sketches on my own site. Visit my interactive portfolio pages for a link to the sketches and more screenshots.)
Labels: interactive, processing, school workMonday, February 2, 2009 // 0 Comments
We're working with Processing in both of my interactive studios right now so my brain wants to combine the projects. For my early class we're still working on clocks. For my later class, we're still working on valentines. I seem to have combined the camera code from the valentines with the clock dot code I was working on for the clocks and we have camera clock! The computer vision aspect of this clock is more or less superfluous. The squares rotate and lighten with each second of the clock but it isn't really that spectacular of a *thing*. I like the dots clock part (the clock below reads 01:03:43 for example) but I didn't create that either. I just copied it from a clock I saw over the holidays.
Primarily, I've been trying to condense my code. Processing has hour(), minute(), second() functions which makes it super easy to read from the computer's system clock but there is such a huge repetition of functions that there must clearly be a way for an actual programmer (as opposed to me, the hack) to write this code in a few lines instead of 500. Go object oriented programming for designers who are like, "huh?!"
Also, say hello to my straight forward analog clock. After spending WAY too much time trying to figure out the math for getting Processing to read milliseconds from the system clock instead of from when the program started, I just imported a java library that does all that for me and so I got a smooth second hand. Of course, I kept seeing a petri-dish in my old clock so I took out the numbers, turned the face hands (lines) into points and drew a bunch of random dots on the background. Petri-dish clock enabled!
And yeah, at some point, whenever I have the portfolio part of this site done, I will upload actual working applets instead of these screenshots. The programs are way more fun when they're bouncing and moving around.
Labels: interactive, processing, school work // 0 Comments
So for one of our projects for one of my interaction design classes, we have to design and program valentine's widget thingys. Sounds fine to me. I've been sketching over the past couple of days and cobbling together code and so far I have a semi-working, proto-basic sound recorder that displays different red waves based on sound input. Here's a screenshot.
I have to figure out how to take a screen shot and email it (will probably write the image to a buffer and send that) but so far, so fun!
Also, here's a screen shot of the LED clock I programmed for last week. Look at those lovely plotted out vector points that took me 2 hours to plot.
And finally, final fake Furby. The eyelids and beak-simulators move, in a way. Most people in my class did paper prototypes but I think that the physicality of Furby would not translate in paper.
Labels: furby, interactive, processing, programming, school workWednesday, January 28, 2009 // 0 Comments
"Her astonishingly small face is capable of creating exotic facial expressions."
So I first heard the phrase "uncanny valley" on that episode of 30 Rock. Or no. I had heard it years before back when I was one or two notches higher on the dork scale, but I forgot about it. Having to prototype Furby has me thinking about robots for whatever reason and while Japan's fake girl robots aren't news I hadn't ever really looked at them before, nor read the hilarious yet kind of unsettling copy.
Labels: interactiveSunday, January 25, 2009 // 0 Comments
I had my first week of class last week. It was mostly syllabus-going over, classmate-greeting, self-introducing business. It's strange to suddenly be constantly, insanely busy during the school term after being constantly non-busy during break. I already miss puttering around the apartment, organizing random things, playing video games and the unabashed slacking I've been doing for the past month.
One of my first assignments is to program a series of clocks using Processing (as it says "an open source programming language and environment for people who want to program images, animation, and interactions"). It is not a super-complicated language and is fairly easy to pick up just through the web and a book or two.
But enough about that. Clocks are rad. The first two clocks we need to program are supposed to mimic an analog clock and a digital LED clock. The rest can be whatever kinds of clocks we feel like making. I want to make a clock based on the movements of my cat throughout the day. I have no idea what that means graphically yet but I find it entertaining to think of a clock that meows everyday at 5am. I also want to make a clock out of sound. It could start by following the clock tower, church bell, bong pattern, but I also want the sound itself to be expressive of time passing. At certain intervals the sounds themselves get more frantic (i.e., right before the top of the hour, the sound is crazy and/or right before midnight). Something like that.
I've finished a working version of the LED clock and I can say plotting all the points for each section of the numbers is the most tedious thing I've done in a long time. So, just in case someone ever needs to script LEDs and doesn't feel like figuring out all the points on a graph, here are the coordinates for an 8 (which should cover all numbers 0-9). It's not the prettiest but I think you could make the middle bar a little thinner and it wouldn't be so clunky.
TOP HALF, LEFT SIDE
TOP HALF, RIGHT SIDE
BOTTOM HALF, LEFT SIDE
BOTTOM HALF, RIGHT SIDE
Also of note, links for inspiration: 24 Creative Modern Clock Designs and Tokyoflash Japan.
Labels: coordinates, interactive, led, processing, programming, school workMonday, January 19, 2009 // 0 Comments
For one of my interaction classes I was assigned the task of recreating a Furby as a prototype. It is supposed to be a low fidelity prototype, meaning either a paper prototype or something using the Wizard of Oz method (i.e., a big glowing head that is supposed to be the product but is actually faked by a tiny dude behind a curtain pulling some levers).
The prototype needs to retain and express the qualities of the original so it is recognizable to someone who is familiar with the original product or it imparts a similar experience to someone who isn't familiar.
What I've done is taken an old pikachu doll, duct-taped it up so that it is Furby size (Pikachu was too fat), pasted on fake eyes and mouth parts and I'm using super janky, low-fi sticks and paper to mimic moving eyelids and beak parts. I still have yet to complete the external covering but I seem to have gotten the pre-basic mechanics to work. (I say pre-basic because I have little to no current experience working in three dimensions. I took 2 semesters of advanced calculus and a semester of programming (for scientists) to avoid taking physics in undergrad.) I also have to create a presentation and diagram of the interactions in the next 24 hours. Ack, the work!
Cat to janky duct tape Furby prototype ratio
Labels: interactive, school workSunday, January 18, 2009 // 0 Comments
BACK TO THE TOP
The quote at the top of this page is from the March 25, 1893 Newark Daily Advocate via Nick de la Mare..
• Data Visualization
• School Work
• January 2009
• February 2009
• March 2009
• April 2009
• June 2009
• August 2009
• September 2009
• October 2009
• December 2009
• January 2010
• February 2010
• March 2010