AR Film Creator
Use the bundled project as the source of truth for new projects. Keep the camera, tracking, geometry, occlusion, and server pipeline stable unless the user explicitly requests interaction changes.
Route the request
- Classify the request:
- New project: instantiate
assets/browser-ar-template. - Style-only change: edit
src/filter-presets.js. - Behavior change: edit preset geometry or motion values first.
- Engine change: edit
src/app.jsonly when preset fields cannot express the request.
- New project: instantiate
- Read
references/preset-contract.mdfor every style or behavior change. - Read
references/filter-recipes.mdwhen translating a visual brief into parameters. - Read
references/architecture.mdbefore changing tracking, geometry, rendering order, masking, startup, or file structure.
Create a project
Run:
powershell.exe -NoProfile -ExecutionPolicy Bypass -File scripts/New-ArFilmProject.ps1 -Destination "<absolute-output-path>"
Require an absent or empty destination. Do not overwrite an existing project implicitly.
Customize a style
- Preserve an existing preset as a known-good fallback.
- Add a new unique kebab-case preset id in
src/filter-presets.js. - Change only the fields defined by
references/preset-contract.md. - Keep exactly three layer definitions unless the user explicitly requests an engine-level layer-count change.
- Test the preset through
?preset=<preset-id>. - Confirm that an unknown preset id falls back to
transparent-film.
Protect engine invariants
- Preserve MediaPipe Tasks Vision pinned URLs and model fallback behavior.
- Preserve screen-position sorting of the two hands.
- Preserve control rows
4,8,12, and20. - Preserve shared boundaries between adjacent surfaces.
- Permit fold and twist transitions; do not reintroduce self-intersection freezing.
- Preserve composition order: background, films, hands/forearms, controls.
- Preserve localhost startup and camera permission error handling.
- Keep the derived project build-free unless the user explicitly requests another stack.
Validate
Run:
powershell.exe -NoProfile -ExecutionPolicy Bypass -File scripts/Test-ArFilmProject.ps1 -ProjectPath "<absolute-project-path>"
Then start the local server and verify:
- Root, CSS,
app.js, andfilter-presets.jsreturn HTTP 200. - Models finish loading.
- Demo mode renders four curved control lines and three connected surfaces.
- The requested preset is visually distinct.
- Twist animation crosses both bend directions without freezing.
- Reset and smoothing controls work.
- The browser console has zero project errors.
Use a real browser automation tool when available. Treat MediaPipe's internal “OpenGL error checking is disabled” warning as informational unless an actual error accompanies it.
Report
Report:
- the preset or engine behavior added;
- files changed;
- how to select and use the style;
- validation completed;
- camera or hardware checks that still require the user.