By Holley Studios · Creative Engineering
From Blender to browser. You own the code. Forever.
Production-ready scroll animations shipped as React.
No SaaS. No rebuilding scenes. No developer overhead.
The Problem
3D on the web has always meant choosing between bad and worse.
Two paths exist. Neither respects your renders, your budget, or your clients.
The Custom Build
3 – 6 months
- Hire a specialist WebGL engineer
- Rebuild every scene inside a new tool
- Months of iteration, no guarantees
- Locked to their stack and timeline
The SaaS Tool
Forever
- Rebuild scenes inside their editor
- Your renders are useless to them
- You own nothing — they do
- Cancel the subscription, it disappears
The Third Path
Iris.
Bring your renders. Get back production React. No rebuilding. No subscription. No engineer needed. A component your client owns — today, and in 2035.
How It Works
Three stages. One command.
The entire pipeline runs from a single CLI. Point it at your render folder and get a deployable component.
Blender / KeyShot
Render
Export a turntable animation from any renderer. Drop the frames in a folder with a manifest.json contract.
- Turntable animation
- frame_####.webp
- manifest.json
@iris/core
Process
Iris crops to your subject bounding box, pads to square, and converts every frame to optimised WebP in parallel.
- Crop → pad → resize
- sharp 0.33 + WebP 82q
- p-limit(8) parallel
@iris/emit
Emit
A single .tsx component is written to disk. No Framer Motion, no GSAP — just React, a canvas ref, and scroll math the client owns.
- Handlebars .tsx.hbs
- Native Next.js component
- Zero runtime deps emitted
Output Tiers
Three levels of fidelity.
Every tier produces a component your client owns. No runtime license. No external dependency. No call home.
Cinematic
For single-render reveals that feel like a trailer
One render. One scroll-driven video. When visitors scroll, the scene plays. Fast to build, faster to load.
- Scroll-driven video.currentTime
- Single encoded mp4
- iris encode included
- Any frame count
Dimensional
For layered renders that create convincing depth
Three render layers (bg / mid / fg) scroll at different rates. Spatial depth without a 3D engine — the technique brands want but can't afford to build.
- 3-layer parallax composite
- Direct JS transform — no GSAP
- bg · mid · fg layer paths
- Works with Blender Layer Render
Orbital
For full-rotation products with cinematic frame control
Every frame drawn to canvas via scroll. The Apple-AirPods technique — yours to own, no SaaS dependency, no CDN lock-in. Custom agencies charge $30,000+ for this.
- canvas drawImage per frame
- IntersectionObserver preload
- RAF + DPR cap at 2×
- 120+ frames recommended
The Alternative
Custom agency build: $30,000+
3–6 months. You still don't own the infrastructure.
Iris Orbital
$3,000 – $8,000
3 weeks. You own it forever.
Who It's For
If you have renders, you're ready.
Iris exists for teams who already have the 3D work done. You just need it on the web — without starting over.
E-Commerce
Your product photographer delivers 120 frames of a sneaker rotating. That sequence sits on a hard drive. Iris turns it into a canvas scroll component in under an hour — same Apple-AirPods effect, fraction of the cost, owned by your client forever.
Save $25,000+ vs. custom dev
SaaS & Tech
Your motion designer rendered a 3-layer product walkthrough in Blender — background infrastructure, mid-layer UI, foreground data. Iris assembles those layers into a Dimensional parallax section. Developers get a React component. No Framer. No GSAP. No SaaS.
Save $15,000+ vs. custom dev
Architecture & Viz
Your architectural visualization studio delivers 60 frames of a walkthrough sequence. Iris encodes them into a single mp4, generates the Cinematic scroll component, and ships it. The developer drops one file into the project. Done.
Ship in 1 week, not 3 months
The Manifest Contract
One contract.
Any renderer.
manifest.json is the handshake between your 3D tool and the web. Iris reads it, validates it, and uses it to drive every stage — so you never touch the template code.
- Slug — Becomes the component name and /frames/ path
- Tier — 1 = video scrub · 2 = parallax · 3 = canvas sequence
- Frames — Count, pattern, dimensions, fps — all validated before processing
- BBox — Subject crop box in normalised [0,1] coordinates
- Disclosure — IL HB 3773 AI-use notice wired in automatically
{
"version": "1.0",
"source": "blender",
"slug": "aurora-headphones",
"tier": 3,
"frames": {
"count": 120,
"pattern": "frame_####.webp",
"width": 1280,
"height": 1280,
"fps": 30
},
"camera": {
"path": "turntable",
"degrees": 360,
"easing": "linear"
},
"lighting": "studio-three-point",
"subject": {
"hasAlpha": true,
"bbox": [
0.08,
0.05,
0.92,
0.97
]
},
"copy": {
"heading": "Aurora Headphones",
"alt": "Aurora headphones 360° product view"
},
"disclosure": true
}Live Demo
The component, running now.
Scroll to scrub — this is exactly what ships in your Next.js project. No Framer Motion. No GSAP. No SaaS.
Definition of Done
Six guarantees. All green before it ships.
Not spec items — promises. Every project is held to all six before it leaves our hands.
Every frame loads in under 0.2 seconds.
Frames are budgeted to < 200KB each. Total sequence < 15MB. RAF + DPR cap at 2× prevents GPU memory overrun. No jank.
Zero runtime cost.
The emitted component has no production dependencies. No Framer Motion. No GSAP. No scroll library. Ship it anywhere — it just works.
Works for every visitor.
WCAG 2.1 AA accessible. Tested on iPhone 12 at 60 fps. prefers-reduced-motion honored. Canvas has role='img' and aria-label. Screen readers included.
Pixel-perfect, every time.
BBox crop, square pad, and WebP 82q applied consistently across every frame. Absolute URL paths guarantee no broken images in any deployment.
Your client owns it. Forever.
Delivery is a .tsx file and a frames/ folder. No SaaS dependency. No CDN lock-in. No call home. It runs in 2035 with zero ongoing fees.
Disclosure-ready when your contract requires it.
IL HB 3773 AI-use disclosure wires in automatically when manifest.disclosure is true. One flag — fully compliant.
Ship 3D on the Web
Custom 3D-to-web builds start at $30K.
Iris starts at $750.
Same outcome. A fraction of the cost. Delivered in weeks, not months. And when it's done — you own it. No subscription. No dependencies. Forever.
Built by the same studio that delivers production 3D experiences for clients. This isn't a side project. It's our pipeline.
Holley Studios · Illinois · 2026