{
  "schemaVersion": "1.2",
  "kind": "template",
  "id": "beforeafterphoto-room",
  "variantId": "beforeafterphoto-room",
  "template": "beforeafterphoto",
  "title": "Before and After Photo",
  "url": "https://cliphou.se/templates/beforeafterphoto-room/",
  "editorUrl": "https://cliphou.se/#/v/beforeafterphoto-room",
  "templateVersion": 1,
  "latestTemplateVersion": 1,
  "sourceHash": "e2d12fd41f828168",
  "generation": {
    "model": "Claude Opus 5.5",
    "modelId": "claude-opus-5-5",
    "provider": "Anthropic",
    "effort": "medium"
  },
  "siteCommit": "1faf7b30639adf63cdb3201d08c74b3d2a697c1b",
  "license": "MIT-0",
  "licenseUrl": "https://cliphou.se/license/",
  "price": "Free",
  "attributionRequired": false,
  "format": {
    "aspectRatio": "16:9",
    "width": 1920,
    "height": 1080,
    "fps": 30,
    "durationInFrames": 240,
    "seconds": 8
  },
  "scenes": [
    {
      "type": "comparison",
      "label": "Comparison",
      "from": 0,
      "duration": 240,
      "roles": [
        "headline",
        "point1",
        "point2"
      ]
    },
    {
      "type": "byline",
      "label": "Byline",
      "from": 30,
      "duration": 210,
      "roles": [
        "brand"
      ]
    }
  ],
  "props": {
    "texts": {
      "headline": "Living room refresh",
      "point1": "Before",
      "point2": "After",
      "brand": "HOMELAB"
    },
    "theme": {
      "background": "#111214",
      "surface": "#2a2c31",
      "foreground": "#ffffff",
      "accent": "#f59e0b",
      "accent2": "#10b981"
    },
    "media": {
      "before": "roombefore",
      "after": "roomafter"
    }
  },
  "editableFields": {
    "texts": {
      "headline": {
        "label": "Headline",
        "maxLength": 24,
        "current": "Living room refresh"
      },
      "point1": {
        "label": "Point 1",
        "maxLength": 16,
        "current": "Before"
      },
      "point2": {
        "label": "Point 2",
        "maxLength": 16,
        "current": "After"
      },
      "brand": {
        "label": "Brand",
        "maxLength": 18,
        "current": "HOMELAB"
      }
    },
    "theme": {
      "background": {
        "format": "#RRGGBB",
        "current": "#111214"
      },
      "surface": {
        "format": "#RRGGBB",
        "current": "#2a2c31"
      },
      "foreground": {
        "format": "#RRGGBB",
        "current": "#ffffff"
      },
      "accent": {
        "format": "#RRGGBB",
        "current": "#f59e0b"
      },
      "accent2": {
        "format": "#RRGGBB",
        "current": "#10b981"
      }
    },
    "media": {
      "before": {
        "format": "Image ID",
        "options": [
          {
            "id": "roombefore",
            "label": "Room, before"
          },
          {
            "id": "roomafter",
            "label": "Room, after"
          },
          {
            "id": "yardbefore",
            "label": "Garden, before"
          },
          {
            "id": "yardafter",
            "label": "Garden, after"
          }
        ],
        "current": "roombefore"
      },
      "after": {
        "format": "Image ID",
        "options": [
          {
            "id": "roombefore",
            "label": "Room, before"
          },
          {
            "id": "roomafter",
            "label": "Room, after"
          },
          {
            "id": "yardbefore",
            "label": "Garden, before"
          },
          {
            "id": "yardafter",
            "label": "Garden, after"
          }
        ],
        "current": "roomafter"
      }
    }
  },
  "jsonSchema": {
    "$schema": "https://json-schema.org/draft/2020-12/schema",
    "type": "object",
    "properties": {
      "texts": {
        "type": "object",
        "properties": {
          "headline": {
            "type": "string",
            "minLength": 1,
            "maxLength": 24,
            "role": "headline"
          },
          "point1": {
            "type": "string",
            "minLength": 1,
            "maxLength": 16,
            "role": "point1"
          },
          "point2": {
            "type": "string",
            "minLength": 1,
            "maxLength": 16,
            "role": "point2"
          },
          "brand": {
            "type": "string",
            "minLength": 1,
            "maxLength": 18,
            "role": "brand"
          }
        },
        "required": [
          "headline",
          "point1",
          "point2",
          "brand"
        ],
        "additionalProperties": false
      },
      "theme": {
        "type": "object",
        "properties": {
          "background": {
            "type": "string",
            "pattern": "^#[0-9a-fA-F]{6}$",
            "role": "background"
          },
          "surface": {
            "type": "string",
            "pattern": "^#[0-9a-fA-F]{6}$",
            "role": "surface"
          },
          "foreground": {
            "type": "string",
            "pattern": "^#[0-9a-fA-F]{6}$",
            "role": "foreground"
          },
          "accent": {
            "type": "string",
            "pattern": "^#[0-9a-fA-F]{6}$",
            "role": "accent"
          },
          "accent2": {
            "type": "string",
            "pattern": "^#[0-9a-fA-F]{6}$",
            "role": "accent2"
          }
        },
        "required": [
          "background",
          "surface",
          "foreground",
          "accent",
          "accent2"
        ],
        "additionalProperties": false
      },
      "media": {
        "type": "object",
        "properties": {
          "before": {
            "type": "string",
            "enum": [
              "roombefore",
              "roomafter",
              "yardbefore",
              "yardafter"
            ],
            "kind": "image",
            "options": [
              {
                "id": "roombefore",
                "label": "Room, before"
              },
              {
                "id": "roomafter",
                "label": "Room, after"
              },
              {
                "id": "yardbefore",
                "label": "Garden, before"
              },
              {
                "id": "yardafter",
                "label": "Garden, after"
              }
            ]
          },
          "after": {
            "type": "string",
            "enum": [
              "roombefore",
              "roomafter",
              "yardbefore",
              "yardafter"
            ],
            "kind": "image",
            "options": [
              {
                "id": "roombefore",
                "label": "Room, before"
              },
              {
                "id": "roomafter",
                "label": "Room, after"
              },
              {
                "id": "yardbefore",
                "label": "Garden, before"
              },
              {
                "id": "yardafter",
                "label": "Garden, after"
              }
            ]
          }
        },
        "required": [
          "before",
          "after"
        ],
        "additionalProperties": false
      }
    },
    "required": [
      "texts",
      "theme",
      "media"
    ],
    "additionalProperties": false
  },
  "handoff": {
    "urlTemplate": "https://cliphou.se/#/v/beforeafterphoto-room?props=<url-encoded props JSON>",
    "example": "https://cliphou.se/#/v/beforeafterphoto-room?props=%7B%22texts%22%3A%7B%22headline%22%3A%22Living%20room%20refresh%22%2C%22point1%22%3A%22Before%22%2C%22point2%22%3A%22After%22%2C%22brand%22%3A%22HOMELAB%22%7D%2C%22theme%22%3A%7B%22background%22%3A%22%23111214%22%2C%22surface%22%3A%22%232a2c31%22%2C%22foreground%22%3A%22%23ffffff%22%2C%22accent%22%3A%22%23f59e0b%22%2C%22accent2%22%3A%22%2310b981%22%7D%2C%22media%22%3A%7B%22before%22%3A%22roombefore%22%2C%22after%22%3A%22roomafter%22%7D%7D",
    "maxEncodedLength": 8000,
    "note": "cliphou.se validates the props before it opens them. Invalid props are rejected and never saved."
  },
  "source": {
    "package": "https://cliphou.se/source/beforeafterphoto/v1.tar.gz",
    "packageSha256": "446be09980f41f312b5355cc5afb9266a3209cd91a9a710bcfa5053417ef79dc",
    "templateVersion": 1,
    "renderCommand": "npm ci && npx remotion render src/index.ts beforeafterphoto out/video.mp4 --props=props.json",
    "repository": "https://github.com/sunmer/voodoo",
    "path": "src/videos/beforeafterphoto/",
    "contents": "Remotion component, schema, scene metadata, shared helpers, exact dependency versions, lockfile, example props, and MIT-0 license. Fonts install from pinned Fontsource packages.",
    "note": "Rendering uses Remotion, which has separate license terms: https://remotion.dev/license"
  },
  "instructions": [
    "For text, color, and image edits, change only props.texts, props.theme, and props.media when present. Keep each text within maxLength, each color as #RRGGBB, and each image as one of its listed options.",
    "Return text and color edits as handoff.urlTemplate with the props JSON URL-encoded.",
    "For layout, motion, timing, or scene edits, download source.package, extract it, and edit the code.",
    "Render the source package with source.renderCommand. Edit props.json to change text and colors.",
    "Never send code through the handoff URL. It accepts props only."
  ]
}