Interests
Sometimes, I draw illustrations for fun.
Interests
Sometimes, I draw illustrations for fun.
My Role
Design lead
Interaction designer
Type
Series of
Innovative proposals
Baidu Maps is a popular map service with over 700 million Chinese users. In 2016, given the increasing trend of traveling abroad among Chinese, Baidu Maps started to provide service for users who travel internationally. But the initial Baidu International Map was only about providing available foreign POI data which was bought from some public POI providers. Then UX teams joined the mission and aimed for leveraging the limited data source to provide a better experience for those who go abroad.
I started to be responsible for leading a small design team (3 visual designers and I as an interaction designer) to proactively propose a series of designs on Map service for traveling abroad.
THE CHALLENGE
Leverage limited data for better services
Considering Map is a reflection of the real world, the more intact and accurate the data it provides, the better experience user will have. But at that time, we don't have independent data collection team overseas as we have in China. The map data for abroad were all either bought from third-party companies or from open sources. So from UX perspective, I need to utilize existing data smartly and leverage them for better services.
Within this scope, we also have a specific product objective to achieve which is to increase the number of users both knowing and using Baidu International Maps.
DESIGN PROCESS
Design thinking for product plan
Quantitative survey/Desktop research
As my many other projects, the best way to make a vague project clearly is to understand thoroughly by a few W-question:
Whom am I designing for?
What is their current experience in the product?
Why do they feel that way?
Regarding better understand our target users, I worked with a UXR to do a quantitative survey on Baidu Maps, where users could respond to it from both an activity area and keyword search area. Finally, we got 19247 effective responses by excluding those who didn't travel abroad or who didn't answer questions fully.
Besides it, I also did research online about the market of traveling overseas, to gain knowledge of users' requirements, behaviors, and related products. After all these steps, we got a better idea of the story of those travel overseas.
Young adults with stable income have limited experience traveling to Asia mostly (in 2016)
.png)
Gender Men 78%, Women 22%
Age 20-39 years old 68%
Occupation Employees 66%, students 3.7%
Experience 2.3 times/year, 71% independent travel
Hot destination Thailand/Korea/Hongkong/Macau/Taiwan
Future destination Japan/Europe/Thailand
Most users plan on where to go for eating/shopping/sightseeing before traveling but still want to explore when traveling
• Travel/Attraction info
• Exchange currency
• Weather
• Food nearby
• Shopping mall nearby
• Public transportation info
• Trip plans
Now I already knew whom we need to provide service to and what their habits look like. However, considering traveling is a long-time activity, I believe that we are not able to satisfy users along the way of the entire traveling with our realistic resources. So after a comprehensive analysis, I decided to narrow the scope to design for those users who want to find a needed place quickly in traveling.
Help users decide where to go in traveling quickly and efficiently
In order to solve this specific problem, I need to understand deeply of their actual scenario. One good thing is that I am also one of the target users, so it's not hard to act them in my mind and get an understanding of them. Plus, based on the valuable information on what info users care about from quantitative research, my conclusion of how to design it was:
1. Break down concrete scenarios when users may open Maps to pick places.
2. Break down what info may affect their decisions on which place to go and surface it in different hierarchies.
3. Bring more valuable suggestion instead of only letting them compare among a large amount of data to decide
4. Design for real data, starting from popular cities.
drafts/wireframes/prototypes
DESIGNS
Travel Map/My Journey/Explore Nearby/Base Map
Travel Map (top POI data from OTA company)
1. Pop-up bubble for highlighting the entrance
When users opened maps in Tokyo, they can see a popup to lead them into the travel map with selected high-quality POIs, where displayed top100 popular POIs/attractions/Michelin star restaurants/shopping malls and many other useful categories of POIs.
2. Cover page for highlights and vibe
Before entering the travel map, they'll see a transitional cover page showing the border, Top POIs, brief introduction of the city, which aims for giving first-time users an impression of what this map will provide.
3. Display different info in base map/icon and card
The POI info in this map is already cleaned up and mainly from OTA company, highly related to traveling scenarios. I surfaced bilingual names/categories and review stars in the base map level, while open close time/distance in card level, but one-sentence introduction in a popup shows up when the POI has it.
Explore Nearby
1. Quick entry point for exploring nearby from where am I now
Based on the research conclusion, when users traveling abroad open map, it's very likely that they want to explored nearby. So I designed another quick entry for it, which shows how many popular POIs around you and lead you to the result directly.
2. Combine overlapped POI icons to show the density
For the standard scale, POIs are likely to overlap with each other, which is hard to touch or needs more zoom interactions. I refined it by making the strategy to combine overlapped POIs to display the number of overlapping. In this way, users can get a sense of the POI density by switching the map to a proper scale and avoid the bad looking of overlapped POIs.
3. Card view and list view support both consuming POI details and comparing POIs
Considering when exploring nearby, users might want to pick one or a few places to go very likely. So they may want to not only see the places information to make decisions but also compare some key factors to make decisions. That's why I designed two types of views here.
My Journey
1. Journey: connect POIs to make "lines" valuable for day
I thought travel is made up with going different places in a period of time. So besides POIs, another useful dimension of helping users is to provide connected POIs as journey. And provide them the ability to make their own journey to help plan how to visit more than one place in either short time or long time.
2. Map view with floating journey cards
The map view is 1to1 mapped to the draggable card, in this way users may get both information and other travel info. Another point is floating cards can be swiped left and right to help users easily compare different options.
3. Lightweight interaction of adding/removing POIs on Map view
Users are able to add or remove POIs to adjust the journey quickly either on Map or card.
4. Suggested journey as templates
By leveraging the OTA data, I designed a 3 – 5 typical one-day journey for users as a template for them to rebuild their own preferred ones.
OUTCOME REVIEW
Increased tap-to-open rate
For the product and design team, we kept tracking the performance of our new design. For example, users' total tap-to-open-travel-map rate increased 200%+ after delivered the proposed version compared to previous version during similar public holiday time.
While for explore nearby, the interaction design pattern were reused by domestic travel team because the good performance it got after launched in overseas countries. And our product team and I received an innovative product award in Map group because of the design.
TAKEAWAYS
Scenario and data is the key
1. Rather than Input Method, I need to analyze more on traveling scenarios, think of each details of how little-experienced young adult expect in their trip overseas
2. Map is actually about surfacing different Geo-related data to reflect the real world. So it is quite important to clearly understand what data we have and design under data constraints at some time. Imagine the future but design for real is a big takeaway from doing map design.