Quick summary
Jarvis Folio is a one-image recursive zoom: as you scroll, the camera dives deeper into a single AI-generated frame, each level revealing the next portal. A hypnotic, JARVIS-styled portfolio built on the end-image-portal technique — one continuous descent with no cuts.
Who this template is for
One image that appears to contain infinite depth. It is 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 genuinely 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 normally demand 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 usually 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, which is what makes the zoom seamless
- 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 level of depth inside the current frame |
| Structure-Similarity Gating | Score each junction so the zoom cannot show a seam |
| Interface Overlay Layer | Hold a technical interface above the descent without breaking it |
Design & 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, acting as the fixed reference that proves it is the world moving
Mobile & 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 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, rewarding engagement instantly
- 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 rather than pushed
Other information about this template
A few notes on this build.
- It is a dark-theme build, and calls to action need contrast tuned specifically 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 is the smallest scroll world in the library in terms of 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 — one image that appears to contain infinite depth.
Screenshots
Captured from the live build, section by section. This is the template as it actually renders, not a mock-up.
