National Museums Liverpool is a group of leading free museums and galleries including the World Museum, Walker Art Gallery, Lady Lever Art Gallery, Sudley House, Merseyside Maritime Museum, International Slavery Museum and the Museum of Liverpool. With a vast and varied range of events run across their various museums, National Museums Liverpool required an expert user experience (UX) design partner to redesign their What’s On sections from a mobile-first perspective, which would work within the constraints of their existing layout, whilst creating a far more intuitive and enjoyable end-user experience.

With events across seven museums and galleries, ranging from family-friendly to adult only, free to ticketed, and workshops to exhibitions, the existing setup was overly complicated and complex to navigate - presented in a list format for each venue - meaning high drop-off rates and demand on administrative staff to take calls and answer enquiries. What’s more, each venue’s landing page had varying styles and inconsistencies.

The core objectives for the redesign were to shift the focus to the end user, make it easily navigable and digestible, create clear calls to action (CTAs) and the ability to cross-promote events, such as themes sections or cross-city events. They wished to make it easy for users to switch between venues allowing them to better expose their full range of events, meanwhile ensuring it was clear which museum the user was actively viewing. The existing buttons and CTAs lacked consistency and vibrancy, so we sought to deliver more streamlined, concise and interactive CTAs, which provided visual cues and guided the user on a clear journey.

Constraints and challenges to overcome:

  • Design elements had to fit within the header and footer of the site
  • Styling could not be applied to the body tag on pages
  • They did not wish to have to resize their vast archive of images and therefore designs had to work within existing size parameters
  • Design elements need to work responsively, in keeping with the rest of website and existing breakpoints
  • The existing template wraps page in a form tag (.NET based)
  • Multiple What’s On sections for each venue landing page and the umbrella brand, requiring consistency
  • All content and site interactions to be as accessible as possible, following WCAG2 guidelines for double-A compliance.
National Museums of Liverpool What's On Page Design - wireframes

Our Head of Strategy and one of our design team spent a day on site with the National Museums Liverpool web team, running a workshop that explored web goals, landing page structure, website setup, KPIs, content, user groups and user goals. The session enabled the team to map out core IA for the landing pages and various user journeys within the What’s On sections. From here, and with a clear view on content prioritisation, we were able to start developing low-fi wireframes, working collaboratively to quickly establish a shared vision of where the design would go.

Our designer then spent time developing a new style guide and modular design elements, to deliver the most flexible and consistent new features within the existing setup and infrastructure of the website. A library of responsive modules and styles, provide National Museums Liverpool with a scalable solution for their What’s On sections. A key feature designed to deliver a more clear and intuitive user experience, is the date picker and event filters. This expandable/collapsable filter area allows users to refine what events are displayed to them in the below slider area, with all filters automatically applying via Ajax. A new featured banner area was also introduced, which allows the museum group to promote special events when available (and be switched off otherwise).

In addition to the library of modules, we delivered interactive prototypes for user acceptance testing (UAT), HTML coded front-end designs and guidelines for back-end implementation for their in-house development team.

National Museums of Liverpool What's On Page Design

A seamless user experience

The result is a dynamic, flexible design solution catering to the individual needs of each venue and event type, whilst creating a consistent and seamless end user experience.