I had a lot of fun working on my big Flash project for the end of semester. Because I was focusing more on getting back into doing things with code, a lot of love went into implementing a few tricks that you may not have noticed at first glance. Here are a few:
The logo
Skateboarding is commonly associated with an aesthetic that’s somewhat DIY and grungy, and it seemed the best way to add some grunge to something with a digital feel would be to make it look like it was malfunctioning. To that end, I set several of the LCD elements in the logo (20 of them, actually) to flicker at random intervals.
I used Arrays, Timers, and some Math functions to get this going – though thanks to FITC I now hear that Vectors are the way to go rather than Arrays, for performance reasons. Looking forward to trying that out.
The MP3 player
Pulls in MP3 files via an XML playlist and generates the equalizer visualizations live. The dots on the graph increase in size with amplitude, and if you really crank the volume, they go off the charts. That big dot near the top doubles as both playlist position and volume indicator – the higher it is, the louder the volume, and the more to the right it is, the further through the playlist we are.
For this part, I familiarized myself with XML, SoundMixer, SoundTransform, and ByteArray.
The preloader
Cuing off the MP3 player, I went with another 10×10 grid for the preloader. Believe it or not, this is probably the part I’m happiest with. Every time the loading progress hits a new percentage point, a randomly selected square of the grid is filled with a square of random opacity.
As it fills – if your connection is slow enough – the visitor is drawn in to interpret and guess at what image might appear. Because of the varying opacity and order of dots being filled, the visitor sees a different order each time.
I did have a spot of trouble getting this done – when you’re trying to fill a finite space such as this using randomized criteria you need an algorithm that prevents collisions – i.e. you don’t want to put a square where one has previously been put. So I had to keep track of what had already been kept, then if and when a collision occurred, tell the computer to keep looking for a new spot. Enter recursion, right? No problem. But my first attempt brought Flash to its knees, so I had to go back to pen and paper, devise a new algorithm, et voila! It worked beautifully.
I’m very much enjoying bringing together these two worlds of mine – code and visuals – and I’m looking forward to doing it more. Summer reading is Creative Code by John Maeda.
Posts