The project's README from github.com/int64ago/vistep. As one markdown file: README.md.
Visualize Every Step with AI
Watch how things work. Then experiment with the model.
Explore · Documentation · Contribute · 简体中文
vistep.ai explains everyday mechanisms, science and computation through short visual stories. Follow a moving part, a signal or a calculation, then change the inputs to see what happens.
Release: the collection now contains 64 scenes. Production publishes from main through GitHub Actions. The collection expansion record and scene review records distinguish delivery from the remaining coverage of complete viewing, native listening and physical-phone testing.
| Mechanisms | Information | Systems |
|---|---|---|
| Bicycle gearing | JPEG compression | Dimensions |
| Refrigeration | Training & generation | Pendulums |
| Laser printing | Web loading | Elevator scheduling |
Use Node.js 24 and pnpm 11.25.0. The configured browser baseline is Chrome 108, Edge 108, Firefox 121 and Safari 15.4; a feature check shows a notice instead of loading experiments when required capabilities are unavailable. Narration recordings are stored in Git LFS, so install it before cloning.
git lfs install
git clone https://github.com/int64ago/vistep.git
cd vistep
corepack enable
pnpm install --frozen-lockfile
pnpm dev
Open localhost:4321. Recorded audio is included; local development needs no Cloudflare credentials or speech service.
| Command | Purpose |
|---|---|
pnpm verify |
Formatting, documentation links, types, tests, production build and artifact audit |
pnpm build:preview |
Separate preview build with noindex checks |
pnpm preview |
Serve the production build locally |
pnpm scene:check |
Scene, bilingual content and audio contracts |
Astro prerenders the articles; React experiments use TypeScript models with SVG, Canvas or Three.js. Animation and recorded narration share a chapter clock. See architecture, localization and deployment.
Scientific corrections, new scenes, translations and accessibility improvements are welcome. Follow the production guide, or give the vistep-scene skill a brief such as “Explain why an induction motor turns.” Review records separate automated checks, browser observations and listening evidence.
Contribution guide · Code of Conduct · Report a vulnerability privately
Original code and documentation are MIT licensed. See third-party notices for fonts, dependencies and audio provenance.