Effects

Add shadows, reflections, and post-processing effects.

Shadow

{
  "settings": {
    "shadow": {
      "enabled": true,
      "opacity": 0.5,
      "blur": 5,
      "scale": 10,
      "distance": 1,
      "positionY": -0.5,
      "color": "#000000"
    }
  }
}

Shadow Properties

Property	Type	Range	Description
enabled	boolean	-	Enable shadow
opacity	number	0 - 1	Shadow opacity
blur	number	0 - 10	Shadow blur amount
scale	number	1 - 50	Shadow size
distance	number	0 - 5	Shadow distance from device
positionY	number	-2 - 0	Shadow vertical position
color	string	Hex	Shadow color

Reflection

{
  "settings": {
    "reflection": {
      "enabled": true,
      "intensity": 1.0,
      "roughness": 0.5,
      "metalness": 0.5,
      "screenRoughness": 0.1,
      "screenReflectivity": 0.5,
      "screenEmissive": 1.0,
      "environment": "studio"
    }
  }
}

Reflection Properties

Property	Type	Range	Description
enabled	boolean	-	Enable reflections
intensity	number	0 - 2	Overall reflection intensity
roughness	number	0 - 1	Device surface roughness
metalness	number	0 - 1	Device metalness
screenRoughness	number	0 - 1	Screen surface roughness
screenReflectivity	number	0 - 1	Screen reflectivity
screenEmissive	number	0 - 2	Screen brightness/glow
environment	string	-	Environment map name

Post-Processing

{
  "settings": {
    "postProcessing": {
      "bloom": true,
      "bloomIntensity": 0.3,
      "vignette": true,
      "vignetteIntensity": 0.4,
      "grain": true,
      "grainIntensity": 0.1
    }
  }
}

Post-Processing Properties

Property	Type	Range	Description
bloom	boolean	-	Enable bloom/glow effect
bloomIntensity	number	0 - 1	Bloom strength
vignette	boolean	-	Enable vignette (darkened edges)
vignetteIntensity	number	0 - 1	Vignette strength
grain	boolean	-	Enable film grain
grainIntensity	number	0 - 1	Grain amount

Examples

Subtle Shadow

{
  "settings": {
    "shadow": {
      "enabled": true,
      "opacity": 0.3,
      "blur": 8
    }
  }
}

Cinematic Look

{
  "settings": {
    "postProcessing": {
      "bloom": true,
      "bloomIntensity": 0.2,
      "vignette": true,
      "vignetteIntensity": 0.5,
      "grain": true,
      "grainIntensity": 0.05
    }
  }
}

Glossy Device

{
  "settings": {
    "reflection": {
      "enabled": true,
      "intensity": 1.5,
      "roughness": 0.1,
      "metalness": 0.8
    }
  }
}