I missed most of the DeepSpace 9 series when it was first broadcast. I think I was in college and living in Europe part of the time. I’m just now getting around to watching it. Of course I can’t help but stare at the computer displays that they always have running in the background. The other night one of the patterns caught my eye and I thought I would try to recreate something like it. I never had any hope of reproducing the exact effect but I’m very happy with what I came up with. Mind you it isn’t really good for much but to look at. But that’s good enough for me.

The meat-and-potatoes of the design comes from these few lines:

[cc lang="actionscript3"]
var dent:Number = i * ( Math.PI * _position ) / count;
var r:int = Math.abs( Math.cos( dent ) ) * 255;
var b:int = Math.abs( Math.sin( dent ) ) * 255;
var color:uint = r << 16 | 0 << 8 | b;
s.graphics.beginFill( color, 1.0 );
s.graphics.drawRect( 	Math.sin( dent ) * 100,
				0,
				Math.sin( dent ) * _barW,
				_barH );
s.y = i * ( _barH + _gap );
[/cc]

Now that you see that it’s probably pretty obvious that it would produce the above pattern. . . . Yeah, me neither. I was just making shit up and that’s what came out.

The _position is a number that is continually incremented based on the value of the step slider and the count is the number of vertical lines that are being drawn.

And it may look like the bars are being positioned in the z-axis but they aren’t. That’s just an illusion created by the gradient colors. Again, slightly unexpected.

I think I’d be pretty frakking brilliant if I could have planned all this out before hand and gotten exactly what I was aiming for. But again, I pretty much just tossed in a Math.sin() here and Math.cos() there and blah-blah-blah got some pretty patterns. That must count for something, right? :)

Those slidy things
The sliders there are a little strange. I’m still working on them. It is just the Flex 4 VSlider that has been skinned and extended. I’m still getting my head around all this Flex 4 stuff but so far I love it. Essentially what I did, besides change the look, is I gave it an autoPilot property. So that if true it would continually vary it’s value all on it’s own. It does that by randomly picking a value and then when it reaches it then it picks another. If you want to stop it then click on the track. Then you can manually slide the thumb up/down. Some of the sliders are off by default because it jerks the hell out of the pattern when it changes just a little bit. Like the gap. Change the gap by just one and the pattern changes dramatically. So play around and see what you get. But don’t play too long. I know you have work to do. :)