Redesigning Lucky Bowl's Birthday Booking Process
Project overview
I came across Lucky Bowl's website when booking a party for my daughter. I wanted to check when and what time we could book and had to re-enter information time and time again just to get to that stage! I also called when I was unsure about the final number of guests and I didn’t discover the birthday invitation until it was too late! So I saw an opportunity to redesign their birthday booking process for use in my portfolio.
My Role
I've completed this project on my own in my free time, learning Figma along the way, I'm look forward to collaborating on the next one!
Research
User testing to evaluate the birthday booking process
I didn't have any quantitative data on LuckyBowl so I reviewed competitor sites, including Bowlero, Roxy and Rush. This provided ideas and inspiration and a user model for what features users might expect to find, and where, within the booking process.
I tested the existing site to try and understand users' needs. I tested predominately with people who were parents, asking them to imagine they needed to book a birthday party for their child who is celebrating together with a friend.
The following insights were revealed:
- Users wanted to know the price - either per person, per package or see it update when customising a birthday
- Users liked the idea of being able to check availability
- 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 nr of guests, their chosen activity, nr of series or any times chosen without losing their order
Miro was used to visually summarise the results from testing the existing site and it became clear that users expect to;
- See prices quickly
- Check availability quickly
- Easily edit any of their choices
- Book online easily without the need to call
The below images show parts of the existing booking process where a user is asked for unnecessary information at the beginning of the booking process, cannot see availability and the edit buttons that cause a user to lose information they've entered.
Ideating
Brainstorming
Using insights from the user testing together with inspiration from the competitor review I began brainstorming how a new design might enable users to:
Ideating
Creating and testing low fidelity wireframes
I created basic wireframes using Figma to visualise and test the flow of the booking process. To enable users to check availability quickly I changed the flow so that they select the minimum number of choices required to be able to show them availability, so, location, the type of event, the activity and number of series, and the number of guests. They can then choose a date and see available times over three days. 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 should they wish to change the date. So the choose a date tab was moved to the second page together with the 3-day overview.
Additional changes included:
- Adding in extras such as additional activities
- Tagging activities and extras with “popular”
- A clear all function to reset number of guests
- Went away from the continue button not being “enabled” so that users could click on the continue button, but would be informed of lacking information
- Updated the steppers to be clickable and take a user to that stage
Ideating
Solution
The final solution solved the problem of users not being able to view availability, through the use of tabs to show a day on each side of a selected date. Additionally users can go back and edit their choices without losing information.
- A tab solution enabled users to easily see and edit their choices as they proceed
- A stepper was added to show users where they were in the process
- Any information not required to check availability was moved to after this stage
- Price per person was added so that users could see the price when entering number of guests
- A bottom draw was also accessible for users as they went along
- A carousel was added to the homepage to market activities, food and drinks available
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, selected food, drink or activity, hadn’t completed a field, was going to delete their order etc.
- Added a nearest location function and search location
- 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
- Adding packages for the business to up-sell and making it even quicker for users to book
- Evaluate whether a page per activity is required for informatioanl and SEO purposes or whether one page could work
- Adding a Do you need more time? feature
- Reviewing whether a chat function would be worthwhile
- Upon a location not having a time-slot available - add the ability for a user to swap activity or check another location
- Check if there is a need to seperate adults and children when booking guests (i.e under/over 18 yrs)
- Help in context - incorprate FAQs into context, so birthday-related onto the Birthday page, payment enquiries to the payment stage etc.
- Is the age of the jubilant required for a reason? If not this could be removed
- Automate the time to play dependent on nr of guests chosen
What did I learn?
I wish I had used pen and paper to brainstorm ideas initially and iterate and test more at an earlier stage. 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 and now feel confident using Figma.
Thanks for checking out my portfolio!
