State Street:
Web App in Chinese Version
Discover design issues and ideas suitbale for Chinese users
A research project I conducted for the State Street web app to discover ideas for Chinese users who use the asset servicing platform
There are people at State Street who work in places where they use Chinese, such as Hong Kong, Mainland China, and Singapore. We aim to develop a Chinese version of the Alpha Portal, tailored to Chinese speakers, utilizing the Chinese language and design trends prevalent in Asia.
My Role
Researcher
Target Users
State Street's clients (ex: Portfolio Managers)
Year
May - June 2023
-
Define what a “Chinese Version” means
-
Define the design trend in China
-
Identify the value of the Alpha Portal Chinese version
-
Identify the problems we have while translating English into Chinese
Goal: Define the Chinese Version
What it mean to design a Chinese version for the platform, State Street Alpha?
01. Translate English to Chinese
02. Design with a design trend that is more suitable for Chinese speakers
01. Translate English to Chinese
From my research and observation, PingFang SC is a font that "writes" Chinese correctly compared to other fonts. Here is an example of how Chinese characters look different on different fonts.
Chinese characters are different from English. Chinese character looks like images. We cannot use a very small font size because it will be difficult to read the words. From my research, it is suggested never to use a font size smaller than 12pt.
02. Usability and Design Trends in China
A. China’s websites and apps are more feature-rich and information-dense
B. New Chinese websites are improving to become more modernized and aligned with Western design trends: "Less is more"
A1. Functional Density
Chinese websites and applications often integrate a wide range of additional features within the same platform to make them more competitive and versatile in the market. These features may include built-in e-commerce, social networking, payment systems, customer service, and personalized recommendations—all designed to keep users engaged within a single ecosystem. As a result, their interfaces tend to appear more crowded, with a higher density of information, text, and interactive elements such as buttons, banners, and pop-ups. While this design approach may initially seem overwhelming to users unfamiliar with it, it reflects a user behavior in China that values multifunctionality, efficiency, and convenience in a single app experience.
A2. Information Density
Older websites typically place all the information at the center of the screen, whereas more recent sites utilize a wider layout to present the information. New sites use different text sizes to create hierarchy and space to make reading easier for people.
B. Aligned with Western Design Trend
Chinese people are used to complex and dense websites and applications. However, recent updates have introduced more negative space and cleaner designs, making the interfaces easier to understand while still retaining their multifunctionality.
New websites are trying to align with Western design trends, which include:
-
More space between the contents
-
More creative interaction
-
Better in visualization
-
Information is more spread out – the layout has changed
-
More design involved
User Interview
I was able to interview a current client manager who works in China and uses the Charles River Investment Management System(CRIMS) to share his experience and ideas
Here are the findings from the interview with the user
What I learned:
-
During the interview, I discovered that a client had used a different Chinese character for the same English word. For example, duration in Chinese has two ways of writing it: 持续期 and 久期. They both mean the same, but the characters are different. However, from the interview, most people tend to use 久期 for duration. Therefore, when translating, be sure to determine which terms are widely used locally.
-
The current design aligns with the latest design trends in China, as Chinese websites are increasingly adopting Western design principles.
Next Steps
-
Focus on the translation – the use of Chinese characters and the font. Make sure people translating understand the industry language and the appliction
-
Translate everything or nothing. If we did a good job at translation, users would use it or else, the users would not want to use it.
-
Different clients use different terms for the same word. So, localization allows us to use different custom terms for different clients in the same language or allow different sets of terms.
Wireframes
