Files
MineGeo/docs/cinematics.md
pavel444-byte ad73132f15
Some checks failed
Deploy MineGeo to Dokploy / deploy (push) Failing after 3m14s
Add cinematic banner, real-site trailer, and first-visit intro
2026-10-17 19:54:23 +05:00

32 lines
2.9 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# MineGeo cinematics
## Deliverables
- `public/media/minegeo-discord-banner.gif`: 600 × 240, 3-second looping banner at 24 fps. Created in Three.js; the camera, compass sweep, pins and terrain movement return to their initial state at the loop boundary.
- `public/media/minegeo-discord-banner.png`: 1200 × 480 still fallback.
- `public/media/minegeo-trailer.mp4`: 1280 × 720, 30 seconds at 24 fps, H.264/AAC, optimized for progressive web playback. Includes an original synthesized ambient soundtrack with no speech.
- `public/media/minegeo-trailer-poster.jpg` and `minegeo-trailer.vtt`: poster and English captions.
The trailer combines a Three.js opening and closing with genuine screenshots of the homepage, map catalog, in-game panorama, and map setup, captured through the browser from the local app against the real published catalog. Screenshots are stored in `cinematics/screenshots/` and animated inside a framed window; they are still captures, not a gameplay recording. A guest game was opened for the panorama capture; no score was submitted. The intro/closing terrain, hut, arch, pins, particles, compass, typography and sound are generated locally; no third-party footage or music is used. Typography uses the project's existing licensed Monocraft font.
The homepage provides native video controls, captions, a descriptive text alternative, and a download link. The video does not autoplay and uses `preload="none"`.
## First visit
`FirstVisitIntro` runs only on the homepage and lasts 4.75 seconds. It uses CSS terrain tiles, a compass/pin reveal, and text fading out before the backdrop reveals the site. The Skip button and Escape dismiss it early. It bypasses the animation when reduced motion is requested and closes if that preference changes during playback.
The `minegeo:intro:v1` local-storage key remembers a visit per browser/origin. If local storage is unavailable, it falls back to session storage and then in-memory state. The regular page always renders on the server; JavaScript failure cannot leave it hidden. The welcome does not interrupt an already-open dialog.
## Rebuild media
The installed project dependencies supply Three.js, Sharp and Playwright. Install Playwright's Chromium runtime and a local FFmpeg executable if they are not already present. These are production tools; visitors receive only the compressed media and the lightweight CSS intro, without Three.js on the homepage.
```sh
node scripts/render-cinematics.mjs
node scripts/render-cinematics.mjs --banner-only
node scripts/render-cinematics.mjs --trailer-only
node scripts/render-cinematics.mjs --preview
```
The preview binds to `127.0.0.1:3110`. Open `/?mode=banner` for the loop or `/?time=16&still=1` for a trailer still. Temporary frames and synthesized audio stay in ignored `.data/cinematic-render/`; deliverables are written to `public/media/`. The export uses an isolated headless graphics renderer, does not access user browser sessions, and needs no credentials or network assets.