→ Click here or the image above for the demo.
→ View the source code.
This was a just for fun idea that popped into my head yesterday. I’m always trying to find programmatic ways to add to the appeal of some of my 3D effects. What better way to jazz up some 3D objects than to view them as though you’re wasted?!
I’ve got a lot of irons in the fire lately, so this one was quick and dirty. Basically I create an extra View3D in which to render the “blurred” objects. I take a snapshot of this view (50 in fact), overlay it on a separate background View3D, and use TweenLite to gradually fade the opacity of each snapshot.
In the end you get this pretty neat motion blur effect on your 3D objects. There’s a lot more that could be added to this to spice it up. If I had more time to devote to it I would add a BlurFilter toggle, which makes the motion blur look better but affects performance. Other settings you could vary to alter the effect are:
- The speed of the objects
- The number of snapshots taken
- How fast the snapshots fade
- The scale of the fading snapshots
and I’m sure there’s more. Try it out. You could give your scenes a truly inebriated look by using only one View3D. By doing this you’ll motion blur the entire viewable scene. Maybe I’ll strap on some Away3D beer goggles in the future and give that a shot! Let me know if you beat me to it.
Tony you rock !
Very innovative !
Hey!
I’m not sure I’m understanding correctly what you’ve done, but are you not just drawing the view to a bitmap data that is being displayed behind the view? Doing that every frame, and also fading it (using a color transform) towards transparent each frame should give roughly the same effect without the need for two views, and without keeping more than two display objects (View3D, Bitmap/Shape in background) and one bitmap data in memory. Should give a more stable memory footprint (less work for the GC) and generally better performance.
Anyway, the end result is looking cool and it seems to perform pretty good! Keep rocking Away!
Cheers
/R
The reason I use 2 views in this case is so that I can blur specific objects(the orbs) and not the entire scene. The starfield in this case isn’t meant to blur.
The single bitmap redraw definitely sounds like a better way to handle the blur, ill have to use that. Oddly enough the poor scaling performance works for my more recent drunk simulator demo because it mimics delay of reflexes.
So are you going to add this as a shell shocked effect in BattleCell?
Hey,
I just found my way back to this post by chance and realized you had replied to my comment.
The thing with motion blur is that as far as I’ve always assumed, the real-life effect derives from the “update frequency” of the receiving media (be it film, a CCD sensor or the retina of your eye) not being high enough to capture the scene in a single time-state (whatever that would be in an analog world) per capture.
Similarly, drawing the view to a bitmap (mimicking the media) semi-transparently every frame would render objects that stand near-still as sharp automatically, while moving objects are blurred. So there should be no need to have separate views. Ideally at least.
I think that there are generally two ways of doing motion blur in motion graphics (not real-time): Either draw several frames backwards and forwards from the target frame and composit them into the target frame, or render a “vector pass” where each pixel of the output image contains data about how the object depicted in that pixel is moving. The latter is of course reasonably impossible in Flash and the former would be too time-consuming for most scenes. So I think what you’re doing (perhaps optimizing it per my suggestion provided that quality does not suffer) is probably the way to go.
Re Battle-cell; I was actually not involved in that in any way, so you’re gonna have to tickle Fabrice, David or Rob with your suggestions instead.
Cheers
/R