Quick summary
Jarvis Folio is a one-image recursive zoom. As you scroll, the camera dives deeper into a single AI-generated frame, and each level reveals the next portal. It’s a hypnotic, JARVIS-styled portfolio built on the end-image-portal technique, with one continuous descent and no cuts.
Who this template is for
One image that appears to contain infinite depth. It’s for portfolios that want to be remembered rather than browsed.
- Designers and technologists who want a portfolio built on a single striking idea instead of a project grid
- Brands with a technical or systems story where nested detail is the point
- Studios needing a reference for the end-image portal technique in a finished build
What problem this template solves
Scroll-driven cinematic sites usually take a 3D artist, a motion designer, and weeks of iteration. This build gets the same effect from generated film and hand-written code.
- True 3D fly-throughs price out most projects before the first storyboard is drawn
- Video-scroll sites tend to stutter, because the scrub, the seams, and the loading are all hard to get right
- Studios who want this look have few reference builds showing how the legs are generated and joined
What you get with this template
You get a one-image recursive zoom: the camera dives deeper into a single frame as you scroll, each level revealing the next portal, with no cuts anywhere.
- A continuous descent through nested portals that never breaks or reloads
- Each scene’s final frame seeding the next, so the zoom never shows a seam
- A JARVIS-styled interface treatment that suits a technical subject without becoming a costume
Page sections overview
| Section | Purpose |
|---|---|
| End-image portal technique | Use each scene’s final frame as the next scene’s starting point |
| Recursive zoom motion | Drive one continuous inward camera move rather than a sequence of cuts |
| Nested portal reveals | Reveal the next portal inside the current frame |
| Structure-similarity gating | Score each junction so the zoom can’t show a seam |
| Interface overlay layer | Hold a technical interface above the descent without breaking it |
Design and branding system
The identity is a heads-up display over a deep image: cyan interface strokes, dark ground, and typography that stays fixed while the world zooms.
- A dark base with cyan interface strokes, keeping the overlay legible at every depth without lighting the image
- Thin consistent stroke weights on all interface furniture, so the overlay reads as instrumentation rather than decoration
- Monospaced interface type held at a constant size, so it’s clearly the world doing the moving
Mobile and speed optimization
The film is pre-rendered video, so the cinematic look costs almost nothing on mobile hardware. The phone only ever scrubs a video.
- Pre-rendered legs mean there’s no WebGL budget on mobile: scroll position simply drives video time
- Posters and compressed masters keep the first frame fast even on cellular connections
- Caption and interface layers reflow independently of the film, so small screens lose no content
How this template helps you convert
A scroll film turns a pitch into an experience. The structure keeps the visitor moving toward the ask without ever feeling sold to.
- The opening frame is the hook: motion begins with the first scroll tick, so engagement pays off right away
- Each beat lands one message before the camera moves on, so the story accumulates instead of blurring
- By the final beat, the visitor has flown the whole world, so the closing call to action feels earned
Other information about this template
A few notes on this build.
- It’s a dark-theme build, and calls to action need contrast tuned for it
- The descent is pre-rendered, so it stays smooth on mobile with no WebGL cost
- Subject, depth count, and copy are all rebuilt around your work; the portal technique carries over
- It’s the smallest scroll world in the library by source material: one image, taken a long way
How it works
Each scene’s final frame becomes the start of the next, so the zoom never breaks. Scroll drives the descent through nested portals, and the one image seems to hold infinite depth.
Screenshots
Captured from the live build, section by section, exactly as the template renders.
