👈🏻 Back to Homepage

🛒 Transforming tiket.com My Order

OVERVIEW

My Order is a place when user can manage their order in tiket.com. Back in 2018, My Order still need a lot of improvement. Help center entry point, payment breakdown, barcode checkin for train is some of the basic feature missing in existing design.

In this project, we focus on completing basic needs for our users in My Order page along with updating the design component to 3.0 version.

ROLE

COMPANY

UX Designer

tiket.com

PERIOD

MISSION

Nov 2018 - Dec 2019

Complete basic feature

Understand the challenge

From the first time I handled this project, I have collaborate with Meidirasari Putri as a UX Researcher and Jessica Yasmin + Samad as a UI Designer.
Dira already research some pain points of our existing My Order design by doing the Usability Test and User Interview. And here is the results:

- A bit hard to manage booking
- Complicated order details
- Different look and feel from each platform
- Overload customer services ticket for refund or reschedule

Besides updating the UI to 3.0 version, the goals of this revamp is to decrease Customer Care ticket by providing reliable help center entry point to accomodate problems on user order.

Explore

In this stage, we have done several activities to discover users’ need and pain points while checkin on their current/past orders. Initially, extensive desk research has been done to understand the user behaviour. We investigated the user journey to map in what stages that My Order is going to be used.

Research Focus

To begin, Dira has set three Research Focuses. Those helped the researcher and designer to narrow down the problem areas to be investigated in a particular project or study. Normally, they are formed by questions and followed by more specific questions. Details are below:

Empathy Map

UX researchers and designers are so familiar with developing empathy map on every project. Undoubtedly, this map help us understand how user would think, feel, say and do about our product. In this case, the map only focuses on My Order. We discuss potential thoughts on every part and complete with user pains and gains.

Define the Problems

I feel confident now that the problems are validated. I also got some feedback from stakeholders and the business team about the existing design.

Pain Point 1: Inconsistent List

- My order has 2 tabs, Active and Past. But the ordering was inconsistent, sometimes booking expired in the Active tab, sometimes in the Past tab.

- Booking expired has 2 type of labels: Red color & Grey color. IDK why it’s different. When I ask to the team, they also don’t know why 🙄

- Wasteful vertical space when user have Roundtrip flight order

Pain Point 2: Unclear Detail Page

- General: There’s no price details of your order

- General: User can’t send their receipt

- General: Hard to find help center

- General: To see e-voucher, user should enter Manage Booking page

- Flight: There’s no flight facilities information

- Flight: For refund, reschedule user should enter Manage Booking page

- Hotel: Lot of misinformation and different from Hotel Product Detail Page

- Train: There’s no barcode — which is weird

Generating Ideas

We initiate some methods to generating ideas for this project. Also we designed spesific workshop framework to generate solutions that would optimise user journeys and information architecture

Photos taken during ideation workshop that I was facilitating. Top: Framing & Generating idea using affinity diagram workshop -- Bottom: Information architecture poster

Designing the Experiments

Generate experiment ideas that focus on user's pain points and company goals into design screens

Due to the company’s confidentiality, the actual object of my work can’t be disclosed and some of the following designs, numbers, text, have been modified, blurred or omitted on purpose.

Experiment 1: General Page

- Separate Active order and Order history into different pages, to make the user more focus on their active orders and avoid confusion.

- Create a quick filter tab based on our vertical product to accommodate our 35% travel agent users who have a minimum of 30 orders a day.

- Revamp card list and architecture information to give users information they need.

- Create backend rules if active order status change into finished or expired then that order will remain for 24 hours before moving into Order History page.

. . .

Experiment 2: Detail Page

- Add payment breakdown, which is important for users and not available in the previous design.

- Simplify order details based on vertical product

- Define architecture information based on the vertical product (Ex: for flight, booking code on the top. For train, the barcode on top and for hotel, we make sure the guest name is above the fold)

- Make the user easy to manage their order. Because in the previous design, manage orders menu appears on a different page

- Directly include help center at the bottom of the page.

Results & Takeaways

6 Months after release, we evaluate both qualitative and quantitative ways. Here are the key takeaways:

Learnings: The quick filter tab does not make sense anymore because:

- As the vertical product continues to increase, this feature is not scalable anymore.

- Most users just have 5 orders in 6 months activities. So the assumption is, users just have 1 order a month

- In the last 6 months, average filter usage is 12125 (32.02%) but only 3902 (6.65%) who continue (see order detail/manage order/do search) after using a filter. So 8223 (25.37%) users who use the quick filter feature is just playing around :(

Success: Here are some success story on my order new design:

- Help center inquiry about my order decrease significantly

- Train success check-in increase, my assumption is because we add the barcode scan to facilitate user when check-in at the train station

- The most participants said the new my order design has clear information than the previous one

- We can facilitate a vertical team if they need something to add on my order because we on my order team has created a request flow process on our internal team

See other selected projects

🌍 Explore the world in just few clicks away with tiket Discover! 🔒

📰 Improving Detik.com Apps news list & details

✨ My Exploration Gallery

👈🏻 or Back to Homepage