Motion and 3D that people remember and phones can handle
Good motion explains things and makes a brand feel alive. Bad motion makes people wait. We design motion and 3D to a performance budget from day one, so the moments people remember never cost you load time or accessibility.
SceneLive
Liquid surface / R&D 07
Budget
Scene code 48 KB gzipped
Accessibility
Reduced motion respected
01What’s included
6 parts, one team
Motion and 3D, designed and built to a budget
-
01
Motion language
Rules for easing, timing and depth, so every interaction feels like the same brand.
-
02
Scroll storytelling
Sections that reveal ideas as people scroll, pinned and paced with care.
-
03
WebGL and 3D scenes
Particles, shaders and 3D objects built in Three.js, from quiet backgrounds to hero pieces.
-
04
Micro-interactions
Buttons, menus, cursors and state changes that feel responsive without getting in the way.
-
05
Performance budget
Lazy loading, GPU checks and testing on mid-range phones before anything ships.
-
06
Fallbacks and access
Reduced motion settings respected, and a calm static version for low-power devices.
02How it runs
How a motion project runs
-
References and quick experiments to find the motion that fits your brand.
-
Working prototypes in the browser, tested on real devices, so you judge the feel and not a video.
-
Production scenes and interactions built into your site, with fallbacks and performance checks.
-
Final polish on real content, a last round of device testing and a calm launch.
03Tools
Built with tools your team already knows
We pick the stack during discovery, based on who will edit the site and how often. These are the tools we reach for most on this kind of project: Three.js, GSAP, ScrollTrigger, Lenis, Rive, Lottie, Blender and WebGL shaders.
04Related services
05FAQ
Motion and 3D questions, answered
Something else on your mind? Email the studio and a designer, not a salesperson, replies within a day.
Does 3D slow a website down?
Only if it is built carelessly. We load 3D after the page is usable, keep scenes within a size budget, pause them when they are off screen and test on mid-range phones. The rest of the page stays fast either way.
Is motion bad for accessibility?
It can be, which is why we respect the reduced motion setting on every device, avoid flashing and large sudden movement, and make sure nothing important is only shown through animation.
Can you add motion to our existing site?
Yes. We often add scroll sections, interactions or a hero scene to sites we did not build. We check your codebase first to make sure the additions will be stable and fast.
What tools do you use for 3D on the web?
Mostly Three.js and custom shaders for real-time scenes, GSAP for timing and scroll, and Blender when we need modelled objects. Rive and Lottie cover lighter illustrated animation.
Will 3D scenes work on phones?
Yes. Every scene has a mobile version tuned for smaller graphics chips, and a static fallback for older devices or battery saver modes.
How can we judge motion before it is built?
We share working prototypes in the browser early on, so you can try them on your own devices rather than imagining the feel from a video or a still.
06Start a project