Portfolio websitesClient projects · 2026Portfolio websites, from mockup to launch
For a sports photographer, then for a documentary filmmaker, I designed, developed and launched their websites.
- BKBSHOTS
- How do you let visitors browse hundreds of images without ever making them wait?
- Nedim Torun
- How do you make people want to see the films, then contact the director?
- My part
- I decide and test, Claude Code writes the code.
- Deliverable
- 2 live websites, hosting
- Role
- website design, development, launch
- Clients
- sports photographer, documentary filmmaker
- Team
- solo, with Claude Code
BKBSHOTS
A sports photographer's website“The watchword for the site is fluidity and infinity.”
The photographer covers sport: AFCON, Six Nations, Diamond League. His photos are often dark and all in portrait format. His site had to scroll through them endlessly, without ever distorting them.
Decisions
A single word to change project
The scroll wheel and dragging always move through the photos. Changing project only happens through this list.
The photos stay visible
Only a light veil: the series changes live behind the list. Clicking another project shows it without closing the list.
An endless mosaic
It extends in both directions, and two visible tiles never show the same photo.
- The photo travels from one view to the otherWhen zooming, as between SERIES and ALL, it leaves from its exact place and returns to it: you never lose what you were looking at.
- A cross to leave the zoomEsc and the site name already closed it, but nothing on screen said so. The cross, drawn like the arrows, also works with the keyboard and by touch.
- The menu in negativeThe names of the projects not selected invert the photo they cover, like all the text on the site. The selected project is the only one that stays white.
- Focus pointsSeven focus frames, as in a viewfinder, show loading, the position in the series and the selected project.
What I learned
- No bounceI ruled out movements that overshoot their target: they drew the eye to the movement, not to the photo.
- The real phone has the last wordA black screen only appeared on iPhone. An error log displayed on the phone helped find the cause.
- Every decision is written downI decide and test, Claude Code writes the code. Each choice is written down with its reason, so that no fix gets undone later.
Nedim Torun
A documentary filmmaker's websiteNo fades: what arrives moves up, what leaves moves back down.
The director makes documentaries, short and feature-length films. His site had to show his films first, then give people a way to contact him, in French as well as English.
Decisions
The film first
The player takes up all the space, at the same distance from the name as from the bottom bar.
Docked
A downward gesture docks the video on the left and opens the description. There is no in-between position.
Two films per row at most
So that two projects are never confused. On hover, the film's video starts playing in its tile.
- The next film appears on hoverIts video follows the mouse as a thumbnail. A sideways gesture changes film, one at a time.
- A single action stands out“Watch the full film”, in white on black, just below the synopsis.
- The status, nothing elseIn the grid, each film only shows its title and its status: the year, or “In production”. The rest is in the description.
- Loading opens onto the filmThe loading line stretches to the width of the video, then a window opens in its place: you land straight on the film, without a fade.
What I learned
- Video on iPhone has its own rulesMuted sound, inline playback, Low Power Mode: each safeguard in the player answers a problem seen on iPhone.
- Hierarchy without shrinkingNo text under 14 px: hierarchy comes from weight, grey and letter spacing.
- A single typefaceOne variable font carries the site's three voices: the text, the numbers and the poster titles.