Improving the UX of Klaud9’s
online booking platform




CATEGORIES

UX Design
UI Design

CLIENT: KLAUD9

Working with a client as part of General Assembly’s final project (three weeks)

MY ROLE

User Research, Usability Testing, Project Management

TEAM 

A team of three with Jolyn Lim and
Olivia Zhou

DELIVERABLES

Website (Desktop & Mobile)
Research Plan, CJM, User Personas, Userflow and Usability Report

TOOLS

Figma & Adobe Illustrator 






PROJECT BRIEF

To increase conversion rate of direct booking for prepaid photoshoot packages from the Klaud9 website




OUR ITERATIVE DESIGN PROCESS







UNDERSTANDING KLAUD9





WHAT IS KLAUD9?

An online marketplace that uses AI technology to match companies with photographers worldwide to provide quick, affordable and high-quality photoshoots.

UNIQUE SELLING PROPOSITION:

1—Quick

Get a photographer within 24 hours; Fast turnaround time for photoshoots.

2—Affordable

Over 60% savings with attractive prepaid & custom packages; All media buyout with worldwide perpetual copyrights.








PROEJCT SCOPE

To look into Klaud9’s booking platform for prepaid packages







HOW DOES PREPAID PHOTOSHOOT PACKAGES WORK?






GENERAL PROBLEM

LOW DIRECT CONVERSION FROM KLAUD9’S WEBSITE


Prospects are not going through with booking a prepaid photoshoot via the website and would instead first get in touch with a personnel via the live chatbot or email.

It is important for us to understand the existing issues with the booking process to find out why users prefer to go through other channels to book prepaid packages.





GOAL

To increase conversion on website for prepaid photoshoot packages by analysing and improving on the current key pages and prepaid booking process.







USER INTERVIEW



USER INTERVIEW

We did user interview on 5 prospective clients (creatives and non-creatives): Creative Director, Entrepreneur, Marketing Manager, Digital Designer and Art Director.

OBJECTIVE

To better understand user motivations and key considerations throughout a typical process of organising a professional photoshoot.




KEY INSIGHTS

PRE-BOOKING CONSIDERATIONS

Price – Users are budget-conscious
Portfolio — Photographer’s style must fit brand image
Reliability – Trust and able to connect well

OTHER FACTORS

Users value inputs from photographers regarding photoshoot locations and art direction








USABILITY TESTING #1



USABILITY TESTING ON EXISTING WEBSITE

We did usability testing with five users (same users as user interview) to fully understand what the issues user face when booking a prepaid package.

OBJECTIVE

To understand the challenges and pain-points users face when trying to book a prepaid photoshoot package on the current Klaud9 website.

SCOPE OF TESTING

Prepaid photoshoot booking process




HOMEPAGE

We asked users to look at the homepage and see if they understand what Klaud9 does and offers.

KEY INSIGHTS

Clarity of services: Most users did not clearly understand what Klaud9 does and offers.

“How it works”: Users find that the gif is not helpful and that the steps are not comprehensive

Photographers’ information: Users expect to see photographers’ portfolio/reviews first





BOOKING PROCESS:
6 PAGES

We asked users to go through the entire booking process, consisting of 6 pages worth of fill-in-forms.

KEY INSIGHTS

Although users managed to complete the task successfully but they were frustrated and confused throughout the long booking process and many wanted to give up mid-way.

SUS SCORE: 38.5

NONE OF THE USERS WERE CONFIDENT TO GO AHEAD WITH BOOKING/PAYMENT









USER PERSONA & CUSTOMER JOURNEY MAP





“I want to keep things
low-cost and fuss-free”


Julian, Entrepreneur, 35
The No Frills Entrepreneur

Frustrations: Confused about booking (unsure if he gets to choose a photographer and liaise with them directly) and as a non-creative, he doesn’t understand some of the terms. 






“I want to keep things
low-cost and fuss-free”


Amanda, Art Director, 29
The Careful Perfectionist

Frustrations: Does not see any information about the photographers at all, and the lack of such information doesn’t give her confidence to go ahead with the booking.






THE CHALLENGE & SOLUTION GOALS



CHALLENGE 1

Users need to be better informed about the prepaid booking process to know what they can expect before making a decision.

SOLUTION GOAL 1

To let users have a clearer understanding of what Klaud9 offers, and how it works.



CHALLENGE 2

Users need a straightforward and clearer booking process so that they would be able to complete the process successfully by themselves.

SOLUTION GOAL 2

To streamline the booking process and make it more user-friendly.





PROPOSED USER FLOW






STREAMLINING THE USER FLOW AND CONDENSING THE PAGES

There were multiple fill-in forms to be and edit buttons linked to different pages in the existing user flow (booking), which is extremely confusing and dreadful for users.

We made the process a lot more straightforward and hassle-free for our proposed user flow by streamling the process – condensing five pages into three pages.

EXISTING USER FLOW (BOOKING)




PROPOSED USER FLOW (BOOKING)







EXISTING USER FLOW





PROPOSED USER FLOW







HI-FI PROTOTYPE V1



DESIGN ITERATIONS

We made tweaks to the content, structure and design to the existing website to help users have a clearer understanding of what Klaud9 is and what it offers.

Here are five main changes:


We added photographer’s profile to the landing page for crediblity.


We moved custom brief option beside prepaid packages option so users can associate and access both options under ‘Book a photoshoot’ easily, and know there are two separate options to choose from.

We reorganised the layout of different prepaid photoshoot packages to show clearer comparison, and to display the custom package option distinctly.



BEFORE


AFTER



HOW IT WORKS

The ‘how it works’ gif in the existing website is too distracting and quick for users to follow through, hence we changed it to a simple infographic with clear instructions. We also added an additional step (most users pointed out that there was a gap between the existing steps).




BREADCRUMBS

We added breadcrumbs at the top of all three booking pages to let users know exactly where they are in the booking process and what to expect next.






WIREFRAMES 


HI-FI PROTOTYPE









USABILITY TESTING #2




USABILITY TESTING ON PROTOTYPE V1

We did usability testing with 5 other prospective clients (creatives and non-creatives): Content Creator, Project Manager, Social Media Manager, Entrepreneur and Marketing Manager.

OBJECTIVE

To assess the proposed redesign on the clarity of processes and the new prepaid booking userflow.

SCOPE OF TESTING

Prepaid photoshoot booking process

KEY INSIGHTS

Users were satisfied with the simplified booking flow but they were still rather unsure about the value that they can get and were skeptical about photographers’ credibility.

SUS SCORE: 79.5

(A great improvement from the first UT on the existing website with SUS score of 38)

NET PROMOTER SCORE: +40







HI-FI PROTOTYPE V2 (AFTER DESIGN ITERATION)









PROTOTYPE









OTHER CONSIDERATIONS 

Apart from improving Klaud9’s website and prepaid booking process, we also looked into other considerations, such as recommending a business model that will better align business and user goals.

We also did desktop and user research to propose new features for the website, such as integrated messaging platform on the website and offering complementary services as a package.





FINAL PRESENTATION






PRESENTING TO KLAUD9

At the end of the three week stint, we presented our ideas to the Klaud9 core team – Raj, Isabel and Edu in person and via skype call.


FEEDBACK

Feedback was positive and Klaud9 was satisfied with our work and what we’ve proposed! ︎



THE LAST HURRAH:
HAPPY TEAM WITH SATISFIED CLIENT

(L to R: Me, Olivia, Raj from Klaud9 and Jolyn)


Mark