Replacing a rigid Django admin interface with a scalable, user-driven tool that enabled Secret Escapes to grow from two to five channel manager integrations.
Year
2023
The team
Tech Lead
Product Manager (Supply)
Operations team
My role
Product Designer (supply)
Scope
Redesign to be suitable for React
Overview
What Providers Admin Tool (PAT) does
PAT sits at the heart of the supply team’s daily workflow. It allows operations team to connect hotels, configure room types, manage rate plans, track inventory, and audit changes through a detailed log, all through a central admin interface. The data flows through multiple channel managers (RateDock, SiteMinder, PHOBS, and others), each with its own integration model. PAT is the single source of truth for how hotels are mapped and priced across Secret Escapes’ booking engine.
Context & Challenge
A tool that couldn’t grow
The original PAT was built on Django’s default admin UI, the same approach used for Tracy, one of our CMS. Django admin is excellent for getting a basic CRUD interface up quickly, but it comes with serious constraints: the layout is fixed, the interaction patterns are dictated by the framework, and extending it beyond simple add/edit/delete flows requires working against the grain. It also ran on vanilla JavaScript, HTML, and CSS, no React, no shared component library, no consistency with the rest of the product.
Strategy & Decisions
Rather than designing bespoke components that would become a maintenance burden, I anchored the redesign in Ant Design, already in use across the supply team’s tools. This meant the team immediately had access to the UI that we needed. Customisation happened on top of a solid baseline rather than from scratch.
PAT’s data model has meaningful hierarchy, a hotel has room types, room types have rate plans, rate plans have dates and rules applied. The Django admin treated all of these as flat lists. The redesign introduced nested views and contextual navigation, so users can drill from a hotel into its rooms, and from a room into its rate plans, without losing their place.
A key architectural decision was to design the UI in a way that treated each channel manager (RateDock, SiteMinder, PHOBS…) as a pluggable module in the interface, not a bespoke screen. The sidebar navigation, section headers, and data tables were built to accommodate new providers without a redesign, which is exactly what enabled the team to ship two additional integrations shortly after launch.
The old Django log entry view was a raw, unfiltered table. The redesigned log view introduced filtering by action type, content type, and date, with clearly labelled change descriptions and direct links to affected entities. For a supply team managing hundreds of hotels and thousands of rate updates, this turned the audit trail from a last resort into a daily tool.
Execution
From concept to shipped flows
The redesign covered every major flow in PAT. Core screens included a Channel manager entry, hotel list, the hotel detail view (showing room types and their connected rate plans in a unified layout), modal-driven forms for adding and managing room types and rate plans, and the rate plan view with date-by-date rates, discount, promotions and LOS (length of stay) configuration.
Sign-in was redesigned with a Google OAuth flow and a provider-selection screen, a meaningful UX improvement over the Django admin’s generic login. User and group management was rebuilt with the same AntD components used across the rest of the tool, removing the jarring context switch the old admin created.
Error states, loading states, and confirmation modals were all treated as first-class design problems, not afterthoughts. Every destructive action (deleting a room type, removing a rate plan) required explicit confirmation with clear consequence language.
Outcomes
Scalability delivered
5
Channel managers integrated, up from 2 at launch
React
Modern stack replacing vanilla JS/HTML/CSS
Consistent
Design system adoption, shared library with supply
