A fresh take on the account page

How I help tiket.com to enhance its most personal space to be even more personal for the users
Role
Product Designer
Team
UX Researcher, UX Writer, Illustrator
Platform
iOS, Android, mWeb
Timeline
May - July 2021
Starting Point
tiket.com is an Online Travel Agent from Indonesia. It is the go-to online market place for product and services that covers flight, hotel, car rental, event and attractions, train, and airport transfer bookings.

Currently we already have an account page where the user can manage all their personal data there. When talking about account page of an OTA, what pops first on your mind? Profile? Settings? Help Center? Passenger’s Data? That’s all correct! But..
The Problems
From the research, we have found a number of user pain points which we have categorized into 2 problem categories, those are Navigation and Feature problem.
1. We do have a bunch of features. Yet, we’re presenting them without context.
So we have 3 navigation problems:
  • Lack of proximity between similar functions.
  • Lack of contrast for highlighted features.
  • Lack of personalization, too many generic sections.
2. Many users still have problems related to features in the account menu.
  • From the CS cases, most users find it difficult to change email and mobile numbers. But now technically we can't allow users to change their email, and for mobile number now technically user can only change theirs by contacting CS. But, many users didn’t know that they have to go to CS to change their number.
  • Some users also find it difficult to access their profile and traveller data.
  • Users are confused about how to save their cards so they can pay easily.
The Opportunity
Besides that, there are several concerns that are felt by users, but they are confused about how to convey and resolve their concerns related to their account.
1. Security Optimization
From the user interview, we found that users are very concerned with the threat of data breaches in applications. Account menu can actually be a place to make users feel safe. Unfortunately, majority of users have not utilized our existing security features.
Highlights from the data:
  • 95% of users who logged in in the last 6 months have not activated the trusted device feature or PIN at all.
  • 18% in the same population, still haven't verified either their cellphone number or their email at all.
2. Increase Esteem
There is one more thing that motivates users to go into their account, is to check on their achievement. Achievements can be the investment value for user to return to using tiket.com.
Design Opportunities
From the research and data collection carried out, we identify opportunities that can be done in our design using the HMW framework:
How Might We
  • Use clear and understandable naming for features?
  • Make the navigation clearer?
  • Make it more personalized, welcoming, and rewarding for users?
  • Make user feel more secure?
Solution
After a bunch of explorations and iterations, finally we came up with this design proposal.
1. Visually made fresher and more personal.
We want to make user to feel welcome and cheerful when opening this page.
2. The account page and the data will appear different for each user, so it feels more personalized.
In the account menu 4.0 design, it uses a more vibrant color combination than the previous account menu. Based on the UT, this makes the user's first impression more cheerful and warm, making the 4.0 account menu display more attractive than the previous version.
3. Clearer grouping and proximity between functions, and easier trip planning for users.
  • We group similar features and made it closer to each other. Users can now navigate the account menu easier because features rename and group restructures.

Based on UT, users can now navigate the account menu easier because features rename and group restructures.

  • We show their money balance directly so user can very easily find out the balance of the paylater or e-wallet, this can make it easier for them to do budgeting during the trip planning phase.

    According to UT, this is very helpful and user like it.

"...bisa tau di awal saldonya berapa. Jadinya aku gampang untuk budgetingnya, sama kalo harus top up OVO, butuh top up berapa tanpa harus buka app OVOnya." - Andika

(translated) "...can know balance directly. So, it's easy for me to budget, the same if I have to top up OVO (e-wallet), how much do I need to top up without to open the OVO app." - Andika

"...kaya kartu debit dan kredit udah langsung kelihatan gitu. Terus tampilannya lebih colorful, lebih suka gara-gara ada ijo-ijonya ini (header)..." - Sonia

(translated) "...I can see the debit and credit cards directly, The appearance also more colorful, I like it more because of the green thingy (header)..." - Sonia

4. One tap feature for user to know about their account security and how to increase it.
5. Now users can safely save their cards for future payment.
6. Giving entry point for users who want to change their mobile number
7. User can personalize their header image according to their preference.
and...
8. Some other screens
1. Smartprofile redesigned so it become easier for user to understand the features.
2. Now user can see their vaccination status in their profile.

142,809x used by users in 2 weeks after release.

3. We give security checkup banner for user to know their account security.
4. Settings page made cleaner and more organized, made easier for user to find what they’re looking for.
5. The security check-up section can help users become more aware of their account's security
My Learnings
  • This project took quite a long time from start to finish, because it was put on hold due to a change in priorities. The previous PM that handled this project also came out and was replaced with a new one, so it had to be adjusted again.
  • I learned that documentation is very important when a project is on hold like this. This makes it easier for me to recall what I've done before.
  • There are also many changes in requirements during the process, so some of the designs that I have made are not used. But that's okay, it looks like it can be used in the next phase. Maybe I should communicate more intensely with the PM so that I can participate in the process of determining the new requirements.
  • Because on the account page there is a payment menu, so I also have to communicate with the payment team about the design proposal I made. With early communication, it will be easier behind because all stakeholders have agreed.
The project is currently under gradual development and will likely be available on the tiket.com app in the next few months. I will provide an update on the results later here.
Thank you for reading up to this point! 🙌
Next Project
How tiket.com make users feel exclusive, appreciated, and prioritised.