{"slug": "show-hn-choreo-an-animation-dsl-that-verifies-its-own-rendered-output", "title": "Show HN: Choreo – an animation DSL that verifies its own rendered output", "summary": "Choreo, a new DSL for web animation that verifies its own rendered output, has been released as a research artifact. The tool compiles animation descriptions into self-contained SVG+CSS and includes a verifier that checks spatio-temporal assertions against the actual rendered trace, enabling AI agents to reliably generate animations with a 94% success rate when using a verify-and-correct loop, according to the project's documentation.", "body_md": "**An animation format an AI can author reliably — and that proves it matches the spec.**\n\nChoreo is a small, semantic DSL for web animation. You describe *what* should\nhappen (\"the badge pops as the checkmark draws on, then the label slides up\"),\nand Choreo compiles it to self-contained SVG + CSS. The catch that makes it\ndifferent: **every Choreo program carries its own spatio-temporal checks, and a\nverifier proves the rendered animation actually satisfies them.**\n\nExisting tools (GSAP, Motion, Lottie, Rive) are excellent at letting *humans*\nauthor animation. Choreo targets a different problem:\n\n**Authorable by an agent, not a person.** A bounded grammar an LLM hits reliably from a spec — no timeline scrubbing, no coordinate math.**It checks itself.** The animation ships with assertions like`during 0..500 : fadesIn(card)`\n\nand`at end : settled(all)`\n\n, andconfirms them against the`@choreo-oss/verify`\n\n*rendered trace*— the actual pixels over time, not the source.\n\nThat verification is the part nothing else does. Visual-regression tools\n(Chromatic, Percy, Applitools) diff *screenshots*; they can tell you a frame\nlooks different, but not that \"the toast still slides in **before** it fades and\nsettles by 1.2s.\" Choreo's verifier asserts motion *contracts*.\n\nWhy this matters for AI.LLM animation synthesis is right ~59% of the time unaided; a formal verify-and-correct loop lifts it to ~94% ([MoVer, SIGGRAPH 2025]). Choreo is that loop, packaged: a substrate an agent can generateanda checker that catches when it's wrong.\n\n```\nscene \"signup-success\" size 800x450 duration 2600ms background #f1f5f9\n\nentities\n  card  = rect 320x220 fill #ffffff radius 12\n  ring  = circle 30 stroke #16a34a stroke-width 4\n  tick  = path \"M8 16 L14 22 L24 10\" size 32x32 stroke #16a34a stroke-width 4\n  label = text \"Account created\" size 18 weight 600 color #0f172a\n\nlayout\n  center card\n  inside ring card top 36\n  center tick in ring\n  below label ring gap 18\n\nmotion\n  seq\n    fadeIn card 500ms easeOut\n    par\n      pop ring 400ms\n      drawOn tick 450ms easeOut\n    slideIn label from bottom 10 400ms easeOut\n\nchecks\n  during 0..500   : fadesIn(card)\n  during 500..900 : grows(ring) and fadesIn(ring)\n  at 1800         : below(label, ring)\n  always          : inside(ring, card) and inside(label, card)\n  at end          : settled(all)\ncd lang\nnode src/cli.mjs examples/signup-success.choreo -o out --verify\n#  → out/signup-success.html      a self-contained animation\n#  → out/signup-success.spec.mjs  the checks block, as a verifier spec\n#  → runs @choreo-oss/verify: 19/19 checks passed\n```\n\n| Package | What it is |\n|---|---|\n`lang/` |\n\n`checks`\n\n→ verifier spec`verify/`\n\n`@choreo-oss/verify`\n\n— samples a rendered animation trace (Playwright) and asserts spatio-temporal predicates. **Works on any web animation**— CSS, GSAP, Motion, Remotion renders — because it verifies traces, not source.`bench/`\n\n`@choreo-oss/verify`\n\nas a neutral referee.`@choreo-oss/verify`\n\nis useful on its own, against animations you didn't write in Choreo:\n\n```\nexport default {\n  name: 'signup-flow',\n  target: 'file:///…/signup-flow.html',   // any URL, file, or inline HTML\n  duration: 2600,\n  entities: { toast: '#toast', msg: '#msg' },\n  checks: [\n    { during: [0, 400], assert: ['movesLeft(toast)', 'fadesIn(toast)'] },\n    { at: 1200,          assert: ['visible(toast)', 'inside(msg, toast)'] },\n    { atEnd: true,       assert: ['fadedOut(toast)'] },\n  ],\n};\ncd verify && npm install\nnpm run demo          # 19/19 checks pass on examples/signup-flow.html\nnpm run demo:broken   # 12/19 — catches 3 planted regressions, with frames, exit 1\n```\n\nChoreo is a **research artifact, released as-is** — it began as an internal\nprobe into whether a verifiable DSL is the right substrate for AI-generated\nanimation. It is not a supported product; there is no roadmap commitment and no\nsupport SLA. Issues and PRs are welcome, but treat it as a foundation to build\non, not a maintained service.\n\n[MIT](/JieGouAI/choreo/blob/main/LICENSE). Note the benchmark vendors GSAP under GreenSock's own license —\nsee [ NOTICE](/JieGouAI/choreo/blob/main/NOTICE).", "url": "https://wpnews.pro/news/show-hn-choreo-an-animation-dsl-that-verifies-its-own-rendered-output", "canonical_source": "https://github.com/JieGouAI/choreo", "published_at": "2026-07-27 18:04:55+00:00", "updated_at": "2026-07-27 18:22:43.494686+00:00", "lang": "en", "topics": ["developer-tools", "ai-tools", "generative-ai"], "entities": ["Choreo", "GSAP", "Motion", "Lottie", "Rive", "Chromatic", "Percy", "Applitools"], "alternates": {"html": "https://wpnews.pro/news/show-hn-choreo-an-animation-dsl-that-verifies-its-own-rendered-output", "markdown": "https://wpnews.pro/news/show-hn-choreo-an-animation-dsl-that-verifies-its-own-rendered-output.md", "text": "https://wpnews.pro/news/show-hn-choreo-an-animation-dsl-that-verifies-its-own-rendered-output.txt", "jsonld": "https://wpnews.pro/news/show-hn-choreo-an-animation-dsl-that-verifies-its-own-rendered-output.jsonld"}}