Redesigning Lucky Bowl's Event Booking Process
Project overview
- Mood board
- Competitor review
- User testing
- Affinity Mapping
- How might we...
- Brainstorming
- Usability testing of wireframes
Research
User testing to evaluate the event booking process
I didn't have any quantitative data on LuckyBowl so I reviewed competitor sites. Those in Norway didn't have any online booking functions so I looked at some outside of Norway, including Bowlero and Roxy, I also looked at sites that were similar and had a booking process, such as Rush, Innoflate, SAS, Air BnB, Museum websites etc. This provided me with ideas and inspiration as well as an idea of what features users might expect to find within the booking process.
This highlighted opportunities such as:
- Offering packages to reduce cognitive load and upsell
- Adding information about players prior to visit - to save time later
- Being able to switch locations
- Being able to switch activities
- Offering more than one payment option - users are used to Apple Pay, Vipps etc. and it helps conversion rates
- Upgrading to a more modern location finder - nearest locations, list view, searchable
- Ability to clear all dates
My target audience were people who would be booking an event, so I asked them questions to find out what they would want to be able to do. I tested the existing site with them too, asking them to imagine a scenario where they needed to book a birthday party for their child who is celebrating together with a friend, so they would need to check availability of two different dates to find a date and time that works for both families.
Miro was used to visually summarise the results and it became clear that users expect to:
- See options and prices available - either per person/package or see it update when customising an event
- Be able to check availability
- View possible locations
Pain points revealed included:
- Users were confused when they had clicked on "Order" from the Birthday landing page and then had to choose birthday again after choosing their location
- Trying to go back within the order process or edit any choices left users confused as to where their order had gone
- Users couldn't edit the names of those celebrating, their age, the number of guests, their chosen activity, number of series or any times chosen without losing their order
- An unnecessary page with a telephone number field input (users were also asked for this on the next page)
- No mandatory fields on the enter your details page are marked and errors aren’t always highlighted leaving a user guessing.
Positives included:
- The site uses progressive exposure which is good for a booking process where users have to make a lot of choices
- They up-sell add-ons
- It shows the user an overview of their order even if it's not 100% complete and doesn't show the price until the very end
The below images show parts of the existing booking process where (from left to right)
- People have to click through the beginning of the booking process twice to be able to check availability on different days easily
- A user is asked for unnecessary information (name and age of jubilant) at the beginning of the booking process
- The edit buttons that cause a user to lose all the information they've entered
Ideating
Brainstorming
Using insights from the user testing, together with inspiration from my competitor review and mood board, I began brainstorming how a new design might enable users to easily:
- Check availability for different dates
- Edit their order
- Choose from packages
- See prices as soon as possible
In order to put together the information architecture I began looking at the site’s existing data including the number of locations, activities, events, and the FAQs. When I began mapping the user flow I uncovered some more friction points and inconsistencies including:
When specifying the number of guests:
- Birthday and group arrangements use a counter whereas all the others use buttons, together with a drop down menu when over a certain number of guests
- Whether the system differentiates between children and adults is different across the activities/events/promotions and even locations!
- The system is set up to enable a user to book a one 25 minute Lasertag session for 20 adults and 20 kids or 40 for a birthday party, but group arrangements are limited to a minimum of 4 and a maximum of 7 guests.
- Lasertag offer a choice of 0 - 9+ people, but doesn't allow a user to continue as there's a minimum requirement of 8 people, however if booking a birthday party a user can have 4 guests and still book lasertag
- When choosing bowling “Spill så mye du vil”, a user can select 30 kids and 30 adults, but the system says there are no times, but when changed to 30 adults it goes through
- Bowling & Sommerkampanje - shows 9+ and a drop down with up to 30 guests, but then a tooltip that states "If you are more than 8 people click here"
- There’s an option to choose 0 as the number of guests
- Sesongavslutning is children only which is inconsistent with birthdays
- Only the group arrangement asks about age in order to decide whether to present alcoholic drinks option - are birthdays only limited to children?
The drop down menu via the links for “if you are more than - - guests” is inconsistent - “Firma” should be Team Building” and some events are included, but not others? Firma, utdrikningslag, lagfest, klassefest, bowling.
Each event type has its own landing page but the CTAs from these pages, as well as the cards on the homepage, take a user to a page where they then have to choose what they wish to book again - sometimes from a list of over 8 choices. Even though this may be thought of as the exception to the rule, seeing as the majority of locations only offer bowling and lasertag, it’s not a good experience for those locations that do over several activities.
IMAGE
For example Lagfest (Team party) has a landing page titled “Lagfest” but has “sesongavslutningkampanje” on the main page, on one location it's called "Klasse og largest kampanje". What would the Lagest be without this if someone was to order outwith the promotional rules? Then when the user clicks on order, should they choose “Gruppearrangement” or “Sesongavslutning” on the “What do you want to order” page? So the majority of events are funnelled into the choice “Gruppearrangement”, but with the exception of birthdays and sesongavslutning (end of season celebrations).
When booking a birthday party a user can choose from an age range of 4-99 but a pop-up when no food has been chosen refers to "Barnebursdag" (Children's Party).
Activities
A few locations state that they have, for example darts as an activity on the homepage for that location, but they have no booking process whereas others do.
- The drop-down on the “Hva ønsker du å bestille” page that enables a user to change their location doesn’t show the location Asker
It's often parents who book class and team parties in addition to birthdays and family bowling so having consistent rules for the system set up, not only avoids disappointing or frustrating customers, but also ensures the business functions as efficiently as possible. All of these small things can add up to a frustrating experience or begin to erode trust prior to a users visit.
Brainstorming
I used the Scamper brainstorming method whereby you generate ideas by trying to think about what you could:
- S - substitute
- C - combine
- A - adapt
- M - modify/magnify/minify
- P - put to other uses
- R - reverse
- R - re-arrange
I also tried the worst-case scenarios method, but the Scamper method produced the most ideas, some of which included:
- Creating packages for events
- Differentiating between activities and events
- Differentiating between food-related extras and add-on activities
- Adding age to guest picker - automates the 18+ option
- Default location with a “Not you location? Link
- Update location list to a more visual card-list
- Day and time slots with a calendar option
- Change drop-down activity list to a visual-card list
- A visual order summary for sharing
- A 24 hour reservation period to share prior to confirmation
- Visual graphics/tags for promotions
- Flexible dates flow? Reverse order
- Location finder - what’s on tonight
- Compare availability of different locations
- Switch location easily
- Remove the telephone number screen
Ideating
Creating and testing low fidelity wireframes
I created basic wireframes to visualise and test the flow of the booking process. Initially I had created the design using drop down boxes thinking these would be the most efficient on mobile, but after testing I moved away from them because when choosing a location a user had to scroll far down which wasn't optimal on a mobile. So I updated the design so that they clicked on buttons, which in the case of several choices opened up a new window and in the case of just 1-2 choices a user could click quickly on a button. This new window also enabled a more visual list view over the more traditional drop-down menu list.
To enable users to check availability quickly I first differentiated between activities and events using tabs. I then changed the flow so that they select the minimum number of choices, so - location, event type, activity, the number of series/time and guests. However after testing I realised that they were choosing a date on the very first page, then saw availability on the next page, but had to go back a step to change the date. So I moved the "Choose a date" drop down to the second page.
IMAGE
After further testing I realised that the date picker was still not optimal, so instead of opening up just a calendar I introduced date tabs so that a user could click on 3 default dates and view availability for each, but also open up the calendar if needed. They could then easily see available times over three days using the tabs.
I had also set up the prototype assuming that they were choosing bowling, so I updated the flow to reveal the bowling or laser tag choices - this was based on the fact that out of the 25 locations all offered bowling, 12 offered both bowling and lasertag and just 4 offered these and additional activities.
Additional updates through iterations included:
- Tagging activities and extras with “popular” (social proof)
- Adding a clear all ghost button
- Showing which activities were not available, but providing a link to change the location
- Updating the steppers to be clickable and take a user to the stage they clicked on
- Auto calculating the time to play 1 or 2 series of bowling
Ideating
Solution
The final solution solved the problem of users not being able to view availability easily through the use of tabs controlled by chips. The task success rate for the existing site was 50% - where users either deleted their order or upon hitting back had to start again anyway to be able to check a second date. The new design increased the task success rate to 100%.
Additionally users can edit their choices throughout the process without losing information.
- A chip solution enables users to easily see and edit their choices throughout
- A stepper shows users where they are in the process and enables them to easily navigate between the order stages
- All information not required to check availability is moved to after this stage
- Price per person is added so that users can see the price when entering the number of guests
- A bottom draw is accessible for users as they proceed through the order process
- A carousel on the homepage markets activities and food and drinks
Iterating
Updates and next steps
I completed a heuristic review of the redesign and based on the findings I made the following changes:
- Ensured there were two ways in - through the hamburger menu, a visual card on the home page and through a Birthday landing page.
- Added error messages if a user hadn’t entered data that is required to continue or was going to delete their order. (This would also apply to food, drink or activities in a real product).
- Added a nearest location function and search location (not fully functional in the prototype!)
- Checked the process for content that supports the user, for example the time required to play dependent on nr of players, who to include in number of guests
- Enabled users to choose to eat before, during or after their activity - I changed this from an uneccesary choice of times to a simple before, between or after option.
- Updated the tabs to a simple underline and bold text as opposed to an old fashioned file tab
- Simplifying the choose a date and time section - removing the date tabs as they were a duplication of the day buttons.
- Simplified the availability from low, medium, high to simply busy or not busy
- Removed the tab functionality when choosing food and drinks as users didn't see the drinks tab, this was created as a page instead.
- Changed the activities to reflect the location chosen making it easier for users to see that an activity wasn't available at that location
Next steps would be to design for tablet and desktop and review whether the following features would also be beneficial.
- Adding packages for the business to up-sell and making it even quicker for users to book
- Adding the ability for a user to swap an activity or check another location's availability should their chosen location not have availability for their chosen activity.
- A Do you need more time? feature would be beneficial for the business
- An AI chat function could save the business time
- There is a need to differentiate between adults and children when booking guests (i.e under/over 18 years)
- The age of the jubilant is required for a reason? If not this could be removed.
What did I learn?
I wish I had used pen and paper to brainstorm ideas initially instead of jumping too quickly into Figma. I also learnt that it would have been better to have worked in low fidelity more- keeping designs simple, testing, iterating then testing again. I was too eager to jump into creating!
I taught myself Figma throughout this project, so at times it was frustrating not having the technical skills to produce what I wanted to. However I have learnt a huge amount - from creating a design system for the project and learning how variables and conditionals work.
What would I do differently next time? I would work and test in low fidelity much more instead of worrying about colours and nuances of UI design too early on.
Thanks for checking out my portfolio!
