Code And Beats: Music Powered Twitter Wall

I mentioned in a previous post that I was going to Code And Beats. I could’ve worked on work work. I could’ve worked on non-work work. But I didn’t do either. Instead, I experimented with some visual effects in Flash — combining video, audio input, and tweets.

By 2am, here’s what I had come up with! (I’ll post the code soon eventually)

Code & Beats: Music Powered Twitter Wall from Brian Shaler on Vimeo.

Fun stuff! I’m interested in seeing this event come to Phoenix. We just need to get the organizer (+developer +designer +DJ) Avi to fly out and then round up a few local DJs with some good electro material. Un tiss un tiss un tiss…

Also, here’s a separate pic I snapped of the Twitter wall:

Code And Beats: Music Powered Twitter Wall
Code And Beats: Music Powered Twitter Wall

I should’ve put together a video showing more of the background dancing clips. Some of them were pretty excellent!

Code and Beats

I found out yesterday that there’s going to be a rad event called “Code & Beats.” If it turns out to be as fun as it sounds, I’ll probably lobby to bring it to Phoenix.

Here’s the basic premise:

A party celebrating the art of programming through performance. A handful of hardcore coders from the city’s hottest startups will work in the center of a pounding dance floor to a musical journey of electro beats.

Some additional details: it sounds like the “hardcore coders” will be facing the dance floor, with external monitors mirroring their laptops and facing the dance floor. There may also be one or more projectors involved.

I’m going to experiment with some new visual Flash-based stuff, and will try to include the room’s music, a webcam, and/or tweets as inputs!

It should be exciting! Also, I’m probably going to open-source everything I write at the event and post it somewhere like GitHub.

Heat Maps in Flash

Two and a half years ago, I rendered a large heat map representing almost 100,000 Digg users and the 300,000 friendships between them. I used PHP/GD2 to render the image and it took quite a while to render. Due to the difficulty of redrawing it, the heat map was never updated. It would have been great if the heat map reflected current information, but instead it got to live on as a snapshot taken in 2007.

Since then, I’ve wondered about ways of rendering heat maps on the fly, ideally using the visitor’s CPU. Finally, in November, I was able to hack together a highly optimized Flash application that produces pretty awesome-looking heat maps (if I do say so myself) within a second or two.

Check it out

I’m afraid I’m going to have to be a bit of a tease for now, and not dive into too much technical detail. This project is part of a series of data visualizations that utilize a specific, lesser-known feature in Flash.

Flash 10 Beta – 3D Twitter Visualization

Adobe released a beta of their next version of Flash Player. Flash 10 introduces quite a few new features, including native 3D support. There is no patch for Flash CS3 in order to create Flash 10 content. Developers can download the latest version of the Adobe Flex 3.0 SDK, and compile Flash 10 SWFs from the command line. Because Flash CS3 is not involved in this process, you cannot use an FLA (You compile directly from AS files).

Twitter Cloudy
(If you don’t have Flash 10, it will show you a video and links to Flash 10)

While you could make 3D objects in Flash 8 and 9 (using Papervision3D), it would still require quite a bit of time to learn how to use Papervision3D, and utilize a 3D modeling program. I created the spinning globe from scratch with about 40 lines of code.

I can’t wait until I get a chance to do more 3D stuff with Flash 10!

Actionscript 3: Faster Integer Math – Bitwise Operators

Several months ago, I stumbled upon a great resource for bitwise operators in AS3. Bitwise math is available in many languages, but this one looks at it from an AS3 perspective.

Since I first discovered that page, I have thought to pull it up a few times and searched Google for it (racking my brain to choose the right key words). By posting it here, I will not only be sharing it with you, but effectively archiving the link where I can access it quickly.

Check it out

It isn’t a tutorial or explanation of bitwise math. It is a list of common operations, paired with their decimal math counterparts. The best part about it is that the author details the change in performance between the two techniques (when used in AS3).

Great stuff!

If you have any bitwise math resource pages you would like to share, post them in the comments.