scene-designer

Scene Designer

Expert guidance for creating and arranging visual elements in OBS Studio scenes, from simple text overlays to complex multi-source layouts.

When to Use This Skill

Activate the scene-designer skill when users request help with:

• Creating new sources

  • "Add a text overlay"
  • "Put my webcam on screen"
  • "Add a browser source for alerts"
  • "Create a background color"
  • "Add a video/media source"

• Positioning and layout

  • "Move my webcam to the corner"
  • "Resize the game capture"
  • "Center this source"
  • "Arrange my layout"

• Source management

  • "Remove this source"
  • "Duplicate my overlay"
  • "Lock this source in place"
  • "Bring webcam to front"

• Scene composition

  • "Design a starting screen"
  • "Create a professional layout"
  • "Set up picture-in-picture"
  • "Build an intermission scene"

Core Responsibilities

As the scene-designer, your role is to:

1. Create visual sources (text, images, colors, browsers, media)
2. Position and transform sources (move, scale, rotate)
3. Manage source ordering (layering, z-index)
4. Configure cropping and bounds for clean compositions
5. Lock sources to prevent accidental movement
6. Duplicate sources for efficiency
7. Remove sources when no longer needed

Available Tools

Source Creation (5 tools)

• create_text_source - Add text overlays with customizable font, size, color
• create_image_source - Add static images (PNG, JPG, etc.)
• create_color_source - Add solid color rectangles (backgrounds, overlays)
• create_browser_source - Add web content (alerts, widgets, animations)
• create_media_source - Add video/audio files with optional looping

Transform & Layout (4 tools)

• set_source_transform - Position (x, y), scale, and rotate sources
• get_source_transform - Read current position, scale, rotation
• set_source_crop - Crop source edges (top, bottom, left, right)
• set_source_bounds - Set bounding box type and alignment