vawe-scene-authoring

Author deterministic Vawe scene HTML and data JSON for frame-pure video rendering.

3|Updated Jun 9, 2026
One-click install
npx skills add https://github.com/Vandit1604/vawe --skill vawe-scene-authoring-vandit1604
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vawe-scene-authoring
Source: https://github.com/Vandit1604/vawe/tree/main/skills/vawe-scene-authoring
Command: npx skills add https://github.com/Vandit1604/vawe --skill vawe-scene-authoring-vandit1604

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Writing Vawe scenes by hand often produces broken renders: impure frame logic that breaks sharded rendering, generic AI-looking layouts, spacing collisions, and missing theme tokens. This Skill encodes the full authoring contract so scenes render deterministically and look intentional. ## Core Features & Use Cases - Purity contract enforcement: Teaches the renderFrame(n) purity rule (no Date.now, no Math.random, compositor-only properties) guarded by make probe, so frames shard safely across parallel Chrome tabs. - Design system guidance: Covers theme-owned look tokens, per-film design specs, group-first layout containment, motion primitives (interpolate, spring, track), and anti-generic taste rules for hooks, CTAs, and cards. - QA loop: Provides the validation ladder (probe, audit, look, verify, review) with rendered-frame inspection before declaring a scene done. - Use Case: You need a 9:16 product teaser video. Use this Skill to write the data JSON with a declared theme, lay out layers in groups, animate with pure motion primitives, then run make audit and eyeball the storyboard before rendering. ## Quick Start Use the vawe-scene-authoring skill to create a new scene JSON and scene.html for a short product teaser video, then run the purity probe and layout audit.

Frequently Asked Questions about vawe-scene-authoring

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I author a Vawe scene JSON for video rendering?

Write a self-describing data JSON declaring a theme, lay out layers inside groups rather than absolute coordinates, and animate with pure helpers like interpolate and spring from core/motion/motion.js. Then run make probe and make audit before rendering.

Why must renderFrame(n) be pure in Vawe scenes?

The renderer shards frames across parallel Chrome tabs, so renderFrame(n) must produce byte-identical DOM for a given n regardless of call order. No Date.now, Math.random, accumulated state, or reading previous DOM; the make probe command asserts this purity.

Can I use GSAP or CSS transitions for Vawe scene animations?

No. CSS transitions and animations are globally killed, and GSAP risks the purity contract since rendering is seek-and-screenshot, not real-time playback. Use the closed-form, pure-in-n helpers in core/motion/motion.js such as interpolate, spring, and track.

How do I fix overlapping or overflowing text in a rendered Vawe video?

Run make audit to detect overlap, overflow, safe-zone, and spacing violations on elements marked data-layer="critical". Fix by moving related elements into a group with gap-based flow instead of adjusting absolute x/y coordinates, then re-run the audit.

What are the limitations of the Vawe scene authoring approach?

Scenes must derive everything from the frame number, so stateful or interactive behaviors are impossible. Themes must be complete or validation fails, scenes referencing local image files outside the engine are unsupported, and renders are not byte-identical across different host GPUs.