The shader in this example uses depth information from a p5.Framebuffer to apply a blur. On a real camera, objects appear blurred if they are closer or farther than the lens’s focus. This simulates that effect. First, the sketch renders five spheres to the framebuffer. Then, it renders the framebuffer to the canvas using the blur shader.
Related Examples
![](/_astro/11_3D-00_Geometries-thumbnail.CIGxWPlb_ZrLzA7.webp)
No alt text
Geometries
Draw 3D shapes, including a custom model.
![](/_astro/11_3D-01_Custom_Geometry-thumbnail.hOI_CIjS_kGC1q.webp)
No alt text
Custom Geometry
Generate a 3D shape programmatically.
![](/_astro/11_3D-02_Materials-thumbnail.BH6mGApZ_Z1y8uVN.webp)
No alt text
Materials
Change 3D objects' color, texture, and how they respond to light.
![](/_astro/11_3D-03_Orbit_Control-thumbnail.-zEVdjrU_Zua1gI.webp)
No alt text
Orbit Control
Control the camera with the mouse.
![](/_astro/11_3D-04_Filter_Shader-thumbnail.BSzfvPSy_Z7FNLg.webp)
No alt text
Filter Shader
Manipulate imagery with a shader.
![](/_astro/11_3D-05_Adjusting_Positions_With_A_Shader-thumbnail.D6XjOyN8_1AWOoU.webp)
No alt text
Adjusting Positions with a Shader
Use a shader to adjust shape vertices.
![](/_astro/11_3D-06_Framebuffer_Blur-thumbnail.Ck8s9IeK_Z1r2Q1P.webp)
No alt text
Framebuffer Blur
Simulate a camera's depth of field.