.svg)
Trip planning is the primary feature of the Globaleur App. To simplify the process, we used to use one page to operate all functions. However, it turned out that the whole feature was even more complicated. After doing user testing, we realized that users felt so confused about our planning page, and our selling point (recommendation) was not visible to users. The redesign of the planning page is essential to make it easy to use and increase the usage of the recommendations when users browse and organize their trips.
The current planning experience is fragmented and ephemeral, causing users to leave our site entirely after creating a plan.
We decided to redesign the process of planning to organize the planning steps and let users get started easily.
2 designers, 1 product manager, 2 developers, 1 marketing.
UX research, UX design, interactive prototyping, visual design.
After launching the Android mobile app, we tested our product with 10 potential users to gather feedback by tracking their behaviors. We observed that the users felt confused throughout the entire process, as they were unsure about what steps to take next, even though we provided them with instructions. Additionally, users repeatedly clicked the "finish planning" button to bypass the flow after creating a plan.
1. Overwhelming planning page
After we did user testing, we found out 86% of users felt confused about the planning page, indicating that it was too overwhelming to check everything on one page.
We combined all the functions into 1 page (Editing, daily details, map, day tabs, adding new places, etc.), we wanted the users to start planning fast. We thought each function was simple and direct. However, we did not realize how crowded the page was, and how difficult it would be for users, especially those first-time users.
2. interface's intention is not clear
The "Create New" and "Use This Plan" buttons have different meanings, yet they are displayed simultaneously on the plan preview page for various purposes. This creates confusion as they fail to clearly indicate how the features function.
Furthermore, the prominence given to the "Finishing planning" button has led users to repeatedly click it, resulting in the direct completion of the plan.
The primary goal is to allow users to focus on the content itself rather than drawing their attention to the CTA buttons.
3. map Size makes it not useful
Users expected a lot of information from the map. However, the limited space makes the map look too small to display the routes. All content would be pushed down when the map showed. It is a handy function, but the size makes it useless.
.jpg)
The two tenets were the guideline while I was designing the flows.
Discoverability: A.I. Trip Recommendation is one of the most prominent advantages of our platform. Users should be aware of live event offerings, famous POI (point of interest) suggestions, and viewing availability across multiple platforms.
Balance: There must be a balance between giving the user too much and too little information. Too much, we risk overwhelming the user and complicating the process. Too little, we risk confusing them.
According to the problems we figured out from the previous version, we redesigned the planning pages.
1. Separated Planning page
Improving the layout and hierarchy of the planning page by separating it into "Planning Hub" and "Planning Detail" pages.
The clear daily route allows users to easily navigate and understand the presented information.
2. simplified CTA Button
The "Use This Plan" feature is an important recommendation in our app, so we have chosen to retain this prominent CTA button to simplify the user interface and encourage users to utilize this recommendation. However, we have removed the "Create New" button, which is not as crucial in this context. Users can create a new plan by navigating back.
.png)
3. Resize the Finish Button
The original "Finish" button is excessively highlighted at the bottom, leading users to click it directly without hesitation. While it is an important button, it does not need to be overly prominent. As a solution, I have decided to utilize the Android default "Done" button, positioned on the top rightside. This button remains visible to users without causing confusion.
4. Map view
A full-screen map provides travelers with a comprehensive, detailed, and interactive tool for navigation and exploration. It improves their overall travel experience by offering enhanced visibility, easy navigation, detailed information, and more possibilities.
Before
after
The new planning process is simpler and more straightforward. The segmented pages have improved the overall structure, making it more cohesive and purposeful.
We did another user test with our target audiences. The majority of them did not feel confused at all, and they said this planning function is easy to use.
But they still mentioned that the daily plan summary is too general to read. We decided to do more explorations on the planning hub page for the daily plan summary function.
.png)
Here is the information we can use for the hub page:
After presenting my design explorations with other designers and engineers, I found out that big images and icons simplify the information. Visualized brief data is more intuitive and more useful. Generally, the pictured itinerary list became a winning experiment.
I decided to use a foldable design to avoid any visual noise so that users would engage more easily with the daily card. And it also saved more space to display the recommendations. I designed a switch toggle button to expand all the cards while clicking, so a whole trip summary will be shown.
"Planning Hub" and "Planning Detail" are sharing different functions, which make the planning process more organized and the purpose of the page is clearer. A big map page fully demonstrates the advantage of the map. Adequate information not only fills the white space but also improves the engagement with users. It decreases the possibility of misunderstanding and confusing, and the users won't need time to learn while they are planning the trips.
A.I. trip recommendation is one of the most prominent advantages of our platform. Users must be comfortable to access the suggestions from our system. This new design increases the click rate for users to check the recommendations.
Our design redesign has delivered a significant boost to the SUS, increasing it from 47 to an impressive 70. Users have praised the redesign for its improved usability, finding it much easier to navigate and use. The streamlined interface and simplified workflows have created a more intuitive and user-friendly experience, driving overall satisfaction. The redesign's impact on recommendation click rates is evident, with a notable 5% increase. Users are now more engaged and inclined to explore recommended content, leading to improved conversions and overall user engagement.
Utilizing user testing and data analysis: It is an excellent opportunity to gain insights from real users. After we tested our design solutions, user behaviors revealed how users work with our app. It helps to build a better product for the users.
Feedback: I feel more confident to present all possible solutions that I've explored in front of my peers. To reach maximum optimization, I continuously share my work with both designers and non-designers. Good communication is a solid foundation, and their suggestions have optimized the design.