Project spotlight
I’ve recently been working with Big Bus Tours leading on their app UX, helping them solve a tricky design challenge around the booking experience.
As Design Lead, I was responsible for a phase of problem framing and ideation, directing low to high fidelity prototyping, and conducting a series of remote moderated user tests.
As part of my role, I was fully accountable for glueing all of the above together, maintaining regular and transparent communication between our design function, the engineering team, and the client. As part of my immediate team, I had one Mid-weight UX Designer and one Senior User Researcher.
Over time, we realised there were also some fundamental issues with the UI, including information architecture challenges, and a wider issue around universal vocabulary around how bus "tickets" were being labelled and understood by customers...
01 Problem
Legacy technologies and disjointed systems meant Big Bus Tours customers could not seamlessly book an experience through the app and use digital bus “tickets” without additional manual tasks.Â
There were a few main issues identified at the beginning of the project:
- Customers were passed between web-based screens and the app during the booking journey
- Customers had to manually add bookings into the app.
- Customers were not understanding the difference between ready-to-use attraction tickets and bus tour “tickets”, which had to be exchanged for physical tickets with customer service representatives on the ground before boarding the bus…Â
All of the above contravened what would be considered optimal. Over time, we realised there were also some fundamental issues with the UI, including information architecture challenges, and a wider issue around universal vocabulary around how bus “tickets” were being labelled and understood by customers.
Three important customer contexts were identified:
- New customers looking to add a booking to the app.
- Existing customers looking to locate their booking information.
- Existing customers wishing to locate a previous booking.
Digging deeper into the problem space was key; e.g., finding out more about how customers behave and what was disabling the product from working like so many other familiar products in this space...
02 Problem framing and ideation workshop
Digging deeper into the problem space was key; e.g., finding out more about how customers behave and what was disabling the product from working like so many other familiar products in this space.
I designed and facilitated an in-person problem framing and ideation workshop down at the client’s HQ in Central London, with the aim of understanding the problem in more depth, critiquing solutions currently on the market, generating some ideas to take forward, and achieving alignment on project scope across the stakeholder group.
We knew that some of the fundamental technical constraints could not be overcome in this stage of work, but we were also aware that this was only a short-term problem. Therefore, we had to ensure we had one eye on the long-term aim and design in preparation for more optimal enhancements that were not too far away.
The key outputs from this included a customer journey map which was translated into a service design blueprint. This helped us to define scope for the current project, and provide a macro view of the product and dependencies.
03 Prototyping
Following a full evaluation of the workshop output, we took the highest voted ideas and insights collected into a prototyping stage, starting on paper and progressing into a low-fidelity digital format. I led design reviews with the client, before committing an approved solution to high-fidelity.Â
The visual design took inspiration from physical ticket stubs, including some ideation around seasonal and event tours. This was rolled out throughout the experience. It’s clean, playful, on brand and was met with hugely positive feedback from my client (and customers during testing). We had designed a wallet style UI to present multiple tickets (as part of tour packages) but this was eventually pushed out of scope to a later phase of work.
Once we had a fully interactive journey designed in Figma, I led a series of remote moderated user tests to measure navigational effectiveness, the level of users’ understanding of bus “tickets” VS attraction tickets (i.e., ready to use) and what users’ mental models were suggesting. Mindful that bus “tickets” would remain invalid until exchanged on the ground, it was imperative we were able to establish this.Â
Users were recruited via a paid for recruitment platform and qualitative data was collected via observational and survey-based techniques.
Our findings revealed that although the navigational UI was effective in aiding users through the user journey, there were still issues with how bus tickets were being understood inside the app. All users assumed the busÂ
Since there was also a separate web agency in the mix, I kept them in the loop by recording Loom videos playing back the design outcomes, particularly those aspects that would influence how users were passed between web and native app technologies...
04 Output
The resulting solution was passed over to our engineering partner. I had ensured ongoing and regular design syncs with their team since the initial workshop, to ensure we had complete alignment and understanding on the design and rationale behind it. One of the real strengths to this is that human-centred approaches were kept front and centre with the engineering team, so this influenced delivery in a really positive way.
Since there was also a separate web agency in the mix here (responsible for enabling users to purchase bookings through a browser), I also kept them in the loop by recording Loom videos playing back the design outcomes, particularly those aspects that would impact how users were passed between web and native app technologies.
We’ve just secured the next phase of work which will take us back to the service blueprint. We are hoping to explore changes in the underlying technological architecture which will finally enable users to use their digital bus tickets to board the bus!