{
  "schemaVersion": "1.2",
  "kind": "template",
  "id": "timeline-milestones",
  "variantId": "timeline-milestones",
  "template": "timeline",
  "title": "Animated Timeline",
  "url": "https://cliphou.se/templates/timeline-milestones/",
  "editorUrl": "https://cliphou.se/#/v/timeline-milestones",
  "templateVersion": 1,
  "latestTemplateVersion": 1,
  "sourceHash": "a58fb133d1a9f1ed",
  "generation": {
    "model": "Claude Opus 5.5",
    "modelId": "claude-opus-5-5",
    "provider": "Anthropic",
    "effort": "medium"
  },
  "siteCommit": "27d0f0df8e4cf1d189d78476bbbb4d8c7f2dacaa",
  "license": "MIT-0",
  "licenseUrl": "https://cliphou.se/license/",
  "price": "Free",
  "attributionRequired": false,
  "format": {
    "aspectRatio": "16:9",
    "width": 1920,
    "height": 1080,
    "fps": 30,
    "durationInFrames": 330,
    "seconds": 11
  },
  "scenes": [
    {
      "type": "title-reveal",
      "label": "Title reveal",
      "from": 0,
      "duration": 60,
      "roles": [
        "headline"
      ]
    },
    {
      "type": "timeline",
      "label": "Timeline",
      "from": 60,
      "duration": 200,
      "roles": [
        "items"
      ]
    },
    {
      "type": "byline",
      "label": "Byline",
      "from": 260,
      "duration": 70,
      "roles": [
        "brand",
        "attribution"
      ]
    }
  ],
  "props": {
    "texts": {
      "headline": "Ten years of Northwind",
      "items": "2016 Two founders, 2018 First 100 customers, 2021 Offices in 3 cities, 2024 Profitable, 2026 Series B",
      "brand": "Northwind",
      "attribution": "Company history, 2016 to 2026"
    },
    "theme": {
      "background": "#f3f1ea",
      "surface": "#1f2a44",
      "foreground": "#1b1d22",
      "accent": "#d9482b",
      "accent2": "#2c6e8f"
    }
  },
  "editableFields": {
    "texts": {
      "headline": {
        "label": "Headline",
        "maxLength": 24,
        "current": "Ten years of Northwind"
      },
      "items": {
        "label": "List",
        "maxLength": 120,
        "format": "Separate 2 to 6 items with commas.",
        "current": "2016 Two founders, 2018 First 100 customers, 2021 Offices in 3 cities, 2024 Profitable, 2026 Series B"
      },
      "brand": {
        "label": "Brand",
        "maxLength": 18,
        "current": "Northwind"
      },
      "attribution": {
        "label": "Attribution",
        "maxLength": 48,
        "current": "Company history, 2016 to 2026"
      }
    },
    "theme": {
      "background": {
        "format": "#RRGGBB",
        "current": "#f3f1ea"
      },
      "surface": {
        "format": "#RRGGBB",
        "current": "#1f2a44"
      },
      "foreground": {
        "format": "#RRGGBB",
        "current": "#1b1d22"
      },
      "accent": {
        "format": "#RRGGBB",
        "current": "#d9482b"
      },
      "accent2": {
        "format": "#RRGGBB",
        "current": "#2c6e8f"
      }
    }
  },
  "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"
          },
          "items": {
            "type": "string",
            "minLength": 1,
            "maxLength": 120,
            "pattern": "^[^,]*[^,\\s][^,]*(,[^,]*[^,\\s][^,]*){1,5}$",
            "role": "items"
          },
          "brand": {
            "type": "string",
            "minLength": 1,
            "maxLength": 18,
            "role": "brand"
          },
          "attribution": {
            "type": "string",
            "minLength": 1,
            "maxLength": 48,
            "role": "attribution"
          }
        },
        "required": [
          "headline",
          "items",
          "brand",
          "attribution"
        ],
        "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
      }
    },
    "required": [
      "texts",
      "theme"
    ],
    "additionalProperties": false
  },
  "handoff": {
    "urlTemplate": "https://cliphou.se/#/v/timeline-milestones?props=<url-encoded props JSON>",
    "example": "https://cliphou.se/#/v/timeline-milestones?props=%7B%22texts%22%3A%7B%22headline%22%3A%22Ten%20years%20of%20Northwind%22%2C%22items%22%3A%222016%20Two%20founders%2C%202018%20First%20100%20customers%2C%202021%20Offices%20in%203%20cities%2C%202024%20Profitable%2C%202026%20Series%20B%22%2C%22brand%22%3A%22Northwind%22%2C%22attribution%22%3A%22Company%20history%2C%202016%20to%202026%22%7D%2C%22theme%22%3A%7B%22background%22%3A%22%23f3f1ea%22%2C%22surface%22%3A%22%231f2a44%22%2C%22foreground%22%3A%22%231b1d22%22%2C%22accent%22%3A%22%23d9482b%22%2C%22accent2%22%3A%22%232c6e8f%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/timeline/v1.tar.gz",
    "packageSha256": "08fa10f6db6ce06cc94d2db6873c769428faf1dec7cbe800d2932a60224a6efc",
    "templateVersion": 1,
    "renderCommand": "npm ci && npx remotion render src/index.ts timeline out/video.mp4 --props=props.json",
    "repository": "https://github.com/sunmer/voodoo",
    "path": "src/videos/timeline/",
    "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 and color edits, change only props.texts and props.theme. Keep each text within maxLength and each color as #RRGGBB.",
    "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."
  ]
}
