Archive for the 'textures' Category

Avalanche Cam

Wednesday, October 8th, 2008

A few posts back I posted a programmatic sketch that resembles an abstract avalanche. Today I applied the same technique to my webcam and here is the result… you can click any of the below images to view the flash, but you’ll need a webcam … isight etc….



Click any of the above images to view the flash version

It looks very odd when it’s not in black and white, maybe I’ll post a color version in the near future….

Ceiling Scape

Tuesday, September 23rd, 2008

I've been enjoying Keith Peters recent linescapes...

I started messing with something inspired by those and this is what I ended up with this:





Click either of the above images to see the flash version

In the end, these look less like a terrain and more like the ceiling of an alien cathedral...

The basic code behind the texture is pretty simple. Here's a demo you can run in your flash timeline:

Actionscript:
  1. var canvas:BitmapData = new BitmapData(550,400,true, 0xFFFFFFFF);
  2. addChild(new Bitmap(canvas, "auto", true));
  3.  
  4. var wave:Shape = new Shape();
  5.  
  6. var g:Graphics = wave.graphics;
  7.  
  8. for (var j:int = 0; j<160; j++) {
  9.     g.clear();
  10.     g.beginFill(0xffffff,.5);
  11.     g.lineStyle(1,0x000000,.5);
  12.     for (var i:int = 0; i<400; i++) {
  13.         var xp:Number = i*2;
  14.         var yp:Number = 40 - 30 * Math.sin((i*j) * Math.PI/180 );
  15.         if (i == 0) {
  16.             g.moveTo(xp, yp);
  17.         } else {
  18.             g.lineTo(xp, yp);
  19.         }
  20.     }
  21.     g.lineTo(xp, 100);
  22.     g.lineTo(0,100);
  23.     wave.y += 2;
  24.     canvas.draw(wave, wave.transform.matrix);
  25. }

If you run the above code you'll end up with this:

Plastic Pixel Lighting

Sunday, September 21st, 2008

I started working on some fluid dynamics today and got sidetracked .... somehow it turned into this:



Click above image to see flash version

Here's the code:

Actionscript:
  1. stage.frameRate = 31;
  2. var canvas:BitmapData = new BitmapData(100,100,true,0xFFFFFFFF);
  3. addChild(new Bitmap(canvas, "auto", true));
  4. scaleX = 4;
  5. scaleY = 4;
  6.  
  7. addEventListener(Event.ENTER_FRAME, onLoop);
  8.  
  9. var inc:int = 0;
  10. var cols:Array = new Array();
  11. var num:int = 10000
  12.  
  13.  
  14. for (var i:int = 0; i<num; i++){
  15.     cols.push(0);
  16. }
  17.  
  18. Mouse.hide();
  19.  
  20. function onLoop(evt:Event):void {
  21.     inc = 0
  22.     for (i = 0; i<100; i++){
  23.         for (var j:int = 0; j<100; j++){
  24.             var d:Number(Math.atan2(mouseY - i, mouseX - j) / Math.PI * 180) <<8  ;
  25.             if (d> 255){
  26.                 d = 255-d;
  27.             }
  28.                        // remove this line to see something completely different
  29.             d = d% 255;
  30.             cols[inc] += ((d) - cols[inc])/32;
  31.            
  32.             canvas.setPixel(j, i, 0xFF000000 + (cols[inc]<<16) + (cols[inc]<<8) + cols[inc]) 
  33.             inc++;
  34.         }
  35.     }
  36. }

try removing line 29....

I've actually tried to do this kind of effect before ... it really has a subtle feel of lighting - like pushing on a thin layer of plastic. I plan on taking this a step or two further.