FILM EDITOR PORTFOLIO · PERSONAL PROJECT · BUILT WITH CLAUDE CODE
A portfolio site for my brother, a film editor who had been looking for work for over a year, designed and built with Claude Code.
My Role
Designer and builder: content structure, art direction, and directing Claude Code from first draft to live site
Engagement
Personal project, for my brother
Surface
One-page portfolio website
Built With
Claude Code, hosted on Netlify
Context
My brother is a film editor and filmmaker. He had been looking for work for more than a year, and his best cuts were spread across Google Drive folders and YouTube links.
Every time he pitched himself, he had to gather links again and explain what to watch first. There was nothing he could send that showed who he was, what he’d worked on and how good his editing is, all in one go.
He needed one link that did the pitching for him.
Live on Netlify
View Live Site →
What was getting in the way.
The work was good. Getting someone to see it was the hard part.
SCATTERED WORK
Drive folders and YouTube links
His best cuts lived in different places, with no order and nothing saying which to watch first.
NO FIRST IMPRESSION
Reels before any context
Nothing introduced who he was, what he’d worked on or what kind of editor he is.
MANUAL PITCHING
Starting from scratch every time
Each application meant collecting links again and writing the same explanation.
The design objective: let the work make the pitch.
The people hiring editors, like directors, producers and studios, decide quickly whether to press play. The site had to earn that click in the first few seconds.
WHO IT’S FOR
People who decide in seconds
Directors, producers and studios scanning for the right editor.
WHAT IT HAD TO DO
Everything in one scroll, behind one link
Who he is, his best work, his credits and his path, without opening a single folder.
One scroll, in the order a director thinks.
The page runs from first impression to proof to contact, so whoever lands on it never has to hunt.
Hero with looping reel
→
The Cut (about)
→
At a Glance (credits)
→
The Sequence (work)
→
Toolkit (skills & gear)
→
The Timeline
→
Let’s cut something (contact)
Who he is, his training and the productions he’s worked on, early on the page.
Eleven projects in one grid, each showing his role, from documentaries to AI-led brand work.
Six career stages, from KC College to AI commercial work.
The decision that gave it a pulse.
The first AI-built version worked, but it looked like any other template: a name, a title and a few buttons. For someone whose craft is moving images, that said nothing about him. So I added a short clip of his work to the hero, playing on a silent auto-loop. It’s the first thing anyone sees, and it shows his editing before they read a word.
FIRST VERSION
WITH THE LOOP
AI made the site quickly. The loop is where his personality came back in.
Film language in the copy
Sections read like an edit: The Cut, The Sequence, The Timeline, and the contact line says “Let’s cut something.”
A timecode, not a tagline
A REC timecode in the hero sets the tone before any text does.
Credits up front
The productions he’s worked on sit in At a Glance, right where a producer looks first.
What AI did, and what I owned.
Claude Code wrote the site. The decisions about what it should say, and in what order, stayed with me.
I OWNED
✓
What the site had to do, and who it was for
✓
The order of sections, with credits and work early
✓
Choosing, with my brother, which work to show
✓
Adding the looping video to the hero
✓
Reviewing each section until it felt like him
✓
Getting it live on Netlify
AI HANDLED
–
Writing the code for every section
–
The first layout and visual direction
–
Responsive behaviour across screen sizes
–
Quick changes as we iterated
One link, and a job a month later.
The site became the link he sent with every application. A month after it went live, he got a job, after more than a year of looking. I can’t credit the site alone for that, but it meant every conversation started with his work instead of a list of links.
What this project demonstrates.
Designing for a real outcome
The goal was never a nice website. It was getting him noticed by the people who hire editors.
Directing AI without losing personality
Letting AI handle the build, and stepping in where a template would have flattened him.
Knowing what to show first
Ordering a career so the strongest proof lands in the first scroll.
Shipping end to end
From scattered folders to a live site, designed, built and hosted.
AI got the site built. The hero loop, and the order of everything after it, is what made it his.