Our build

Design Choices & Why We Made Them

How our redesign improves on both the current live site and the developer's £50,000 mockup — explained without jargon, for anyone who wants to understand the thinking.

First, credit where it's due

What the developer's mockup got right

Before explaining our changes, it's worth being clear about what the developer's mockup did well. The palette, the fonts, and the general feel were genuinely good — and we kept them.

  • The typeface pairing — Cormorant Garamond for headings and Jost for body text — is sophisticated and right for a heritage brand.
  • The colour palette — warm cream backgrounds, deep crimson accents, teal highlights — is miles better than the current live site's dark mode and feels connected to the Castle.
  • The film card grid — showing content as cinematic, full-bleed cards — is exactly the right way to present a video membership.
  • The scrolling news ticker — a moving band of recent headlines — was a smart editorial touch borrowed from quality journalism sites.
  • The overall direction: light, warm, editorial, unhurried. Right.

What we changed — and why — is below.

Hero image

Showing the Castle, not the sky

The problem

The developer's mockup used a test placeholder image with no focal point set. On the live site today, the hero shows only the very top of the Castle — you see roof and sky, and the building is barely visible. When you display a tall photograph inside a fixed-height window, it defaults to showing the top of the image.

What we did

We set the focal point to 60% of the way down the image. This means the browser always frames the Castle itself — the facades, the towers, the parkland in the foreground — regardless of screen size. On a desktop widescreen, on a phone held portrait, on a tablet, the Castle is always the thing you see.

The hero is the first thing any visitor sees, and it should immediately answer the question"where is this?" This is the single most visible improvement on the page.

Content statistics

Context, not a scoreboard

The problem

The current live site shows "230 Videos · 48 Book Club · 35 VR Tours" in a separate dark-red band immediately below the hero — three numbers in a row that read like a software feature comparison table. The mockup omitted them entirely.

What we did

We moved the stats inside the hero itself, placed quietly below the headline text, separated by a faint dividing line. They read as a gentle reassurance, not a sales pitch.

The numbers tell you the membership is already substantial and active. But by keeping them inside the hero — rather than giving them their own section — they feel like context rather than a boast. The Castle stays the hero. The numbers support it.

News ticker

Freshness without clutter

The problem

The developer's mockup included a news ribbon, but it was static — the same few headlines sitting still in a bar. A static bar of old headlines reads like a noticeboard that hasn't been updated in months.

What we did

The news items scroll continuously, like the headline bars on a quality newspaper website or a TV news channel. Hovering over the bar pauses it so you can read a headline properly. On phones, the ticker is hidden — at that size it would be too small to read while scrolling.

Movement signals that the membership is alive. There are new things happening. Someone is tending to this. That impression — that the community is active and current — matters enormously for a membership product.

Welcome section

Video and text that stack on mobile

The problem

The mockup placed the video thumbnail on the left and the introductory text on the right — a good layout on a wide screen. On a phone, both columns were shown side by side, which meant the video was tiny, the text was squashed into a narrow strip, and neither was comfortable to read.

What we did

On desktop, the two-column layout is kept exactly as designed. On phones and small tablets, the columns stack vertically: the video comes first at full width, then the text below it, also full width. Neither is compromised. We also added a small "Video" badge to the thumbnail to make clear it's clickable and leads somewhere.

The welcome letter from Lord and Lady Carnarvon is the emotional heart of this page. It should be easy to read on any device — especially a phone, where most people will first encounter the site via a social media link.

Film grid

Desktop cinema, mobile list

The problem

The mockup used a "featured card" layout — one large card spanning two columns on the left, three smaller cards filling the right. Striking on a wide screen. On a phone, that layout became unusable: the cards were squeezed into a tiny grid, making titles unreadable and images postage-stamp sized.

What we did

On desktop, the featured card layout is preserved exactly. On phones, the grid switches to a single column — each film card becomes full width, with readable titles and labels. The featured card also has a "Free preview" badge to show non-members they can sample content before joining.

Scrolling through one card at a time is the natural way to browse content on a phone. The "Free preview" badge is a deliberate conversion tool: showing people what they're missing before asking them to pay.

Book Club section

The date card deserves to be seen

The problem

The mockup had a bold crimson date card on the left — the day, time, and event details in large white type — with the description and join button on the right. On a phone, both columns were shown at half width simultaneously, making the date card barely legible and the description cramped.

What we did

On desktop, the two-column layout is preserved. On phones, they stack: the date card sits at full width, then the description, then the join button beneath it.

The date card is one of the strongest design elements on the page — bold, crimson, authoritative. It deserves to be seen properly, not squeezed into half a phone screen. Stacking it gives it the impact it was designed to have.

Pricing

Prices shown clearly, not buried

The problem

The developer's mockup showed a single starting price with a join button — the tier structure (Friend at £125, Patron at £420, Pharaoh coming soon) wasn't visible at all. On the current live site, all pricing is buried on the registration page, mixed in with the signup form and payment details.

What we did

Three pricing cards, side by side, with actual prices shown prominently. The Patron tier is visually highlighted — different border, "Most Popular" label, crimson button — to guide people towards it without being pushy. All features are listed on each card so a visitor can compare at a glance. The monthly equivalent ("that's just £10.42 a month") is shown beneath the annual price.

Visitors who don't know what something costs tend to assume it's expensive. Showing the price early — and reframing it as a monthly figure — removes the anxiety and replaces it with pleasant surprise.

The small things

Deliberate details

A few smaller decisions that add up to the overall feel:

  • Square corners on every button

    No rounded edges anywhere. This matches the mockup's aesthetic and is a deliberate signal: this is not a generic tech product with rounded "friendly" UI. This is a heritage institution. Sharpness feels considered and confident.

  • The ticker pauses when you hover over it

    Small, but important. If a headline catches your eye and you want to read it, the scroll stops. It restarts when your cursor moves away. This is a courtesy to the reader.

  • Real photography throughout

    The Castle image in the hero is a real photograph of Highclere. The welcome thumbnail is the real Lord and Lady Carnarvon. Nothing is a placeholder or a stock image.

Scope decisions

What we left out, and why

Some sections from the mockup and the current site aren't on this page. These are deliberate choices, not gaps.

Cooking & Gardening section

The mockup included this as a navigation item. We've kept it as a nav link — the section exists on the live site — but building it into the homepage would make an already substantial page longer. The homepage's job is to convert visitors into members; deep content belongs on its own page.

Events section

Same reasoning. Mentioned in the navigation but not built out on the homepage. Events are best presented where you can show the full calendar, not crammed into a landing page.

Heritage / preservation section

The previous version of this page had a dark section explaining that membership supports preservation of the Castle. We removed it — not because it's unimportant, but because it interrupted the flow from "what you get" to "how much does it cost." It belongs on the About page, where someone already interested can read it properly.

The whole picture

What makes it feel premium

The individual decisions above each solve a specific problem. But the overall feeling of the page — the sense that it's premium, unhurried, and worthy of the brand — comes from the combination of them.

Generous space

Every section has substantial breathing room. Cheap sites cram content together; premium ones let things breathe.

Restraint

The crimson is used sparingly — for the date card, a few badges, the join button. It has impact because it's not everywhere.

Consistency

Every heading is in the same typeface, at predictable sizes. Every button looks the same. Consistency is invisible when done right; inconsistency is always noticed.

It works on a phone

This sounds like a given in 2026, but as both the current site and the developer's mockup demonstrate, it isn't. A membership that relies on social sharing must be shareable. If the link doesn't work on a phone, the share is wasted.