04 — Creative Studio
A bold, motion-led site for a film and design studio that needed its website to feel like its reel.
- Client
- MONO
- Industry
- Design & Film
- Year
- 2025
- Duration
- 6 weeks
- Team
- Designer, 2 engineers
- Services
- Website DesignWebsite DevelopmentPerformance Optimization
- LCP on 4G
- 1.6s
- Reel views
- +2.3×
- Cumulative layout shift
- 0.01
Sample project and illustrative metrics shown for demonstration.
01Overview
MONO's work was loud, fast and cinematic. Their website was a static grid of thumbnails.
02Challenge
Bring video-heavy work to the homepage without the multi-megabyte load that usually comes with it.
03Approach
- Step 01
Designed a type-first grid where projects preview on hover and play inline on tap.
- Step 02
Encoded adaptive video streams so each visitor gets the right quality for their connection.
- Step 03
Wrote a performance budget into the contract and held to it.
04Design
Monochrome with a single signal-orange accent, oversized grotesque type and cuts timed to the studio's editing rhythm.
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789
05Development
Adaptive streaming via Mux, lazy-mounted players and poster frames generated at build time — the homepage ships under 200 KB before interaction.
- Next.js
- TypeScript
- Framer Motion
- Mux
- Vercel
06Result
Reel views more than doubled, and the studio now uses the site as its primary pitch tool.
Next project
VERTEX
Fintech Platform
Currently accepting selected projects.