BookingPay

BookingPay is a new travel payment product created around consumer & merchant payments pain points. I was an integral part of creating our MVP from scratch, together with my team and the merchant team. We worked together as one unit to completely push the limits and rethink our payment experience.

Booking.com, 2019

UX Design, Workshop facilitation, Research, User testing, Interaction design, Illustration, Design mentorship
Pro tip! Quick jump to the stages in the project:

Research

Me and my team consolidated payments research to help us focus on relevant pain points & opportunities. I gathered competitive research in the form of a feature matrix and deep dives into the UX of leading payment apps.

Research

Product vision

We took our research and created a list of all the features we would like our product to have. I suggested we leverage the power of storyboards to help us focus our product vision. That helped us build our most essential features around our consumers daily pain points, and find where we could have most impact.

I led a team workshop where we created ‘Alice’ who brought our product to life. Read about the whole process on Medium.

final_storyboard

MVP Workshop

After developing a clear vision around how we are solving consumer & merchant pain points with all our features, it was time to decide what features would make up our MVP.

I planned and co-facilitated a 3 day design sprint to kick start this process. This helped us focus on the key moment of our journey, the ‘stay’, where the payment usually happens. Here we created a flow with 2 possible payment solutions, a ‘payment request’ and a ‘QR payment’, which became our focus.

Workshop-5-100
Workshop-6-100
Workshop-01
Workshop-02
Workshop-03

UX

Now came the time to design our specific flows and screens. I started with the app, as our focus was during the ‘stay’ at an accomodation, where the app is a major touchpoint. I continued to design everything on web to create a unified experience.

Here I went through several iterations while gathering feedback and user insights to inform the final design.

 


Design-changes

User testing

Being an MVP, user testing was extremely important. I was deeply involved in every research session, while leading most and collaborating with researchers. We had rounds of moderated research, unmoderated research, street testing and surveys to inform our flows and UX decisions.

BookingPay-testing-3-2
BookingPay-testing-01
BookingPay-testing-02

Designs

The final designs of the MVP included a full featured payments product, which allowed you to make a QR payment to a merchant, receive a payment request, manage your payment methods and track all your account activity.

I worked closely with the merchant team to make sure our entire product is seamless, while also mentoring the designer in that team.

Creating a seamless payment experience

This work was not only visual, it meant creating the best error handling together with BE, while properly informing our consumers and merchants along the way.

BookingPay-error-flow

Outcome

We successfully launched our fully fledged MVP for both consumers & merchants, making sure we had tested the most important features. This project helped provide many learnings to benefit future payments projects in the company.

Rewards & Wallet

This is a project I initiated to merge the existing ‘rewards’ and ‘wallet’ pages as a strategic step of bringing rewards closer to the user wallet and enabling the flywheel of ‘earn and burn’. This was also very beneficial for user understanding & experience.

Booking.com, 2019

UX Design, Strategic thinking, Workshop facilitation, Research, User testing, Interaction design, Illustration
Pro tip! Quick jump to the stages in the project:

Research

This project started with competitor research that I conducted into reward programs and wallets, with direct and indirect competitors. This helped us understand what approach we should take. Moreover, I looked at jobs to be done on each page from our users' perspective, making sure we address them all.

Rewards-Wallet-research

Collaboration

Throughout this project I coordinated meetings and design reviews with relevant stakeholders to capture feedback and fill in all the gaps. This helped with alignment and pushed the project further.

Rewards-Wallet-collaboration1-2
Rewards-Wallet-collaboration2

UX & user testing

As it would be difficult to test this big change in an A/B experiment, I conducted user research in order to validate and challenge my designs. I ran a usertesting.com unmoderated research on the entire new flow and a UserZoom click test in order to get more ‘quantitative’ research and compare the current pages to the new ‘merged pages’ design.

UX-testing-1
UX-testing-2
UX-testing-3

Designs

After getting stakeholder and user feedback, I made further iterations and prepared the final design on all platforms, while keeping maximum consistency.

Desktop-in-browser
Desktop web
Mdot-in-browser
Mobile web
iOS-in-phone
Apps

Rewards flow

The user journey would begin on the rewards page where a user could learn how to earn new rewards, track them and eventually how to spend his credits. Here it’s possible to track all the rewards and get extra info about each status. Once a user has credit, he would also see action buttons helping him spend his credit.

Rewards-flow-01
Rewards-flow-02
Rewards-flow-03

Wallet flow

Once a user earns credit, it goes to his user wallet. There he could have ‘travel’ credit or ‘cash’ credit. He would have action buttons to help him spend his credits or cash out ‘cash’ credits. Here a user could track all his wallet transactions, including refunds etc.

Wallet-flow-01
Wallet-flow-02

Outcome

Merging these pages into one was an initial strategic step in enabling the ‘earn and burn’ flywheel. This acted as an enabler, making it easier to add new types of rewards and new functionalities to the area.