A few days ago I saw a YouTube video of a demo from "Moppi Productions" made in 2004. I knew this demo for a long time already and have been watching it repeatedly for years now - so I thought it's about time to try to reproduce this effect in actionscript 3 as an exercise. Flash is far from being the optimal solution for creating this kind of effect so I found myself spending most of the time on improving the performance of my initial script and had to compromise a lot. Anyways, check out what I've come up with after a few days of tinkering in my free time.

http://jensfischer.us/demos/flowerMouse/
After the background image loaded, click on the stage, hold your mouse button and drag it around for a while...

http://jensfischer.us/demos/flowerMusic/
It might take a few seconds to load, but this version features the flower generator synced to music with the computeSpectrum function. It is starting to look pretty harmonic, but definitely needs some fine tuning so it goes together with the beat better. I'll probably upload an updated version once I find some time to work on it a bit more.

-
Related Link: http://www.youtube.com/watch?v=PlWv_rVcVDA



For my current project at firstborn, I had to create an animated ocean view with actionscript. My solution uses a combination of BitmapData, PerlinNoise and DisplacementMapFilter to apply this water effect to a static JPG-Image. Since the project is still ongoing, I didn't find the time yet to properly document the code so all I'm going to post here for now is the two actionscript functions, responsible for the effect you see above. The full class, and a little demonstration of which values you have to change to achieve certain effects will follow soon.

  1. private function initWaterFX():void {
  2. waterBmp = new BitmapData(waterData.water.@width, waterData.water.@height);
  3. pt = new Point(0,0);
  4. mpoint = new Point(0,0);
  5. waterDispl = new DisplacementMapFilter(waterBmp, mpoint, 1, 2, 10, 31, DisplacementMapFilterMode.IGNORE);
  6. filterList = new Array();
  7. filterList.push(waterDispl);
  8. addEventListener(Event.ENTER_FRAME, renderFx);
  9. }
  10.  
  11. private function renderFx(event:Event):void {
  12. offset.y = i/12;
  13. offset.x = i/24;
  14. waterBmp.perlinNoise(40, 6, 2, 50, true, false, 7, true, [offset]);
  15. water.filters = filterList;
  16. i++;
  17. }