Mobile booking redesign & optimisation

Led the redesign of Bookatable’s mobile app, increasing booking conversion from 13.69% to 18.60% on iOS and 4.25% to 12.83% on Android.

Context

When I joined Bookatable, the native apps were being relaunched. Conversion rates had been gradually declining, and the experience felt inconsistent across iOS and Android. 

There was no shared design system, limited behavioural tracking, and key booking journeys were difficult to use. 

I was responsible for leading the redesign of the apps end-to-end, improving the foundations and focusing on the parts of the product that directly impacted bookings.

Improving the map experience

Research showed that around 30% of users prioritised location when choosing a restaurant. Despite this, the existing map view was cluttered and difficult to scan. 

Too many cards were visible at once, pricing was unclear, and booking actions weren’t obvious. As a result, conversion from the map view was low.

Research & exploration

I started by reviewing competitor map experiences to understand common patterns and expectations. I then ran qualitative interviews to learn how users decided between restaurants and what information mattered most to them.

Using these insights, I sketched and wireframed simplified layouts focused on reducing cognitive load. The designs went through multiple rounds of usability testing and iteration before launch.

What we learned through testing

Testing revealed that:

Numbered and coloured pins created confusion
Some icon metaphors were not clearly understood
Horizontal carousels and expanding cards were difficult to interpret
Too many visible options increased cognitive overload

These findings helped shape a simpler and more focused solution.

Impact

The redesign turned the map into a stronger and clearer booking path.

4.86%

Map view conversions
(vs. 2.18% prior to redesign)

Users who viewed the map were 55% more likely to make a booking, and 4% of bookings were completed directly through the new map timeslots.

Improving booking clarity

During testing, we observed hesitation around selecting time slots.  Users didn’t always realise that tapping a time confirmed their booking. The interaction relied on implied behaviour rather than clear instruction.

I introduced a simple line of instructional copy, “Select a time to book”, above the time slots and ran an A/B test.

The A/B test resulted in an 8.4% increase in booking conversion and an 8.7% increase in interaction rate.

Connecting web and app bookings

At the time, neither the website nor the mobile app required users to create an account.
As a result, bookings were not connected across platforms. A reservation made on the web could not be viewed in the mobile app. Building a full account system would have required significant investment, so I explored a simpler solution. 

Instead of introducing accounts, I designed a feature that allowed users to enter their booking reference and retrieve their reservation within the app.
 
This provided access to booking details without requiring a full authentication system.

13% of users on the bookings screen used the feature, providing a lightweight bridge between web and app.

Redesigning core experiences

The app had evolved without a clear style guide or shared component library. Patterns varied across screens, and visual decisions were inconsistent.

I created a structured design system to standardise typography, colour, spacing, and reusable UI components.

Using atomic design principles, I defined components from basic elements through to reusable patterns, making the product easier to scale and maintain.

Adding delight through illustration

I worked with custom illustrations to introduce personality into empty states and onboarding moments. 

The goal wasn’t decoration, it was to soften functional moments and make the product feel more considered.

Overall impact

Across the redesign and optimisation work, booking performance improved across both platforms.