Archive for October, 2008

Flickorama – OpenFlux PlexiGlass Flickr Mashup

Quick Flickr mashup using OpenFlux 3D PlexiGlass to browse fractal pictures. Actually, you can search for any pics with this app :)

Here is the Flickorama with sample layouts:

Cover Flow:

Roller Coaster:

Time Machine:

There are more layouts available and a larger photo preview feature that is currently in beta.

With Flickorama you can search public Flickr photos by tags, paginate through the returned photo sets, or sit back and let the sequential or random photo slideshow flickr on your screen.

I’ve been sitting on this prototype since Ryan Campbell put together that OpenFlux 3D PlexiGlass cards example. When I first saw it, I knew that’s the UI to use for some fun Flickr pics browsing.

First, I wired it to Flickr to demo some alternative image gallery display options to one of my clients. I ended up using Ely Greenfield’s Display Shelf component for that project.

However, I was so far along into wiring OpenFlux PlexiGlass to Flickr that I have decided to spend some extra time to add photo set pagination and cleanup the UI a bit.

You can access it on my new site:

I’ll be hosting my most interesting prototypes and demos on that site from now on.

I should also give credits to Juan Sanchez for the shadow Flex UI theme I’ve used for this application and Brian Kent for the really cool AEnigma Scrawl font he created. I’ve seen it used in quite a few Flex apps lately.

Interactive BitmapData Perlin Noise Explorer

If you’d like to create your own Perlin Noise music vis or try to produce programmatic natural-looking textures, here is an interactive BitmapData Perlin Noise Explorer for you to play with:

I’ll post some sample configurations for the clouds, sea, smoke, wood grain and brushed steal textures later.

Perlin Noise Music Vis

Here is a fun Perlin noise music vis with The X-Ecutioners “cuttin’ it up, scratchin’ it… They sounded so good they made everybody dance. (Check it out.)” — Like This:

(Click on the visualization to change color channels)

Doesn’t it look like a crowd dancing in the club? Well, close enough. Here is the real deal:

Noise Test

While attempting to build a sample video wall for my Flash video test drive, for loading all the video previews in a 9×9 grid I wanted to simulate that good old “no signal” image and noise you get from a tube.

Here is a sample:

Click on the image and mouse over the noise animation to hear that “no signal” sound effect. You can also View Source and download the tiny bit of code that generates this effect.

As I am sure you already know it’s generated with BitmapData.noise() function.

A while back I came across Keith Peters’s NoiseExplorer that was really handy to pick the color channel settings and other parameters of the bitmapData.noise() function to get that no signal image. The only part that nagged me was to click on the Render button every time I changed noise function parameters.

This sparked my interest in bitmapdata api and prompted me to explore Flex HSlider UI control capabilities, timers and sound effects. Before I knew it, I got too carried away and created an Interactive BitmapData Noise Explorer of my own to test those Flex features and find some use for Doug’s ResizableWrapper container at the time.

Read the rest of this entry »

Simple Flex Music Player

It’s been a while since my first post. I parted with Pathfinder Dev a few weeks ago, switched this blog to self-hosting, and currently looking for new opportunities.

While I am looking for a new gig, I’ll try to revive this blog by remixing and publishing some old toys I’ve prototyped to get my Flex chops together.

Here is the one that did not make the cut for that internal AIR Flair presentation. I had to play that jungle Bamboo Banga beat in WMP11.

(Click on the image to play and download sample code)

That’s my take on simple mp3 player in Flex. Click on that visualization to see some bars jump.

Most of the heavy lifting is done by the components from the flex community listed below.

Read the rest of this entry »