Award-Winning Digital Experience for a Creative Studio
The Brief
Studio Futura, a Milan-based branding and motion design agency, needed a portfolio website that was itself a testament to their creative capabilities. Their old WordPress site was slow, generic, and embarrassing to show prospective clients. The brief was clear: "Make it feel like an interactive art installation, not a website."
Design Philosophy: Digital Brutalism Meets Editorial
We crafted a visual language that merges neo-brutalist aesthetics (bold typography, raw grids, high contrast) with editorial magazine layouts (elegant spacing, curated imagery, sophisticated animations).
1. Immersive Case Study Experience
- Each project page is a full-screen scroll-driven narrative — sections animate in using the Scroll Timeline API and View Transitions.
- Custom WebGL shaders (via Three.js) for hover effects on project thumbnails — images distort, ripple, and pixelate based on cursor velocity.
- Video backgrounds with intelligent lazy-loading and adaptive bitrate streaming.
2. Headless Architecture
- Sanity CMS with a completely custom Studio — the editing interface mirrors the live site's aesthetic so designers feel at home.
- Portable Text renderer with custom blocks for embedded Lottie animations, before/after image sliders, and interactive color palette components.
- Structured content models for case studies, team bios, journal entries, and client testimonials.
3. Performance Despite Richness
- Achieved a Lighthouse Performance score of 98 despite heavy animations.
- All WebGL scenes use offscreen canvas and progressive loading — a low-res placeholder appears in < 200ms, high-res assets stream in.
- Fonts subset to only used glyphs; images served in AVIF/WebP via Cloudflare Image Resizing.
4. Internationalization
- Fully bilingual (IT/EN) with automatic locale detection.
- SEO-optimized with
hreflangtags and localized structured data (JSON-LD).
Technology Stack
- Frontend: Next.js 15, React, Three.js, GSAP, Framer Motion
- CMS: Sanity.io (custom Studio)
- 3D/WebGL: Three.js, custom GLSL shaders
- Deployment: Vercel (Edge Functions), Cloudflare CDN
- Analytics: Plausible (privacy-first), Hotjar (heatmaps)
Recognition
- Awwwards Site of the Day (December 2024).
- CSS Design Awards — Best UI/UX/Innovation.
- Featured in Muzli Weekly Digest and Brutalist Websites.
- 120k unique visitors in the first month.