Case Study
Visit Winchester
UCD • Branding
An overview
The Winchester tourist board contacted us to inject some innovation into their dated and poorly functioning Wordpress site. Their passionate and knowledgeable team were frustrated that their site no longer reflected the experience and vibrancy of the ancient, cultured city and were disappointed that their sponsored advertising model was not generating profitable conversions. Read on to see how we fixed that.
👨🏻💻 Role: UX/UI Lead
💻 Platform: WordPress
👥 Team: 2 Devs, 1 Designer
👁 Vision: Mobile 1st Brochure
⏱ Delivery: 3 Months
💼 Agency: Advantec
Defining the problem
In collaboration with the Visit Winchester team, we initiated a ‘round-table’ discussion. During this discovery meeting we ran a user centred design workshop. An important part of that process involved a series of interviews with their team to better understand their pain points, user types, their users’ issues and their vision for the future.
From here we decided to run a two week Hot Jar heat mapping/data collection exercise to gain insight into how users were interacting with the site. We were able to identify correlations between the heat mapping data and the answers to our questionnaire. It became evidently clear that the site UX was confusing and disjointed. The mobile experience was broken and users weren’t getting the value they sought from the 100’s of businesses and attractions that Winchester had to offer, both during or before their visit. As a result, users were simply not clicking through to attractions, via sponsored content; a lost opportunity.
Personas
Using interviews and looking at session data, we also defined 3 key user personas to refer to during the design process, helping us to focus on the user, keeping them at the heart of the process at all times. Now that we had a solid foundation of research and had defined our “How might we” (HMW) statements, we were confident that we could now start the process of ideation.
The challenges
Once we had identified the key problem statements, we worked with the team using the ‘HMW’ method of the UCD process to focus on 3 main areas to ideate around. These were; 1. How might we improve the online experience of visitors whilst they were visiting Winchester? 2. How might we better promote sponsored businesses and attractions on the new site? 3. How might we improve the value of the site content to communicate the brand message of ‘Vibrant. Ancient. Cultured’?
The concept
Working closely with the Visit Winchester team, we ran a design sprint to flesh out the information hierarchy of the new site using a sticky-note exercise. This allowed us to efficiently determine the value of the site content. From here I was able to wireframe the user journey using Sketch and rapidly prototype it for early testing, using Invision.
UI design system
Special attention was given to the UI by defining a unified design system. This aligned the digital brand guidelines with the offline brand and solved the issue of the previously disjointed interface, resulting in a pleasant user friendly experience across devices.
Parallax
To help communicate the heritage and culture of the city, a parallax scroll was introduced to the homepage. The interaction focuses on the statue of King Alfred (who sits in the centre of Winchester), gracefully rising above a scenic backdrop of Winchester on scroll.
As advertising was at the heart of the revenue model of the business, a set of dedicated ad spaces were designed to be incorporated across the site. This allowed Visit Winchester to sell these spaces and switch them on where suitable.
Custom icons
Interface
An ‘AirB&B’ style, icon based, interactive map was introduced to help users quickly navigate and filter listings, whilst in the city. Considered UI was implemented to help bring subtle attention to sponsored businesses and attractions, making them more visually appealing. Clear signposts were introduced to ‘What’s on’, ‘Map’ and ‘Things to Do’ to reflect the result of the heat mapping data. Listings were redesigned with scrollable galleries, video and search engine friendly content, along with clear calls to action designed to increase time spent on pages and the chance of a click through.
Homepage concept
The results
The new site was a massive step change for Visit Winchester. It allowed them the flexibility to really start to manoeuvre within the revamped online experience and improved business model. The site increased user session time both during and before visits to the city. From Google analytics reports, we witnessed a 28% increase in organic traffic and a 26% reduction in bounce rates, specifically at mobile. The new advertising model has vastly increased uptake on purchased advertising and listing space, on a month on month basis.
What the client said
Rachel Gander
Tourism & Development Officer at Visit Winchester
“I’ve been absolutely delighted with the design process. We felt that you really understood where we were coming from and what we were trying to achieve - leading to a beautifully designed website which showcases our new brand consistently. We’ve been so pleased with the ease of the design process and Joe’s skills that we’ve asked him to design collateral for our tourist information centre. Altogether these elements combine perfectly to reinforce the brand across multiple platforms.”
Next project Covers
