Improving Conversion Rate & Reducing Development Time by Redesigning Things To-Do
Users can purchase activity products, such as attractions, events, playgrounds, and many more through tiket.com's Things To-Do. However, the page’s design had become outdated and hadn't been refreshed for a long time. Our task was to completely redesign the entire To-Do flow, including implementing responsive layouts to support our developers' migration to React so that we could reduce the development time required, thus increasing efficiency.
We also address several existing user experience problems. It was a major overhaul, revitalizing the outdated visual of the page and giving it a fresh new look by incorporating our new design system.
Company
tiket.com
Role
Designer
Timeline
2022 - 2023
Platform
Responsive
End-to-End Flow
Our streamlined end-to-end flow, four pages from discovery to purchase. Previously, there was five pages, the Price Tier Page before the booking form, which users are required to configure their order details before booking. However, from our user research it was identified that this page felt redundant. Thus, we simplified the page and moved it into the product detail page, enhancing efficiency and enabling quicker purchases. Let’s deep dive to each of the page below.
Landing Page
This is the first step of the discovery process, where users find inspiration for their vacation activities through our personalized recommendations.
To keep inspiring users of their discovery, we provide personalized dynamic product recommendations based on user’s search behavior. Knowing the fact that users are are primarily driven by cheap prices and discounts we also shows available promos and campaign that are on-going to help motivate users to purchase.
Search Result Page
Accessed through entry points such as searching keywords, viewing all recommendations, or selecting from the quick menu from the landing page is the search result page containing broader list of search results enabling users to explore and discover products tailored to their preferences and needs.
Product Detail Page
After selecting a product, users will land to this page, enabling them to learn more about the product and it's unique offered packages.
In the package section, users can explore and compare package benefits to find the best fit. Once they've decided which package to purchase, they can simply select and configure their order using our simplified Order Details pop-up, which was previously the standalone price tier page.
For the desktop version, instead of showing a pop up, we utilized the real estate and implemented the expand collapse approach. So user remains in the product detail page during their package selection.
Booking Form
After user completes in configuring their order details, they proceed to the Booking Form which is the last page before payment. Users can review their selected order, filling up required personal info for purchase and choose to opt-in insurance benefits for protections.
Post-Launch
This project spanned nearly a year until from design till launch. We did multiple A/B testing to validate and to improve our redesigned solutions, and till this day, we keep doing experimentations to keep improving. While the redesign journey had it's challenges, the end result, a refreshed Things-To-Do page made it all worthwhile.
Here are all the design team that worked on the project:
Design Lead: Adit Septian
Product Designers: Jason Fonseca, Jessica Yasmine, Irfan Zidny, Alvin Liauw
UX Writers: Ayu Lestari
UX Researchers: Satia Putra & Nuriyah Amalia
3D Illustrators: Pui Enawati