The motion collection
The Jolt homepage and recipe collection combine an interactive Web playground with recordings from the native Motion Studio app. Search by name, filter by category, then open a recipe to watch its recording, copy the core API example, inspect the complete NativeScript Vue demo or copy an adaptation prompt.
Try it in the browser
The opening combines oversized type with a chrome sculpture that follows the pointer, spins on click or keyboard activation, and keeps its momentum after a horizontal drag. Its small WebGL renderer belongs to this website; Jolt supplies motion values, springs, pointer following and inertial drag. A vector sculpture remains available when WebGL is unavailable or its context is lost. Rendering stops while the sculpture is offscreen or the document is hidden. Morrow’s two phones move with the scroll position, and the main action responds to the pointer. The playground runs spring, stagger and drag/snap through the existing experimental Jolt Web runtime. The showcase uses the same runtime for scroll-linked project stages. Reference pages load a small Jolt interaction for heading entrance and reading progress, disposing it on navigation.
Each mounted interaction owns its runtime and disposes it when leaving the page. The sculpture observes geometry changes when the viewport resizes. The operating system's reduced-motion preference is respected; the footer also offers a persistent Reduce motion switch. Reduced motion prevents automatic recipe previews. Videos load on hover or focus and pause when leaving the card, viewport or document. Full recordings have standard playback controls.
Native recordings
The gallery reuses reviewed native footage. The new clips below are trimmed from the Motion Studio recordings, without changing timing or synthesizing frames. The original recordings remain in the repository. Captions on every recipe identify the capture platform and limitations.
The circular reveal recipe retains the demo's selected 1600 ms duration. The confetti recipe includes native emitter playback and a confetti burst. Neither recording demonstrates physical haptics. The film and automotive example retain their original captions and playback controls. Older release notes and their recordings are preserved in release history.
Code and prompts
Each core snippet is extracted from its versioned API guide at build time. It illustrates the animation API; the linked native demo contains the surrounding views, controls and lifecycle setup. Adaptation prompts include the package version, documented entry point, source reference, capture limitations, reduced motion and cleanup requirements. The native API and experimental Web API are not interchangeable.
The collection and its detail pages are available in English, Brazilian Portuguese, Spanish and Simplified Chinese. Filtering and search are represented in the URL. Language switching keeps the selected recipe.
Reproduce the review
Run npm run docs:check-media and npm run docs:build. Start npm run docs:preview -- --port 5181, then run npm run docs:test-site. The browser review covers Chromium and WebKit, actual interactions, native MP4 playback, clipboard actions, filtering, four locales, desktop/mobile widths, reduced motion and navigation/remounting. Browser review artifacts default to /tmp/jolt-motion-site-review. Analytics are blocked and the existing community-list endpoint returns an empty fixture during this visual review; it does not test the production community service.
scripts/motion-recipe-captures.json records the original source clips and exact trim ranges. node scripts/prepare-motion-recipe-media.mjs reproduces the derived native clips and posters with FFmpeg. node scripts/record-motion-site.mjs records the site with real Playwright input; use the captioned MP4 above for the review, not screenshots as a substitute.
This site consumes existing Jolt Web APIs. It adds no engine capability and does not change Mavis application code.
The homepage includes an exploratory physical-device study, with CPU, post-run PSS and presentation waiting in the same panel. All three metrics use the default cohort; the chart animates stored measurements. Its compact footer links to recipes, the showcase, the study, installation and the API, alongside reduced motion and back-to-top controls.
The Jolt Drive feature links to the public project repository and its showcase. The published entrance preview keeps every source frame timestamp. The older Jolt Car walkthrough remains available below the homepage project card; its original recording is preserved.
Take the motion with you
Four recipes from the real project: coordinated cockpit, spring-driven atmosphere selection, a charge sheet with background blur, and the camera journey into the cabin. Each includes native playback, reviewed source and an adaptation prompt.