Live demo

Portfolio concept / 05

The Rowan Arms

A bold sporting pub website: a burgundy opening, interactive draught collection and match-day programme, presented under a fictional venue identity.

Industry
Hospitality / Pubs
Project goal
Discovery and visit planning
Scope
Design / Development
Status
Portfolio concept

An existing tavern website design by C Lambie, adapted for portfolio use with a fictional pub identity and example venue information.

01 / The brief

Keep the character. Give it a fictional home.

This portfolio adaptation keeps the original tavern website’s layout, styling, drinks collection and interactions. The task was to replace the real venue’s identity and practical information, rather than redesign the experience. A fictional wordmark, example location and original games illustrations allow the design to be explored without presenting a real pub’s business details or implying its endorsement.

02 / Across screens

The same idea.
A different screen.

The original responsive layout is retained. Desktop balances the large introduction with the animated drinks stage and carousel. On phones, the sporting headline leads into the drinks stage, the carousel simplifies and a compact menu exposes the main sections. Match-day fixtures and games cards become a single column. Vertical scrolling and pinch zoom remain available during touch interactions.

Screenshots of the adapted working website at 1440 × 1000 desktop and 390 × 844 phone viewports, before the pump-to-pint interaction. The phone preview shows its first screen rather than a stretched full-page capture.

03 / Design decisions

Three choices.
Each with a purpose.

  1. Make match day the starting point.

    Visitors need to understand the kind of evening on offer and find the programme quickly.

    A bold Watch, Play, Stay opening introduces the sporting direction. A separate match-day board uses fictional teams and explicitly labelled example times, with a clear route to the practical venue details.

    Explore the match-day boardThe fictional Rowan Arms match-day board with example teams and kick-off times.
  2. Turn choosing a drink into a demonstration.

    A working interaction lets visitors experience the craft instead of relying on a static mockup.

    The twelve-drink carousel retains its pump-to-pint transformation, liquid fill and 3D glass tilt. Lightweight glass previews introduce six drinks first; visitors can expand the whole collection or filter by category. Reduced motion skips the transition.

    Try the pump-to-pint experienceThe Rowan Arms drinks stage after the pump has transformed into a filled branded glass.
  3. Keep the games room and visit details clear.

    The page also needs to help visitors find games, hours and food information without getting lost in the spectacle.

    Two focused cards introduce pool and darts, using original illustrations instead of photographs of the real pub. The visit section groups example hours, food information and expandable questions; no real contact or booking routes are connected.

    Explore the games roomPool and darts cards illustrated with a cue, pool balls and a dartboard, rather than real venue photographs.

04 / Visual direction

A distinct identity.

Burgundy and warm paper frame the bold sporting headlines. An arched drinks stage provides a quieter contrast, while brass details and a dark match-day board connect the page to a contemporary local pub.

  • Burgundy#51232E

  • Warm paper#F3EFE5

  • Brass#D5BEA1

  • Night green#232724

Typography

Barlow Condensed gives the sporting headlines their bold character. DM Sans keeps longer copy and controls clear. Both families are self-hosted; the fictional Rowan Arms wordmark retains its own serif identity.

05 / What it demonstrates

The thinking behind the build.

  • Sporting art direction and responsive hierarchy
  • Twelve-drink pump-to-pint and 3D glass interactions
  • Example fixture discovery and clear visit information

The Rowan Arms and its location, contact details, hours and programme are fictional. The original tavern design and interactive drinks experience are retained; the real venue’s name, logo, photographs and contact links are omitted. Original game illustrations stand in for venue photography. Drinks branding is shown as part of the design demonstration, with no claim of venue availability, producer partnership, client endorsement or commercial results. No live enquiry or booking service is connected.

Explore the concept

Try The Rowan Arms.

Explore the live demo