Park
Website for a creative interior design studio.
Interior designWeb
- Awwwards Honorable Mention
- FWA of the Day
- London Design Awards 2024 · Gold
All services
Service 04
Interface motion
Alive, and still fast.
Scroll choreography, transitions and micro-interactions that make a product feel alive without slowing it down.
- GSAP
- Motion
- WebGL & shaders
- Reduced-motion support
Motion is how an interface explains itself: where something came from, what just changed, what to look at next.
The site you are reading is the demo. Its galleries move with your scroll, the hero runs a shader, pages cross-fade, and all of it switches off for visitors who ask for less motion.
(01)What you get
What's included.
Scroll-driven sections
Pinned galleries, reveals and parallax tied to the scroll position.
Page and state transitions
Changes that carry the eye from one view to the next instead of cutting.
Micro-interactions
Hover, press and loading feedback that makes controls feel responsive.
WebGL and shaders
Generative backgrounds and effects, loaded only when they are on screen.
A performance budget
Motion on properties the browser animates cheaply, checked on mid-range phones.
Reduced-motion support
A calm, complete version for people who turn motion down in their settings.
(02)Approach
How we go about it.
Motion with a job
Every animation has to explain something or it comes out.
One set of curves and timings
A few shared easings and durations, so the whole product moves the same way.
Tested where it hurts
Slow phones, long pages and interrupted scrolls, before anything ships.
Tools
- GSAP
- ScrollTrigger
- Motion
- Lenis
- WebGL
- View Transitions
(03)Before Codion
Work of this kind, by the founders.
Projects we built in earlier roles. The recognition belongs to the projects and the teams behind them.
Yurdaer Mimarlık
Website for an architecture firm with projects across 12 countries.
ArchitectureWeb
- 4× Altın Örümcek · 1st place
- Awwwards Honorable Mention 2025
Greenwich Coffee
Web experience for the coffee chain, winner of five Altın Örümcek awards in 2025.
Food & retailWeb
- 5× Altın Örümcek 2025
(04)Questions
Asked often.
Can you add motion to a product that already exists?
Yes. We work inside an existing React or Next.js codebase and add motion screen by screen.
What about people who dislike animation?
Their devices tell us. When reduced motion is on, the site shows the same content without the movement.
(05)Other services
(07)Contact
Have somethingto build ?
Tell us what you're working on. We read every message ourselves.
hi@codion.tech