Recently Parsons has launched a much needed improved site. I worked on a Flash application of the site which serves as an exploratory navigation for potential students to discover programs they may be interested in based on floating keywords. The design was done by Dexter Miranda and supervised by Isa Gouverneur, both part of the Parsons creative team. The navigation also visually makes connections between programs or schools that share keywords. This is slightly confusing to explain, so take a look at the navigation itself.
Tweetcatcha uses the New York Times Timeswire API to load the latest news for the last 24 hours. We use the title and the url of the articles on nytimes.com to search through Twitter. There is a lot of data, so please be patient with the load time. Searching through Twitter for url was made much easier by using BackTweets, a service of BackType. I wrote a AS3 class to wrap the BackTweets API, more information in this blog post. The tweets are arranged around in the center based on the time difference from the article posting to the time the tweet was created. So, if a tweet was posted less than an hour after the article, then it would be very close to the inner most ring, and if it was posted 20 or more hours later, then it would be closer to the last ring, (there are 24 rings, one for each hour in the day). Bruce Drummond and I collaborated on this project.
MAMP is a great tool for running servers locally, however, when you must export that site you have been developing locally and your database is huge, then you could have some problems with PHPMyAdmin.
One solution is to use terminal. The reason that I am writing this post is so that I can reference it in the future. It always takes me more that 10 minutes to figure this out since I never use terminal, so I thought someone else may find this of some use.
I understand there are probably many ways to do this, but this works for me, so… try out the code below.
This project utilizes flocking and Craig Reynold’s boids to move about a 3D environment. The boids circle around sphere and a repulsion force from inside of the sphere is applied to the Boids using the space bar. There is some perlin noise that is applied to them as well. The tails are generated based on some code by Robert Hodgin. The camera movement is handled by a nicely bundled class called Camera by Tobias Jewson.
This project responds to audio, as well as, video. I am not very good with audio or the terms used, so excuse me if this doesn’t make any sense. But I do know that the audio analysis code by Zach Lieberman uses FFT Analysis. Each tentacle is assigned a certain range of audio, if there are more tentacles, the ranges are shorter. The loudness in each range corresponds to the outward force from the center that each tentacle feels. If all of the channels are really loud, then the tentacles form an image that looks similar to a star fish.
The tentacles attempt to attach themselves to people who enter the frame, it can be either live or recorded video, in this case it is recorded. The sorting of the points on the contour was a tad tricky since they are not returned in order of x, y values, so the a point in one frame might have a completely different index on the next, not to mention that the number of points changes from frame to frame. The tentacles follow the user around and react to audio, look out Dr. Octopus.
For a current project collaborator Bruce Drummond and I needed to search Twitter for urls. We attempted to parse the bit.ly truncated urls by expanding them, but that proved inefficient. Since each user truncates urls differently, we could not simply truncate the url and then search for that bit.ly. We also contacted bit.ly to determine if a list of short urls could be returned for a long url, but after a condescending response, we decided to look elsewhere.
After some searching on the web, we found BackTweets. This is an extension of BackType that stores data for various social media. BackTweets proved most effective at handling url searches. We could pass in the url that we were searching for and BackTweets would return a list of tweets. It is also possible to pass in something shorter, like nytimes.com and it will return tweets that have that inside the url. For example, http://www.nytimes.com/2009/11/13/world/asia/13eikenberry.html?_r=1&hp, could be returned when providing nytimes.com as a query term.
Earlier in this project we wrote a class in AS3 for Flash, and thought that someone may benefit from it.
ofxTweenzor is a addon for OpenFrameworks that allows for tweening values over time. I began developing the addon because I started using OF on the iPhone and I wanted a little transition here and there. I started programming and someone mentioned ofxTween. I checked it out and turns out that it runs on poco events and right now poco is not included in the iPhone build. Being a Flash developer, I wanted some tweens and I wanted to get familiar with events in C++ and how they could be handled, which took a little getting used to. I learned a great deal about pointers and events in C++, and I still have a way to go.
Hopefully someone will find this useful, and any questions or comments are welcome.
The easing equations are from both Robert Penner and the Tweener class by Zeh Fernando, Nate Chatellier and Arthur Debert.
For my data visualization class, we were asked to visualize the New York Times Newswire API. This is a quick demo mapping the hour of the day to the number of ny times posts for each category. You can select single categories by clicking on the buttons and you can click and drag horizontally to rotate the center graphic. One of my first attempts at using papervision and it went pretty smooth, but the coordinate system is the opposite to that of the native 3D engine in Flash, OpenFrameworks and Processing. Not that I didn’t understand it, just not used to it.
These images are generated by evaluating and interpreting the 1997 music video “Mo Money Mo Problems” from the first disc of the Notorious B.I.G. album, Life After Death. The algorithm detects edges in the image and attempts to trace motion from frame to frame, using the initial frame as their starting point. The output is rendered as a vector image, the curves represent the motion. The points represent the pixels detected in the edge, their size determined by the distance from their previous location, the further, the larger the circle. The color and location of the points are determined by the corresponding pixel in that frame. The bright colored track suits worn by Puff Daddy and Mase in the dark backgrounds make for good tracking and nice color combinations. The only imagery added manually is the background color. You can check out some more renders in the Mo Money Mo Problems photoset on flickr.
Puff Daddy Dancing with Mase in the black tunnel.
Much of the detail in the above image is lost. So here is a detail.
I was also able to print this render out at 24″ x 36″ on photo paper on a large format printer. I am intrigued by the zoomed in close up and may get that printed as well.
I have been getting back into OpenFrameworks lately and I have been using the OF vector library for all of the recent animations that I have been doing. I thought that I should give the AS3 Vector3D library a go. There are some limited, but useful functions built in. Making the move over to vector animation has made my coded animations more streamlined, if you are thinking about making the switch, consider the following code samples :
Without Vectors
var locX = 0, locY = 0;
var loc2X = 100;
var loc2Y = 50;
var dx = loc2X – locX;
var dy = loc2Y – locY;
var dist = Math.sqrt( (dx * dx) + (dy * dy) );
Utilizing Vectors
var loc:Vector3D = new Vector3D();
var loc2:Vector3D = new Vector3D(100, 50);
var dist2 = (loc2.subtract( loc )).length;
// or //
var dist3 = Vector3D.distance( loc, loc2 );
Today I gave a presentache / lecture to an incoming Parsons class about Object Oriented Programming. The class is focused on Processing and contains students of varying backgrounds and skill-sets. I put together a simple demo to help with the understanding.
This is the demo that came out of the example.
A custom Ball class is created to handle all of the attributes and actions of each ball. During the setup, 100 balls are created, each given a random location and speed. The individual balls change colors based on their y positions, the closer to the top, the more red, the closer to the bottom, the more green.
Download the source here. Feel free to post any inquiries.
