SCORPIOS

SCORPIOS is not a hotel with a calendar; it is a place people travel to for a gathering. What is sold is an atmosphere — a season of dinners, sound, and a particular light — and the digital estate had to carry that before it carried a rate.

The brief was not a website. It was a design system for the whole brand online, an interface a guest would enjoy moving through, and — behind it — a console the marketing team could run at speed without asking a developer for anything.

Highly art-directed sites fail in the second year, not the first. The launch is beautiful; then a campaign needs a landing page on Thursday, an artist is announced on a Tuesday, and every change routes through the studio that built it. Within a season the marketing team is working around its own website.

At the same time the estate was fragmented. Bookings sat in one system, the guest list in another, payments in a third, and the numbers the team was judged on in a fourth. Nobody could answer a simple question — what did this campaign actually produce — without exporting three spreadsheets.

We built the brand a design system rather than a set of pages: a type scale, a grid, a motion language, and an image discipline that says what is photographed and what is never photographed. Every component was drawn to hold that discipline even when the person using it is in a hurry.

Typography & grid

A display face used at sizes that are genuinely editorial, set against a tight sans for anything functional. A twelve-column grid with a generous measure, so the page reads as a printed programme rather than as a template.

Motion

Reveals timed to the pace of the photography — slow, masked, never bouncing. Motion is used to control the order in which things are read, and it is switched off entirely for anyone who has asked their system to reduce it.

Image discipline

Fixed crops, a single grade, and a rule against stock. The library was delivered in every ratio the layouts need, so the art direction survives contact with a marketing calendar.

The interface work was mapped from the two ways people actually arrive: the traveller who has heard of a gathering and wants dates, and the one who has heard nothing and wants to understand what this place is. Those are different journeys and the site serves them separately rather than averaging them into one homepage.

Wayfinding

A structure built around the season — the programme, the setting, the stay — rather than around the company's internal departments. Three taps to a reservation from anywhere, and never a dead end.

The reservation flow

Dates, space, guest, payment, on the property's own domain and in the property's own type. Prototyped and tested against real enquiries before a line of production code was written.

Performance as design

Images served at the exact size each layout needs, video decoded lazily and paused off-screen, fonts subset and preloaded. A page this photographic still opens in under a second on a phone.

Accessibility

Contrast, focus order and keyboard behaviour audited against WCAG AA. The reduced-motion path is a designed state, not a fallback that quietly breaks the layout.

The most valuable part of the build is the part guests never see. We built an editorial console for the marketing team — not a generic CMS with a plugin, but a small admin shaped around the eight things this team actually does.

Composable pages

Campaign and announcement pages assembled from the same design-system blocks the studio used. The team can build a launch page in an afternoon and cannot build an ugly one, because the components will not allow it.

The programme

Dates, artists, spaces and capacities entered once and rendered everywhere they appear — the season page, the individual listing, the structured data, the newsletter.

Media library

Uploads cropped to the approved ratios on the way in, with rights and credits recorded beside the file. Nobody has to remember which photograph may be used where.

Roles & review

Draft, review and publish with a real preview at each step, so a page can be signed off by someone who does not work in the tool every day.

Rather than replace the tools the business already ran on, we made the console the single place a person works and let it speak to everything else. Each connection is two-way and each failure is loud rather than silent.

                               ┌──────────────────────────┐
                               │     SCORPIOS Console     │
                               └─────────────┬────────────┘
                                             │
          ┌──────────────────────┬───────────┴──────────┬──────────────────────┐
          ▼                      ▼                      ▼                      ▼
┌───────────────────┐  ┌───────────────────┐  ┌───────────────────┐  ┌───────────────────┐
│      BOOKING      │  │    CRM & EMAIL    │  │      PAYMENTS     │  │     ANALYTICS     │
│ Rates & inventory │  │  Guest lifecycle  │  │  Cards & deposits │  │ Server-side events│
└───────────────────┘  └───────────────────┘  └───────────────────┘  └───────────────────┘

Booking & inventory

Availability, rates and restrictions read from the reservation system in real time, so a page can never advertise a date that has closed.

CRM & email

Guests, consent and lifecycle events flow into the CRM as they happen. A campaign built in the console arrives in the newsletter without anybody re-typing it.

Payments

Cards, deposits and refunds handled by the payment provider with PSD2 and 3-D Secure done properly. The console shows the state of a booking without ever holding a card number.

Analytics

Server-side event collection with consent respected, so the numbers survive the browser changes that have quietly broken most hospitality reporting. Campaign, page and reservation are finally in the same report.