Away3D: SimpleShadow and Simple Shadows

SimpleShadow vs. shadow image (click for demo)

Click the above picture for a demo.  Right click on the demo to view source. Be sure to pay close attention to the apply() and positionPlane() methods of SimpleShadow.

You want to quickly add perspective and depth to a scene?  Look no further than shadows.  Shadows can make a minimalistic scene look fantastic.  Take a look at the website of Peter Kapelyan, one of the Away3D’s developers, and you’ll see what I mean.  Luckily, in Away3D they are easily available in more than one form.  Note, though, that shadows in Away3D are not actually created by light sources as this would be extermely expensive in terms of performance.

The above demo shows Away3D’s built-in SimpleShadow class (left) vs. a shadow created simply by adding a plane with a shadow BitmapMaterial (right).  Both are pretty easy to do, and both have their pros and cons:

SimpleShadow BitmapMaterial method
Built into Away3D X
Shadow conforms to object shape X (specific to object)
Fast Performance X
Shadow handles rotation X (only on one axis)
Handles translation X X
Handles scaling X (needs to be added)
Handles distance X (needs to be added)

“Shadow conforms to object shape” means that no matter what type of 3D object you are applying the SimpleShadow to, the shadow will accurately represent its overall shape.  With the BitmapMaterial method the shadow image must be created specifically for a particular 3D object to maintain an accurate representation.  So for a cube you need to create a square shadow image, for a sphere you need to create a circle shadow, and so on.

By “needs to be added” I mean that there’s no reason this functionality could not be added to the BitmapMaterial method. The reason its not there now is the reason that SimpleShadow won’t perform as well as the BitmapMaterial method. All those extra calculations and shadow redrawing are what will slow down a scene that has one too many SimpleShadows.

Peter Kapelyan's site, flashten.com, using SimpleShadow

Away3D MultiMario example using BitmapMaterial method

The clear winner might appear to be SimpleShadow, but if functionality always won over performance we wouldn’t have a need for Away3DLite.  In general, if you have a scene with only a few shadows and you would like those shadows to appear realistic relative to the object casting them, use SimpleShadow.  If performance is the main concern, like in a scene with many objects casting a shadow, the BitmapMaterial method would likely suit you best.

These are the 2 methods I’ve seen for creating shadows in Away3D, but there may be others.  If you find any, let me know.  Otherwise, enjoy!

UPDATE: I conversed with SimpleShadow’s creator, Fabrice Closier, and he was confused as to why I said SimpleShadow’s performance was slower.  I should clarify that SimpleShadow is slower only when the shadow needs to be redrawn frequently with the apply() method.  In a still scene or when the shadows in the scene do not often need to be redrawn, the performance should be very similar to that of the BitmapMaterial method.

5 Responses to “Away3D: SimpleShadow and Simple Shadows”

  1. Excellent post. As a recent papervision3d to away3d convert, I’ve been trying to find out as much as I can about away3d’s features. This looks great!

  2. [...] 还记得我之前的关于阴影的博客帖子展示给你的怎样很容易的增强你网站的3D感觉吗?现在你可以添加倒影到那里了。这些都是细微的改变,能给你的工作带来更完美的外观和感觉。玩的开心,并让我知道你是否用这种方法创建倒影,或者你有更好的实现。 分类: 未分类 标签: Away3D, flash 相关文章MovieClip的隐藏方法addFrameScriptFlash的帧数是从1开始的《Papervision3D Essentials》中文翻译参与撰写的《Flex 4 & Flash Builder 4 快速入门》正式发布 评论 (0) Trackbacks (0) 发表评论 Trackback [...]

  3. alinoe says:

    i agree with the post before :D

  4. Xiaoli Shen says:

    Really great tutorial! Used this technique in building my portfolio site, thanxxxxxxxx a lot!!

  5. [...] The real time 3D shadow is achieved using technique in this tutorial by Tony Lukasavage. [...]