Transylvania 100 — ultras beneath Dracula's castle
A concept redesign of the website for one of Romania's toughest mountain ultras — built to pitch to the organisers.
Five races from 20K to 100K start at Bran Castle. I turned a generic template into a race-first site: real course data up front, every page in English and Romanian, and a clear path to registration.
A tough race, hidden behind a template.
The original site was a Wix template: a photo, a date, and the course facts buried in long text pages. Drag the handle to compare.
BeforeAfterFour calls that shaped the site.
The course is the hero
Distance, climbing and cut-offs were buried in paragraphs.
Every race page opens with the key numbers and an interactive elevation profile built from real checkpoint data.
A runner sees how hard a race is in seconds — before reading a single paragraph.
Choose a distance by its shape
Five distances look alike when they're just names and numbers.
The Races page puts all five elevation profiles on one scale, one under another.
Picking a race becomes a visual comparison, not a reading exercise.
Two languages, one switch
Most runners are Romanian, but the race draws an international field.
Full English and Romanian versions of every page. The switch keeps you on the same page, and numbers follow each locale.
Neither audience gets a machine-translated afterthought.
Registration stays where it lives
Entries run on an external platform — a second checkout would only confuse.
A registration landing that answers everything first — prices, qualifiers, steps — then hands off. Plus a filterable entry list.
Runners reach the checkout already knowing what they need.
Built for the phone at the start line.
Most runners check the course on a phone — so every page, table and profile is designed for one-handed use.
A live concept, ready to pitch.
Live site at transylvania100.pages.dev to show the organisers.
Five race pages with real checkpoint, altitude and cut-off data.
English and Romanian versions of every page.
Static Next.js on Cloudflare — fast, with near-zero hosting cost.
Let the course do the talking.
For a mountain race the route is the product — so the design shows the mountain's real shape before any text.
