---
name: river-era
description: Build an offline interactive 3D river settlement timeline with seeded plots, reversible era growth, moving traffic and bilingual touch controls.
version: 0.1.0
---

# River Era

## Example

Valley Years is an authored six-era river diorama: an early camp, first farms, a river town, steam workshops, a modern center and a speculative harbor. Scrubbing changes actual building geometry. Bank roads carry moving vehicles; boats follow the winding river. This is an illustrative visual sequence, not a predictive history or economy model.

```sh
node <skill>/scripts/fill-prompt.mjs --slots <skill>/assets/prompts/examples/valley-years.json --out prompt.md
node <skill>/scripts/new-project.mjs --out my-valley
cd my-valley && npm ci
npm run dev
npm run build:single
npm run shoot -- --file dist-single/index.html
```

Use pinned Node22.14.0. Build only in a generated project. Read [method](references/method.md), [slots](references/prompt-slots.md), [verification](references/verification.md) and [hosting](references/hosting.md).

## Edit and deliver

Edit src/valley.json for bilingual names, integer seed1–999999, duration15–30seconds, three river layouts and three palettes. Layout bend1–2.8 and phase-1–1 control the river centerline. Bilingual names accept at most40characters. Heights, plot count and map dimensions are authored in city.mjs/world.ts; update geometry and tests together. Validate an alternate bounded configuration. Deliver editable source, dist-single/index.html and the actual verification report.

Drag the stage to orbit, scroll to zoom, scrub the timeline or select an era. Space plays/pauses, R resets, V changes view, arrows select an adjacent era when the stage is focused. Native controls also change valley/palette and toggle synthesized tones. Reset clears the timeline; valley changes preserve the palette. All state is in memory.

## Boundaries

No key or runtime model call. npm ci installs pinned public build dependencies. Built HTML is offline with no external assets or storage. Three.js geometry and the six-stage schedule are authored illustrations. Roads, bridges, farms and towers are visual geometry; there is no population, construction cost, historical accuracy or economic prediction. Traffic follows prescribed bank/river paths and does not perform collision planning. Reduced motion starts stationary and suppresses decorative travel and rotor animation; explicit timeline play remains available. Sound starts muted and initializes after a gesture. Synthesized tones are not human listening acceptance. Browser touch emulation does not establish physical-device performance.

## FAQ

- Reuse for another settlement? Change the valley and eras slots, retaining actual geometry, native input and capture contracts.
- Reverse time? Drag the timeline backward; the scene is derived from its progress rather than accumulated construction actions.
- Invalid JSON? The app returns a stable valley_* validation code with localized guidance.
- Portable delivery? Use the single HTML offline or in an allow-scripts sandbox with dependency notices.