bevy/examples/3d
Patrick Walton df31b808c3
Implement fast depth of field as a postprocessing effect. (#13009)
This commit implements the [depth of field] effect, simulating the blur
of objects out of focus of the virtual lens. Either the [hexagonal
bokeh] effect or a faster Gaussian blur may be used. In both cases, the
implementation is a simple separable two-pass convolution. This is not
the most physically-accurate real-time bokeh technique that exists;
Unreal Engine has [a more accurate implementation] of "cinematic depth
of field" from 2018. However, it's simple, and most engines provide
something similar as a fast option, often called "mobile" depth of
field.

The general approach is outlined in [a blog post from 2017]. We take
advantage of the fact that both Gaussian blurs and hexagonal bokeh blurs
are *separable*. This means that their 2D kernels can be reduced to a
small number of 1D kernels applied one after another, asymptotically
reducing the amount of work that has to be done. Gaussian blurs can be
accomplished by blurring horizontally and then vertically, while
hexagonal bokeh blurs can be done with a vertical blur plus a diagonal
blur, plus two diagonal blurs. In both cases, only two passes are
needed. Bokeh requires the first pass to have a second render target and
requires two subpasses in the second pass, which decreases its
performance relative to the Gaussian blur.

The bokeh blur is generally more aesthetically pleasing than the
Gaussian blur, as it simulates the effect of a camera more accurately.
The shape of the bokeh circles are determined by the number of blades of
the aperture. In our case, we use a hexagon, which is usually considered
specific to lower-quality cameras. (This is a downside of the fast
hexagon approach compared to the higher-quality approaches.) The blur
amount is generally specified by the [f-number], which we use to compute
the focal length from the film size and FOV. By default, we simulate
standard cinematic cameras of f/1 and [Super 35]. The developer can
customize these values as desired.

A new example has been added to demonstrate depth of field. It allows
customization of the mode (Gaussian vs. bokeh), focal distance and
f-numbers. The test scene is inspired by a [blog post on depth of field
in Unity]; however, the effect is implemented in a completely different
way from that blog post, and all the assets (textures, etc.) are
original.

Bokeh depth of field:
![Screenshot 2024-04-17
152535](https://github.com/bevyengine/bevy/assets/157897/702f0008-1c8a-4cf3-b077-4110f8c46584)

Gaussian depth of field:
![Screenshot 2024-04-17
152542](https://github.com/bevyengine/bevy/assets/157897/f4ece47a-520e-4483-a92d-f4fa760795d3)

No depth of field:
![Screenshot 2024-04-17
152547](https://github.com/bevyengine/bevy/assets/157897/9444e6aa-fcae-446c-b66b-89469f1a1325)

[depth of field]: https://en.wikipedia.org/wiki/Depth_of_field

[hexagonal bokeh]:
https://colinbarrebrisebois.com/2017/04/18/hexagonal-bokeh-blur-revisited/

[a more accurate implementation]:
https://epicgames.ent.box.com/s/s86j70iamxvsuu6j35pilypficznec04

[a blog post from 2017]:
https://colinbarrebrisebois.com/2017/04/18/hexagonal-bokeh-blur-revisited/

[f-number]: https://en.wikipedia.org/wiki/F-number

[Super 35]: https://en.wikipedia.org/wiki/Super_35

[blog post on depth of field in Unity]:
https://catlikecoding.com/unity/tutorials/advanced-rendering/depth-of-field/

## Changelog

### Added

* A depth of field postprocessing effect is now available, to simulate
objects being out of focus of the camera. To use it, add
`DepthOfFieldSettings` to an entity containing a `Camera3d` component.

---------

Co-authored-by: Alice Cecile <alice.i.cecile@gmail.com>
Co-authored-by: Bram Buurlage <brambuurlage@gmail.com>
2024-05-13 18:23:56 +00:00
..
3d_scene.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
3d_shapes.rs Add meshing for Cone (#11820) 2024-05-13 18:00:59 +00:00
3d_viewport_to_world.rs Use Dir3 for local axis methods in GlobalTransform (#13264) 2024-05-06 20:52:05 +00:00
animated_material.rs Add hue traits (#12399) 2024-03-22 00:36:46 +00:00
anti_aliasing.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
atmospheric_fog.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
auto_exposure.rs Implement Auto Exposure plugin (#12792) 2024-05-03 17:45:17 +00:00
blend_modes.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
bloom_3d.rs Improve Bloom 3D lighting (#11981) 2024-03-07 15:20:38 +00:00
clearcoat.rs Implement clearcoat per the Filament and the KHR_materials_clearcoat specifications. (#13031) 2024-05-05 22:57:05 +00:00
color_grading.rs Fix CI error on new color grading example (#13180) 2024-05-02 13:40:45 +00:00
deferred_rendering.rs Implement GPU frustum culling. (#12889) 2024-04-28 12:50:00 +00:00
depth_of_field.rs Implement fast depth of field as a postprocessing effect. (#13009) 2024-05-13 18:23:56 +00:00
fog.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
generate_custom_mesh.rs Clarify comment about camera coordinate system (#13056) 2024-04-23 14:58:28 +00:00
irradiance_volumes.rs separating finite and infinite 3d planes (#12426) 2024-04-18 14:13:22 +00:00
lighting.rs Implement fast depth of field as a postprocessing effect. (#13009) 2024-05-13 18:23:56 +00:00
lightmaps.rs fix example lightmaps after color migration (#12265) 2024-03-03 21:36:11 +00:00
lines.rs Intern mesh vertex buffer layouts so that we don't have to compare them over and over. (#12216) 2024-03-01 20:56:21 +00:00
load_gltf.rs New Exposure and Lighting Defaults (and calibrate examples) (#11868) 2024-02-15 20:42:48 +00:00
meshlet.rs Example setup for tooling (#13088) 2024-05-02 20:10:09 +00:00
motion_blur.rs Fix motion blur on wasm (#13099) 2024-05-12 21:03:36 +00:00
orthographic.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
parallax_mapping.rs Move close_on_esc to bevy_dev_tools (#12855) 2024-04-03 01:29:06 +00:00
parenting.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
pbr.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
reflection_probes.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
render_to_texture.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
shadow_biases.rs Implement percentage-closer filtering (PCF) for point lights. (#12910) 2024-04-10 20:16:08 +00:00
shadow_caster_receiver.rs Remove redundant imports (#12817) 2024-04-01 19:59:08 +00:00
skybox.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
spherical_area_lights.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
split_screen.rs Fix "dark grey" colors becoming lighter in various examples (#12333) 2024-03-06 05:19:59 +00:00
spotlight.rs Adding explanation to seeded rng used in examples (#12593) 2024-03-26 19:40:18 +00:00
ssao.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
texture.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
tonemapping.rs Implement filmic color grading. (#13121) 2024-05-02 12:18:59 +00:00
transmission.rs Implement filmic color grading. (#13121) 2024-05-02 12:18:59 +00:00
transparency_3d.rs Implement alpha to coverage (A2C) support. (#12970) 2024-04-15 20:37:52 +00:00
two_passes.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
update_gltf_scene.rs New Exposure and Lighting Defaults (and calibrate examples) (#11868) 2024-02-15 20:42:48 +00:00
vertex_colors.rs Migrate from LegacyColor to bevy_color::Color (#12163) 2024-02-29 19:35:12 +00:00
visibility_range.rs Implement visibility ranges, also known as hierarchical levels of detail (HLODs). (#12916) 2024-05-03 00:11:35 +00:00
wireframe.rs Use WireframeColor to override global color (#13034) 2024-04-20 13:59:12 +00:00