3.6 KiB
Established examples and lawful reuse catalog
Inspected 2026-10-21. “Established” identifies official showcase material or a widely known talk, not a measured popularity ranking. External pages are inspiration references, not runtime dependencies. No branded artwork, logo paths, video, photos or talk slides are redistributed. The bundled deck contains original compositions authored for this package.
| Source / author | Exact inspected source | Lesson | Reuse decision / bundled counterpart |
|---|---|---|---|
| Reveal.js official demo / Hakim El Hattab and contributors | live demo, 6.0.2 source | Progressive disclosure, strong typographic hierarchy, navigation | Repository code MIT; embedded media rights may differ. Original title, narrative and conclusion in starter slides 1, 2, 6; no copied talk content. |
| Reveal Auto-Animate / Hakim El Hattab | official documentation and examples | Preserve object continuity rather than add spectacle | Linked only; no copied website assets. Starter chooses no slide transition and content-local motion. |
| Anime.js advanced grid staggering / Julian Garnier | v4.5.0 example | Stagger exposes spatial or temporal order | MIT repository code; source inspected, not redistributed. Original six-mark stagger, slide 5. |
| Anime.js SVG line drawing / Julian Garnier | v4.5.0 example | Keep vector geometry editable; motion can explain connection | MIT code. Original hub/spoke SVG on slide 3; static edges intentionally avoid gratuitous redraw. |
| Anime.js v4 logo animation / Julian Garnier | v4.5.0 example | Timeline orchestration produces staged hierarchy | MIT code does not imply trademark endorsement. Logo not copied. Original three-step process timeline, slide 4. |
| Inventing on Principle / Bret Victor | author link redirected to Vimeo | Reference candidate for direct manipulation and explaining ideas through working demonstrations | No reuse license established; link only, no video or slide copying. Only redirect/page availability was verified here, not a new full-video review. Not claimed as a Reveal/Anime implementation. |
Explanatory assembly reference
Read explanatory mechanisms when choosing an assemble/explode/inspect/reassemble pattern. It records the inspected Anime.js toolbox and modularity recordings, attribution and reuse limits. assets/mechanism.html is the original runnable counterpart; showcase artwork remains link-only.
Original reusable examples in assets
assets/starter.html and assets/app.js are MIT original code, not reproductions of showcase layouts:
- Editorial title / decision framing (slides 1 and 6).
- Narrative structure and bounded three-stage timeline (slides 2 and 4).
- Accessible editable six-spoke decision diagram with real details (slide 3; generated labels in
scripts/build.py). - One-shot six-mark stagger with reduced-motion final state (slide 5).
Use the entire source package or extract these patterns with their supporting CSS and lifecycle handlers. Do not extract the visible effect and omit keyboard, motion-reduction or print behavior. Vendored runtime licenses are in assets/vendor; original package code is covered by root LICENSE.