Post-Processing

Motion Blur

Motion Blur applies directional blurring to simulate movement. Supports linear, radial (zoom), and rotational blur types for different motion effects.

Example Configuration

motion-blur.json

{
  "effect": {
    "postProcesses": [
      {
        "id": "pp_blur",
        "type": "motion-blur",
        "enabled": true,
        "settings": {
          "type": "linear",
          "intensity": 0.3,
          "angle": 0,
          "samples": 16,
          "centerX": 0.5,
          "centerY": 0.5
        }
      }
    ]
  }
}

Settings

Property	Type	Range/Values	Default	Description
`type`	enum	linear, radial, rotational	linear	Blur type
`intensity`	number	0-2	0.3	Blur strength
`angle`	number	0-360	0	Blur direction (linear mode)
`samples`	number	4-48	16	Blur quality (higher = smoother)
`centerX`	number	0-1	0.5	Center X (radial/rotational)
`centerY`	number	0-1	0.5	Center Y (radial/rotational)

Blur Types

Type	Description
linear	Straight directional blur (uses angle parameter)
radial	Zoom blur radiating from center point
rotational	Spin blur rotating around center point

Suggested Presets

Style	Settings
Speed Lines	type: linear, intensity: 0.4, angle: 0
Zoom Effect	type: radial, intensity: 0.3, samples: 24
Spin	type: rotational, intensity: 0.2, samples: 32
Subtle Motion	type: linear, intensity: 0.1, angle: 45, samples: 12

API Usage

render-request.json

POST /api/v1/render
{
  "state": {
    "canvas": {
      "aspectRatio": "16:9",
      "backgroundColor": "#1a1a1a"
    },
    "layers": [...],
    "selectedLayerId": null,
    "effect": {
      "effectId": "none",
      "enabled": true,
      "postProcesses": [
        {
          "id": "pp_1",
          "type": "motion-blur",
          "enabled": true,
          "settings": {
            "type": "radial",
            "intensity": 0.4,
            "samples": 24,
            "centerX": 0.5,
            "centerY": 0.5
          }
        }
      ]
    }
  },
  "format": "png",
  "width": 1920,
  "height": 1080
}

Tips

Higher samples = smoother blur but more processing
Radial blur creates dramatic zoom/focus effects
Linear blur at 0° = horizontal, 90° = vertical
Adjust centerX/Y to move radial/rotational origin
Works great for action/movement emphasis