substrakt

In January 2023 we launched a brand new website for the National Theatre (NT) that showcases their diverse and wide-reaching offer while providing an easy, accessible and intuitive user experience. Here’s a snapshot of the project.

A focus on the user

Over the last 60 years, the NT has grown into an international institution with a programme that delivers world-class productions in theatres, cinemas and online.

With such a broad and complex offer serving a diverse range of audiences worldwide, the NT team knew their online home needed an overhaul. The website needed to shift from mirroring organisational structures to offering an authentically user-first digital experience.

Working collaboratively as partners with a brilliant cross-functional team at the NT, we designed and built their new website to help them achieve a number of specific business and user goals.

Working with the Substrakt team from a project and technical perspective has been the best collaboration I have ever had with a digital agency.
Nicholas Triantafyllou, Director of Information Technology at the NT

The new site needed to address three key areas.

The complete offer: It needed to act as a key brand vehicle for the NT and profile their full offer, giving equity to their three different ‘modes of experience’ - in theatre (South Bank, Touring, West End/Broadway), in cinema (NT Live), at home (NT At Home; digital resources) - showcasing the full brand, and replacing the previous primary focus on the in-theatre, London South Bank experience
The story: It had to communicate who the NT are and what the NT do in a way that immediately makes sense to the user, regardless of how well they know the organisation
The users: It needed to be built and designed from a user-first perspective to provide an easy and accessible user experience

How did we do it?

Created a user-centred information architecture

Our first challenge was to unpick the volume and complexity of content on the old site. We needed to represent the NT offer in an intuitive and user-centred way. This involved rethinking the way content was organised as well as language choices - moving away from organisation-first structures and jargon.

Navigation on the legacy site was overwhelming and unwieldy. We created a new, user-centred information architecture that explicitly draws attention to the three ways you can experience an NT production Throughout the navigation and on various landing pages, we made intentional language choices to make clearer user journeys.

We also radically reorganised how content existed and was presented on the website, ensuring that you don’t have to understand how the NT works in order to be able to find what you need.

With the NT’s brand promise of ‘Theatre for everyone’, we chose language that is inclusive and accessible across the site - changing phrases like ‘Research and training’ to more open and inviting words like ‘Discover’ in an effort to break down any perceived barriers to entry.

Introduced a completely new ‘What’s on’ browsing system

NT’s previous ‘What’s on’ section focused heavily on the South Bank experience. But there’s so much more on offer across the UK and worldwide. So we focused on giving parity to the full NT offer, refreshing the way events are displayed, found and browsed.

As soon as you land on the page, you're presented with the different events associated with each mode of experience - in theatres, followed by cinemas and then online. The page also offers three clear ways to filter and browse events (by mode of experience, by date and by location), with maps, calendars and listings all offered as unique discovery routes into the events offer. A key point of difference from the legacy site is the ability to browse both NT Live and NT at Home events without being forced off to their respective sites. This all contributes to a more seamless user experience and a more cohesive brand vehicle for the NT.

Signposted to other modes of experience on individual event pages

Also helping the new site to successfully profile the NT’s full offer is the content and structure of individual event pages, each of which contain clear signposts to other ways that an event can be experienced. So if a theatre show is also available in cinemas or online, you can see this on the event page and click straight through to the relevant booking site.

Developed a new workflow to improve how content is planned and delivered

Working with key decision makers and content creators internally we streamlined the NT’s content workflow, delivering training and resources that makes sure the user is at the heart of all content decisions.

We asked questions like how are decisions made about content? Who is responsible? How are the audience considered in content decisions? How is the success or impact of content measured?

This allowed us to spot opportunities for improvement and redesign a workflow that explicitly speaks to both business goals and user needs.

This project has been a shining example of collaborative working and is a huge leap forward for our online presence and audience experience
Alex Bayley, Chief Marketing Officer at the NT

Additional focuses

There were a few other key pieces of work involved in this project that have made it a success. We will be writing about these separately:

Updated visual identity: We inputted on a refreshed visual identity that would accompany the new site, ensuring that the decisions being made had considered how suitable they were in a digital context.
Focus on accessibility: We helped rethink how information about access provisions and performances are offered to users.
Integrations: We used an API feed to integrate with NT Live and NT at Home’s independent websites. This integration means users can seamlessly transition to the NT Live and NT Home sites to buy a cinema ticket or a streaming subscription.

Both we and the NT are delighted with the new site, and how we’ve worked together to get to the heart of their users’ needs to create an accessible and easy-to-use online visitor experience that accurately reflects and celebrates the full National Theatre experience.