{
 "slug": "depth-blur-layers",
 "name": "Depth of field in a flat animation",
 "category": "effect",
 "group": "Motion and finish",
 "media": [
  "video"
 ],
 "checked": "2026-11-13",
 "effect": "A coded scene looks shot on a camera.",
 "use_when": "Interface and product animations built from flat layers.",
 "phrase": "blur the layers behind and in front of the subject and keep the subject sharp",
 "pitfalls": [
  {
   "text": "It does not need a 3D tool: blurring the layers behind and in front of the subject does it in a 2D template.",
   "evidence": "practitioner",
   "source": "Director Chair notes on Motion graphics with Claude (Rourke Heath)"
  },
  {
   "text": "3D transforms can blur text in a browser renderer; render at double scale or keep text off the depth axis.",
   "evidence": "practitioner",
   "source": "Director Chair field notes on motion graphics"
  }
 ],
 "per_model": [],
 "external_refs": [],
 "licensed": [],
 "site_names": [],
 "related": [
  "shallow-focus",
  "bokeh"
 ],
 "rights": "own-work",
 "evidence": "practitioner",
 "source": {
  "url": null,
  "note": "Own words from Director Chair notes on Motion graphics with Claude (Rourke Heath) and Director Chair field notes on motion graphics"
 },
 "body": "",
 "shown_with": null,
 "url": "https://directorchair.ai/effect/depth-blur-layers",
 "markdown": "https://directorchair.ai/effect/depth-blur-layers.md",
 "prompts": {
  "chat": "Give me an edit brief: where it goes on the timeline, the exact settings, and what to check before export, for a short video about [your product], for [your audience]. The technique is depth of field in a flat animation: a coded scene looks shot on a camera. How it works: blur the layers behind and in front of the subject and keep the subject sharp. It is right for: interface and product animations built from flat layers. It does not need a 3D tool: blurring the layers behind and in front of the subject does it in a 2D template. 3D transforms can blur text in a browser renderer; render at double scale or keep text off the depth axis. Be concrete: numbers, seconds and settings, no theory. Ask me one question first if something you need is missing."
 },
 "licence": {
  "code": "MIT",
  "text": "CC BY 4.0",
  "third_party": "Clips and card texts inside a \"licensed\" block belong to their makers and are shown with permission and credit."
 }
}