Role
Product Designer—discovery, design, prototyping, and user testing
Client
Racing towards a new season, Ascot reached out to us to create a customizable digital sales platform. Guided by our experience in creating modular websites, we developed a design system that used interchangeable components. This gave Ascot’s clients the “royal treatment” and generated over £2.5 million in sales.
With events dating back to 1711 when it was founded, Ascot Racecourse is one of the UK's leading thoroughbred horse racing tracks. Visited by over 600,000 people a year—including Queen Elizabeth II herself—we needed an elegant solution in both aesthetics and application.
To begin, the website needed to be an engaging personalized experience that conveyed the esteem of the biggest annual horse racing event in the UK: Royal Ascot. And so, we met with Ascot stakeholders to map out the content architecture of the first of five sales modules. Not knowing what the proceeding modules would entail, we took careful consideration to clearly define the parameters.
With this in mind, I created a design system with a components library in Sketch that could later be used in the upcoming sales modules. Built using smart-layout rules, components automatically scaled as content was updated. Colours, backgrounds, and images could also be freely swapped out without issue or much effort.
Based on the Atomic Design methodology, we set out to establish commonalities between each section of content with the idea of designing components which could easily be repurposed. We then identified their primary functions which would serve as the building blocks of the website.
Next, we tested the compatibility of each relevant organism component by arranging and rearranging them to ensure the design system was truly modular. For desktop, we opted for a custom cursor that reacted to user input based on the component it interacted with. In addition, animations, transitions, and micro-interactions were thoughtfully crafted for a dynamic user experience.
Last but not least, we created a back-end for our users to access which linked to our existing CMS (Content Management System). This piggybacked off of our Pitch & Pivot sales tool (learn more) and allowed users to create tailor-made experiences for their prospective clients.
All things considered, having something personal that’s created just for you is not only appreciated, but can also set the benchmark for user experience. Creating a modular design system for Ascot taught me to be flexible and to design for scale. But more importantly, it made me look for opportunities to surprise and delight users with a personal touch.
To that end, we developed a digital sales platform that adapted to our users’ needs. We empowered them to create bespoke experiences for their clients and as a result generated over £2.5 million in sales.
A full season has passed since we launched Ascot’s website. In that time, we’ve increased product offerings, expanded personalization capabilities, and have continued to watch them grow. For this reason, we’ve also created a sales management tool for them. It allows users to track sales, losses, and provides transparency between teams. With it, Ascot has validated their website’s effectiveness with measurable success.