How to have a tilt shift effect on a 3D scene

Questions
1

Hello,

I’m curious if ThreeJS has an easy way to have the tilt shift photography effect on a 3D scene? And if not how would you approach the making of the effect or maybe guide me to an example where they’re using it on a 3D scene.

Thanks.

2

Hi. Three.js does provide the building blocks for recreating the effect

  • start with a narrow-focus set up of the depth-of-field shader from martin upitis, already implemented as a regular three.js example
  • the effect is usually best perceived with a near-orthographic field-of-view perspective camera, you can aproach this setting the .fov parameter
  • optionally you can try to pop-up colors by increasing a saturation pass with a post-process shader

You can share your advances so we can help you further. Good luck!

2 Likes