Chinese consumers are immersed in a unique ecosystem of apps and HMI (Human-Machine Interface) systems. This shapes their perspectives and usage habits.

In this article series, we will take a deep dive into various popular Chinese apps and HMIs, such as Gaode Map, Baidu Map, and modern car HMI systems. We will analyze these systems from UI and UX perspectives, while also providing cultural background and insights.

Search Field (2 / 2)

In the previous articles, we analyzed the landing page in general, its features, the tab bar, and the search field (Part 1).

In this article, we continue with the search field.

Searching: Step 2 - Entering the First Letter or Chinese Characters 

In analyzing the search field, a key focus is understanding how the system reacts when users input the first letter or Chinese characters.

From prior research, we know that Chinese systems generally excel in pinyin auto-completion compared to foreign systems, offering highly accurate results.

Typing in English is straightforward—users select individual letters directly on the keyboard.

Typing in Chinese involves multiple steps: 

1. Activating the extra Input Method Editor (IME), either installed by the user or provided by the system.
2. Using letters to input pinyin (the phonetic spelling of Chinese characters).
3. Selecting the correct character from a list of suggestions.
4. Scrolling through pages if the desired character isn’t displayed on the first page. (Moreover, users may sometimes be uncertain about which character is the correct one.) 

In Chinese systems/apps, users often rely on IME, completing text within the IME instead of in the app.

Check this video to have an overview of the steps.

Insights from Spiegel Institut:

• Voice input has become the preferred method for many users. Most apps now support voice input (e.g., in WeChat, users can speak, and the voice is automatically converted into text and sent).
• Research indicates that Chinese automotive systems have a 90% recognition rate for voice assistants.
• On mobile phones, users can type quickly using both hands. However, in cars, typing on an upright display, similar to a vertical iPad, is inconvenient as drivers must type with hands suspended in the air. This makes voice input a more practical choice for drivers.

Many users bypass manual input altogether. For instance, in apps like Dianping (similar to Yelp), they often click on a restaurant or directly open a location link shared via WeChat, which redirects them to the navigation app automatically.

Given the dominance of voice input, we will skip analyzing system responses to typing the first letter or Chinese characters in this article.

Searching: Step 3 - When the address is fully entered but the user hasn't pressed "Enter"

P05-01 When the address is fully entered but the user hasn't pressed "Enter"

Content and Features: 

All three apps provide text-based result lists:

• Google displays only the location.
• Gaode and Baidu include additional details beyond just the location, such as specific entrances (e.g., West Gate), whether the entrance is pedestrian-only, or whether it offers parking and the current parking availability.

In China, buildings often cover large areas and typically have entrances at different cardinal points (East, West, South, North).  For large venues like hospitals and shopping malls, these entrances can be quite far apart—sometimes separated by several traffic lights, leading to congestion. Choosing the correct entrance in advance is critical.

While Gaode and Baidu do not display distances, Google includes the distance to each location.

• On the one hand, this can be helpful for distinguishing between places with similar names (e.g., residential areas).
• On the other hand, many users rely on navigation apps to view arrival times, driving durations, and traffic conditions to decide when to depart. For such users, the distance alone is less meaningful.

Design:

In Gaode and Baidu, search keywords that match exactly are highlighted in blue (accent color), allowing users to quickly identify what they are looking for. Other results are visually separated. (P05-02)

In contrast, Google lacks highlighting and instead shows a variety of related suggestions, such as nearby coffee shops or locations in other cities.

P05-02 Gaode and Baidu use an accent color for better reading

Searching: Step 4 - After the "Enter" is pressed

P05-03 the result page

All three apps follow a layout of a map at the top and information at the bottom.

Each app uses large-sized images to showcase destinations, aligning with a current trend in app design.

Design:

• Google presents a cleaner interface by displaying less content overall and ensuring a stronger visual connection between elements, making the page appear more organized at first glance.
• Gaode and Baidu, on the other hand, have a more cluttered layout due to multiple content blocks.
  • Gaode shows two and a half images of equal size.
  • Baidu displays four images of varying sizes. Combined with differently sized icons on the page, this creates a slightly chaotic visual effect.

Content and Features:

• Gaode provides direct buttons to entrances at different gates, indicating whether they are pedestrian-only or offer parking access.
• Baidu, in contrast, focuses more on recommendations, showcasing attractions inside the location and user reviews.

Conclusion

• From a design perspective, Google comes out on top. It displays fewer elements, and most of the elements on a single page are of similar size, giving the interface a cleaner and more organized appearance.
• However, in terms of displaying search results, Gaode and Baidu gain extra points for highlighting the entered destination in the results list, making it easier for users to locate their desired location quickly.
• From a functionality standpoint, Gaode and Baidu offer greater convenience, such as additional POIs and the option for users to select specific gates (e.g., north, south, east, or west).
• Back to the search bar itself on the landing page: we can see that voice input is emerging as the trend for future navigation. With fewer users likely to interact with the search bar in the coming years, we bid it a warm adiós!

Spiegel Institut offers full package services for HMI and operation system development as well as usability tests for all industries. Feel free to contact us for cooperation:  info@spiegel-institut.de

Author: Yue Liu, Spiegel Institut Mannheim