Case study · Model agency website
Outlier Models a model board you can filter, shortlist and book from.
A London model agency website for tattooed and alternative talent, with a filterable model board, a shareable shortlist and a two-step booking request.
This is the real website. Scroll it, tap it, try it. On a phone it’s best full screen.
- Type
- Model agency website
- Sector
- Fashion & talent
- Sections
- 8
- Built with
- Hand-coded · no templates
About the site
Outlier Models represents tattooed, coloured and unconventional faces for editorial, campaign, commercial, sport and beauty work. The site had to do two jobs at once: sell the agency to clients who book talent, and welcome the people it wants to sign. It opens on a looping film and the line “A London agency for faces that don’t fit the mould” — then gets straight down to business.
The idea
Most agency sites are a wall of headshots and an email address. This one is built around how bookers actually work: narrow the board down, collect the faces you like into a package, and send the whole thing in one request. Every part of the page pushes towards that package, which stays counted in a sticky bar at the bottom of the screen.
What we built, section by section
- 01
Hero film
A looping background video with a poster image, the agency’s positioning line and a single “Browse the board” button.
- 02
The board
A grid of 21 model cards — division, height, hair colour and city on each — with filters, a live result count and “clear all”.
- 03
This season
A carousel of current shoots, each tied back to the brief it was made for.
- 04
Divisions
Eight divisions explained in a line each: Main board, Ink, Commercial, Beauty, Sport, Swim, Classic and New faces.
- 05
How booking works
Five plain steps from package request to invoice, so a first-time client knows exactly what happens next.
- 06
Featured signing
A film and stills of a new face, giving the board a story rather than just a list.
- 07
Become a model
“Not like anyone else on the books? Good.” — the application pitch, a clear no-fee policy, what digitals to send, and the form.
- 08
Request a package
A two-step form: the job first, then the client’s details.
From the build
Films and pictures from inside the Outlier Models website. Swipe through.
Features
- Multi-filter model board with a live count
- “Add to package” shortlist on every card
- Sticky package bar with a face counter and share button
- Two-step booking request form
- Talent application with photo upload or links
- Looping hero film with a poster fallback
- Carousel with arrow controls
- Skip link, anchor navigation and mobile menu
Look and feel
Near-black throughout, so the photography and the tattoo work carry the colour. Headings are bold and editorial, the copy short and direct with a dry edge, and the language about fees and image usage is deliberately plain — the agency’s anti-gatekeeping stance is in the tone as much as the words.
Under the bonnet
- Hand-coded HTML, CSS and JavaScript — no framework
- PHP pages for each model and the privacy policy
- WebP images and MP4 video with posters
- Open Graph and Twitter cards for sharing
- Hosted on standard IONOS shared hosting
Like everything I build, it’s made from scratch. No page builder, no theme. So it’s quick, it works on phones first, and it’s easy to change later.
