rss Actionscript 3 Blog

Flash as background on web pages / stock selling

Flash  Flash 10  Actionscript 3  Pixel Bender 
20 November 2008

Doing some experimenting of putting a flash SWF as a background bellow HTML and creating a stock selling package for FlashDen.net.

After some initial trying and failing, I ended up with a minimalistic approach that seems to work on all major browsers. The solution is intuitive; absolutely positioning a DIV element (html based content) over a DIV containing the Flash SWF, and using the z-index css property to handle z-order. Export settings when building the SWF also needs to be correct. 

Having discovered FlashDen.Net, I decided to take my Recursive Zoomer and package it in the format FlashDen.Net requires. It literally took hours, as I had to make a preview package, preview image, and the purchase package. I set up a small mini site that will be used for previewing on their site, here it is:RecursiveZoomer Preview Site Thumbnail

Currently number 96 in their review queue.

UPDATE: After about 5 days in their review queue my package was rejected since they do not accept CS4 (Flash 10) stuff yet.

 1 comment(s)



Recursive Zoomer

Flash  Flash 10  Actionscript 3  Pixel Bender 
19 November 2008

Another small experiment from me. Reproducing in Pixel Bender that recursive zoomer effect from the Amiga demo scene ;-)

Use the mouse to change parameters on the interactive versions (mouse at the center for most stability). Configurable through a XML settings file.

 

Linear sampling :

Non-interactive fullscreen
Linear sampling :

Interactive in window mode
Nearest neighbor sampling :

Interactive in window mode
 

 0 comment(s)



Cloud and Landscape Generator

Flash  Flash 9  Actionscript 3  Fractals 
18 November 2008

Building my base of reusable code, I spent the last few days implementing, tweaking and making examples of a fractal based clound/landscape generator.

Since the Flash 10 penetration rate will need some time to get close to 100%, it's implemented for Flash 9. Everything is generated in code, so it would be perfect for projects with size limitations or when requiring to generate content dynamically.

 

Base algorithm:

Same result as Photoshop Filter menu -> Render -> Cloud ..
Landscape generator:

Heightmap and texture accessable independently (as 2D arrays or as Actionscript Sprite or Bitmap) ..
Dark (k)night psychedelic:

An example of use. Infintely looping 3 layer parallax scrolling using Flash blend modes, distance based bluring, and horizontal flip for faster init time and psychedelic effect.
Dark (k)night clean:

Similar but no filters or blend modes.
Clean blue skies:

 

 

 1 comment(s)



Pixel Bender test drive

Flash  Flash 10  Actionscript 3  Pixel Bender 
10 November 2008

Flash 10 is out, and delivers a host of new cool features. One in particular attracted my attention: Pixel Benders! It's time to make a minimalistic example and see how it all works.

It's just a simple test that combines the distances from the current pixel to 9 points that I move around using sin/cos in Flash. The Pixel Bender language v1.0 does not support loops, so they need to be unrolled unfortunatly.

<languageVersion : 1.0;>

kernel NewFilter

<

namespace : "PBTest";

vendor : "Dag Erlandsen";

version : 1;

description : "WobblySphere effect";

>

{

    parameter float2 imgsize

    <

        defaultValue : float2(512.0, 512.0);

        minValue : float2(0.0,0.0);

        maxValue : float2(4096.0,4096.0);

    >;

 

    parameter float ofs

    <

        defaultValue : float(5.0);

        minValue : float(0.0);

        maxValue : float(9.0);

    >;  

 

    parameter float2 sphere1;

    parameter float2 sphere2;

    parameter float2 sphere3;

    parameter float2 sphere4;

    parameter float2 sphere5;

    parameter float2 sphere6;

    parameter float2 sphere7;

    parameter float2 sphere8;

    parameter float2 sphere9;   

 

    output pixel4 dst;

 

    void evaluatePixel()

    {

        float2 pos = outCoord()/imgsize;

 

        float r1 = 1.-distance(pos,sphere1);    // [0,1]

        float r2 = 1.-distance(pos,sphere2);

        float r3 = 1.-distance(pos,sphere3);

        float r4 = 1.-distance(pos,sphere4);

        float r5 = 1.-distance(pos,sphere5);

        float r6 = 1.-distance(pos,sphere6);

        float r7 = 1.-distance(pos,sphere7);

        float r8 = 1.-distance(pos,sphere8);

        float r9 = 1.-distance(pos,sphere9);

 

 

        float r = r1+r2+r3+r4+r5+r6+r7+r8+r9 - ofs;

 

        dst = pixel4(r/2.,r,r/3.,1);

    }

}

 

 

 

There has been lots of confusion about the promised GPU acceleration in Flash Player 10. Tinic Uro ( http://kaourantin.net ) which seems to be part of the Adobe Flash development team, stated quite clearly in his May 20th blog post that GPU acceleration would not be enabled for Pixel Benders inside the Flash player, but given that his blog post was written half a year before release, and the Pixel Bender language is based on GLSL I had to give it a try and see for myself. So I exported the SWF with the wmode set to GPU in addition to the CPU ("no hardware acceleration") version.

Try the wmode="gpu" version:

GPU

Clearly Pixel Benders are not executed on the GPU inside Flash 10 player, but still delivers good performance as the JIT compiler produces a lot more efficient code than AS3.0, SIMD execution units on the CPU are utilized, and it is multithreaded by nature so it executes across all CPU cores. Testing the performance on a few different systems gives the following results (results from the Pixel Bender toolkit that runs the kernel on the GPU are also included):

  • Ultra low-end laptop: Celeron M 370 (single core Pentium M @1.5GHz) | 10 FPS | (100% CPU usage) Flash Player 10
  • Core 2 E6600 (dual core @ 2.4GHz) | 50 FPS | (90% CPU usage) Flash Player 10
  • Core 2 Q6600 (quad core @ 2.4GHz) | 90 FPS | (80% CPU usage) Flash Player 10
  • Geforce 7600GT | ~250 FPS | Pixel Bender Toolkit
  • Geforce 8800GTS | ~1200 FPS | Pixel Bender Toolkit

About 1200 FPS on a Geforce 8800GTS. Wow! What a shame this performance isn't available through Flash. The good news is Pixel Bender code is scaling really well across cores..

On a side note; Intel will release a "many core" chip called Larrabee, but it would probably only be accessable through simulated DirectX, OpenGL or a native API. See the August 08 paper. Realtime raytracing's getting closer! :-)

 3 comment(s)



Water Effect

Flash 9  Flash 10  Actionscript 3 
13 January 2009

Here's a water effect I made some time back.

 Flash 9 version :  Flash 10 version :
   

The only difference between the versions is I'm using typed arrays (Vector) in the Flash 10 version, which gives a nice performance boost.

It would run smoothly at higher resolutions if implemented as a Pixel Bender kernel, but I'm saving that for another day. :-)

 1 comment(s)