Wholesale transformation: user-centred design for St Austell Brewery

We believe that businesses win when they provide online experiences that meet the needs of their customers.

That’s why we take time at the start of every website project to really get under the skin of the people who will be using the site – we want to understand their priorities, challenges and goals.

We call this our ‘Discovery’ phase and it’s the job of our strategy and UX teams to make sure we know enough about our audience to be able to design a solution that meets their genuine needs.

But, rather than write more content about UX theory, we thought we would share a bit of a behind-the-scenes look at how that works in practice.

So, three months on from launching the site, we are looking back at our work with St Austell Brewery and how we took the project from a client challenge to a user-centred website.

The opportunity

The original brief from the team at St Austell Brewery was to build a digital home for their free-trade proposition; that’s the part of the business that supplies drinks to bars, pubs, clubs and restaurants across the south west.

Like most of the industry, St Austell Brewery’s wholesale business operated in a fairly traditional way - a road-based salesforce went out to meet with customers who chose drinks from a seasonal, printed, product brochure and placed orders to an inbound telesales team.

This process was less than ideal.

It made it difficult for customers to get a sense of the range of products available (you’re never going to get 1,500 options into a printed brochure!) and meant the business was missing out on opportunities to up-sell and cross-sell.

There was a clear opportunity for St Austell Brewery to grow their free-trade business by making it easier for publicans and bar managers to quickly and conveniently research, choose and order new drinks online.

User research

We started by getting out of the office, knocking on doors and speaking to some publicans.

We asked them about their order process: how do they manage their stock? How often do they order in new deliveries? Which product lines are most important?

We found that, often, this was a paper-and-pencil job, with bar managers descending into a dark, and wi-fi free, cellar to make notes on which beers, wines and ciders were running low and needed to be replenished or replaced.

They then went to order drinks over the phone, where they wanted to order the right products, at a good price as quickly as possible.

Straight away, this told us a lot about the type of digital solution we needed to design:

• The site navigation had to be simple and straightforward, so our users could quickly find their drinks from St Austell Brewery’s wide range of options

• It needed to be able to work offline, so that users could select drinks on the site whilst they were in the cellar and without internet access

• Users needed to be able to save their regular orders, so that they didn’t have to go through the hassle of choosing the same products every time

• Special offers and promotions needed to be highly visible as users wanted to make the most of savings and discounts

Card sorting

Getting the site’s information architecture right was our next big challenge.

The wholesale drinks business has its own jargon so we needed to make sure we used language that our audience would understand and structure the content in a way they would find intuitive.

So, to make sure we got it right, we arranged a card sorting exercise with a small group of bar managers and publicans.

This involved giving them a list of different product lines and arranging them into categories that made the most sense to them - how should beers, ales, lagers, draughts, bottles and cans all fit together in the most logical way?

Getting the perspective of real users at this stage helped us to strip out our own preconceptions about what should go where and make sure the taxonomy reflected our users' intuitions instead.

Prototyping & user testing

Once we understood how our audience thought about the different drinks categories, we started to build a prototype of the site’s navigation.

We used low-fidelity prototyping tools to quickly and cheaply produce something that would allow us to start to test our approach with real publicans and bar managers.

By setting them tasks – like finding a specific drink, or carrying out a typical order – we were able to monitor the way they interacted with the prototype and find out where they were stumbling with the navigation or taking longer than we had hoped to find their way around.

With this direct feedback from our user group of publicans, we were able to make some more practical changes to our design:

• Non-alcoholic and low-alcohol drinks were a more important product line than we had anticipated and were buried too deep into the site, so we raised it higher in the site’s information architecture

• We made quick links in the navigation for seasonal product lines too, after we found that there were fluctuations in the types of orders our users wanted to make throughout the year

• We dedicated space in each drinks category for advertising space for drinks brands, so that St Austell Brewery could generate additional revenue from their partners

With our designs finalised, we were ready to move the project over to our technology team for our build phase and the first iteration of the site was pushed live earlier in the year.

Impact

Although the site has been live for a few months, it’s still early days in the project and we have further developments to come.

Client feedback and website analytics show that the site is already making a real difference to St Austell Brewery and their free-trade customers:

• Soft metrics like traffic, bounce rates and pageviews are all as per expectations