Depth of Field Effect

Does anyone know if there is a way to make a Depth of Field Effect with this engine? And if so how? Any tutorials on the subject? Any help is greatly appreciated. Thanks.

Be blessed.

For what kind of game?

Jump'n'Run?

Use parallax-value of layers to simulate the parallax-scrolling (less then 100 for background, more then 100 for foreground).

Blur-effect to unsharpen back- or foreground or use an suitably graphic (effects need more ressources, i think).

Gosh your right. I should have mentioned the style of game we're creating. Sorry about that. We're making a first person exploration game, similar in style to a Seek-n-Find Adventure Game. What I'm trying to discover on behalf of my Game Designer is if the camera in this engine has any Depth of Field effects where say normally all is in focus until the player finds an object and decides to inspect it close up with his/her hand. We would like to show the object in question in the hand of the playable character close up (large on screen) were as the hand comes up causing the hand to come into sharp focus the background image goes out of focus, becoming blurred.

Is there such a controllable effect in the engine or does it have to be faked? Thanks for all your help out there.

You'd have to fake it using a horizontal and vertical blur per layer. Performance may take a hit and you'll need WebGL support, so best to test it out before committing.

Depth of field is a 3D concept, I'm not sure how you would want to incorporate it in 2D.

Howerver using webgl effects you could blur a layer which you could change through events.

thehen: If we can animate the vertical and horizontal values on the individual layers to give a pseudo impression of Depth of Field that's fine with us. That would definitely work. My only question is can we animate the layers? And would such animation survive the wrapping process for mobile?

jesblood yep you can do that. I'd really recommend testing on hardware from the offset for such an effect as it would most likely be intensive. WebGL effects (for blur) are supported through the CocoonJS wrapper.

Excellent! Thanks guys! Really appreciate the help. You all are awesome!

My designer will be totally thrilled.