UX Designer based in Vancouver, BC

ePurse

A digital bridge for overseas merchants


Since 2015, WeChat has been the world’s most popular multi-function Chinese mobile app, at 1 billion active users monthly. ePurse helps businesses established outside of China to enter the China market through this popular mobile app.

My client wanted to create a website that would communicate to potential investors and business owners the challenges in entering the China market and how ePurse can help merchants overcome these challenges. My role involved web design, web development, and deployment.

Defining the target audience

My primary objectives at this stage were to identify the audience, and my client's goals. From my client’s perspective, they are targeting:

The client’s goals were:

Using this information as a foundation, along with additional demographic data from the client and data from my own research, I create a few proto-personas.

diagram
Isabel and Marvin each represent a main audience group.

UX design strategy

Throughout the project as I was eliciting feedback on my design work via wireframes and mockups, I identified:

As the project was on a tight timeline, there wasn’t time to conduct extensive user testing, but I managed to do some light testing here and there.

Navigation label improvements

Naming navigation labels properly will greatly improve user experience. A good navigation label should use words that are familiar to the user, describe its page contents accurately, and be engaging.

Navigation before (left) and after (right). Descriptive labels are crucial to the user experience and discovery of content on a website. If a label does not bear enough context or confuses the user, chances are they won’t click on it.

I had some pre-conceived notions of foreseeable usability issues. But to make sure, I ran some quick tests with native English-speakers, asking them what they would expect to find on the next page if they were to access each of the navigation links. Here are some of the results:

Navigation link Feedback
About WeChat
  • “A section about the WeChat app”
  • “Huh? What is WeChat?”
  • “About us”
Our services
  • “What the companies does”
  • “Products and services”
  • “What they do”
Case studies
  • “Stories of successful customers”
  • “Experiment results”
  • “Company history”
About us
  • “Information on the company”
  • “What they do”
  • “People in the company”
Contact us
  • “How to contact the company”
  • “Contact information”
  • “Contact form”

“About WeChat” becomes “Entering the China Market”

“A section about the WeChat app”
“Huh? What is WeChat?”
“About us”

How my test participants perceived the label “About WeChat”

At first, I was confused why this section had been called “About WeChat”. Is “WeChat” another name for ePurse? Or maybe, “WeChat” is an alternative name for ePurse? Clearly neither of these scenarios could be the case. As it turns out, some of my test participants shared my confusion.

(WeChat is a popular Chinese multi-function mobile app, whose functions include messaging, payments, social networking, and merchant accounts.)

My client’s goal of this section was to educate the audience on the market they are entering, the challenges that come with it, and how ePurse can help them overcome these challenges by becoming active on WeChat as a business. Describing this section using words like “market”, that are more familiar to our audience, make it more appealing and meaningful to the user.

“Case studies” becomes “How it works”

“Stories of successful customers”
“Experiment results”
“Company history”

How my test participants perceived the label “Case studies”

This section was an explanation of the operational processes for a business to integrate with ePurse, broken down into 3 steps. Each step features interesting statistical figures help the viewer understand the habits of Chinese consumers. There are a few testimonials within the content, but they only serve a supplementary role, so calling this section “Case studies” would have been inaccurate. I thought labeling this section “How it works” was appropriate, because it more accurately describes its contents.

“Contact us” becomes “Get in touch”

“How to contact the company”
“Contact information”
“Contact form”

How my test participants perceived the label “Contact us”

This last modification was more of a stylistic suggestion on my part. Having “About us” next to “Contact us” creates a parallelism of using the word “us” twice in a row which can seem very rigid. So I suggested changing “Contact us” to “Get in touch”, to make use of language that is more natural and welcoming (especially since this is the last entry in the navigation list).

Making information useful to the audience

In a short blurb that highlights the popularity of WeChat in China, my client wanted to state the number of people who use this app in China, and what tier of cities these users live in. I noticed two potential issues with this:

I recommended to express the WeChat user population as a percentage of the population of China. That way, the website can remind the user the sheer size of China's population, and then express what percentage of this population use WeChat. (Turns out, it is quite a big percentage.)

Reframing statistics as relative percentages can increase the impact of a statement because it provides context in relation to a more familiar figure.
While [the tiered-city system] is common knowledge to residents of China, it may not be so useful and contextual to someone from another country.

In China, cities are classified in a tiered system, where higher-tiered cities have a higher GDP, larger population, and are goverened more centrally. While this is common knowledge to residents of China, it may not be so useful and contextual to someone from another country, as the Chinese City Tier System exists only in China.

So, to give a bit more context to the reader, I suggested to list examples of cities in Tier-1 and Tier-2 cities (e.g. Beijing, Shanghai and other well-known cities). This would allow investors to easily correlate what they may already know about the economy and society of these cities with cities where WeChat is most popular.


What I learned

When working with clients who’s target audience is in another country, they might not be aware that certain local concepts (e.g. tiered cities) might not be familiar to their audience. So it’s also part of my responsibilty to identify these situations and suggest ways to reframe the content to make it meaningful and useful to the viewer.

It was interesting how this project was highly-content driven, unlike most my other work. One of the earliest artefacts I received was a content outline, and my client had a strong sense of how the content would be organized at a high-level. At the lower level, my client had a sense of which pieces of content needed to be emphasized, but did not yet know how. I found that having a design system in place early on helped my client visualize the various ways that plain-text content can be presented, allowing us to communicate much more efficiently.