All work
Case study Web design Development Film production

Mad Production

A cinematic site for an independent film production house. Dark, deliberately slow, and structured around the reality that commissioners watch reels first and read second.

Role Web designer
Timeline 4 weeks
Scope Film studio website
Tools Figma, HTML/CSS/JS
madproduction.com
MAD Production website, desktop view
The challenge

MAD Production had 15+ years of award-winning work across feature films, commercials, and documentaries, but their website wasn't telling that story. A generic template was underselling that body of work and failing to attract the decision-makers who commission major projects.

The gap

Film production websites typically lean on reels and PDF portfolios. They show the work without building the institutional weight behind it. For a studio with this depth of catalogue, a generic template reduced a world-class body of work to just another services listing.

The brief

Build a cinematic digital presence that leads with credentials, surfaces proof of scale immediately, and converts visitors into project inquiries through bold, high-contrast visual language that matches the productions themselves.

Research & discovery

Competitive analysis

I reviewed four production house archetypes to map how film studios communicate credibility online, and where most fail to convert the commissioning decision-makers who matter most.

Weta Workshop

World-class visual effects studio with strong IP and cultural cachet, but its site functions more as a fan destination than a B2B pitch: it celebrates the work rather than converting the commissioning decision-maker.

The Mill

Premium VFX and production company with a strong visual identity. The reel-forward site works for creatives but assumes the prospect already knows the brand; cold traffic from brand marketers needs more context to convert.

Local production houses

Typical regional studios: a Vimeo embed, a services list, and contact details. Scale and credibility signals are absent, and when price is the only stated variable, commoditization is inevitable.

Freelance directors

Individual reel sites that showcase craft but can't communicate the institutional backing of a full house: production management, crew depth, equipment, delivery. For large commercial briefs, a single portfolio isn't enough.

Criteria Weta Workshop The Mill Local houses MAD Production
Credentials above fold No No No Yes
B2B pitch clarity Weak Medium None Strong
Scale signaling Implied Implied None Explicit
Design

Cinematic in every frame

MAD Production website, desktop

Desktop

Full homepage view, madproduction.com

MAD Production website, mobile

Mobile

Responsive layout at the phone breakpoint

Cinematic dark aesthetic

Near-black base with high-contrast red accents and film-grain textures, a visual language borrowed from the productions themselves. The site feels like an opening sequence, not a corporate page.

Four service pillars

Feature Films, Commercials, Documentaries, and Director Services, each with its own visual identity within the page, giving commissioners a clear taxonomy for where they belong.

Featured works grid

A curated three-production showcase positioned immediately after the services: named projects with still frames that turn the credibility claim into visible proof before the visitor reaches the contact form.

Process

How it came together

01

Creative direction

Defining a visual language rooted in cinema: dark, dramatic, and authoritative. The brief was that the website must feel like the work, not describe it.

02

Visual design

Jet-black base, cinematic red accents, bold display typography. A hero headline reading as a declaration, not a tagline, with stats placed to land before doubt can form.

03

Content structure

Hero → Credentials → Services → Featured Works → CTA. A sequence designed to establish authority first, then demonstrate range, then invite the project conversation.

04

Build & launch

Full front-end development, responsive across all devices, fast-loading even with cinematic imagery, and built to scale as the production catalogue grows.

Results

Impact

Catalogue led

The full scale of the client's production history surfaced as the centrepiece credibility signal, before a single project is clicked.

4

Service verticals clearly defined: Feature Films, Commercials, Documentaries, Director Services.

Delivered

Completed and delivered, mobile-first, built to convert visitors into project inquiries.

MAD Production now has a website that communicates the scale of their work before a single project is clicked. The cinematic aesthetic positions them above generic production houses, and the structured service layout makes it easy for commissioners to see exactly where their project fits.

Next project

Hypertalent →

An HR and recruitment firm that needed to look as enterprise-ready as the clients it aimed to attract.