Client

Rebrand

ZTE USA

Overview

The world's fourth largest mobile phone manufacturer, with nearly 11% of the U.S. smartphone market, ZTE recognized the urgency to improve their US online brand image.

We were appointed to redesign the entire ZTE official corporate site as well as the e-commerce store. Here are 2 separate case studies to discuss some key sections in detail:

2

Support

Challenge

The Support page is one of the most visited pages on ZTE's corporate site. This is where existing customers interact with ZTE with a specific need in mind. A well-designed UX experience can win the trust and turn customers into repeat customers. However, a frustrating experience can break brand loyalty and lose the customer to a competitor's brand.

Role

• Product UX Design
• Project Management
• User Research
• Information Architecture
• Wireframe / Prototype

Team

4 Designers
2 Product Managers

Duration

10 months

Responsibilities

I took on the roles of design, research, and product management from start to completion, and provided design handoff and style guide to developers. In the end, it was 100% my design used to launch the redesigned ZTE USA site.

Before

Product Description Page (PDP)

The

Over time, the client has received feedback from customers and the Customer Service Division, and the main concerns were:

  • Confusing Support Page
  • Pages not optimized for mobile
  • Overwhelmed live chat and call center support
  • Outdated website design and layout
  • Dysfunctional Search & other UX Issues
Product Goals
  • Improve site information architecture
  • Mobile-first responsive website
  • Increase the number of loyal customers
  • Provide clear instructions/information to guide customers to find answers without additional help
  • Reduce workload for Support 
  • Present a smooth customer experience
After

Support Page

1

Discovery

Heuristic Evaluation | Stakeholder Interviews | Competitive Analysis

Heuristic Evaluation

Heuristic Evaluation was used by applying UX design principles and best practices.

The evaluation further confirmed the concerns expressed by ZTE and provided some insights into the causes of these frustrations.

Stakeholder Interviews

10 stakeholders from different departments were interviewed.

The process is crucial to provide valuable insights and help to understand the target audience, business goals, technical constraints, needs, expectations, and more.

Competitive analysis

We conducted a competitive analysis of ZTE's website to three of their main competitors in the US market - Apple, Samsung, and OnePlus, as well as several e-commerce sites.

We looked into their features, information architecture, instructions, UI and see how ZTE ranked in these key areas.

apple.com

oneplus.com

original zteusa.com

Maker:S,Date:2017-11-2,Ver:6,Lens:Kan03,Act:Lar02,E-Y
Maker:S,Date:2017-11-2,Ver:6,Lens:Kan03,Act:Lar02,E-Y
2

Research & Analysis

Analytics Review | Content Inventory | Content Audit | Card Sorting
User Interviews

Analytics Review

According to Google Analytics, the Support page had a high drop-off rate, bounce rate, and longer session duration as users were trying to browse through different pages to find answers.

Content Inventory/Audit | Card Sorting

To restructure the site, I created a content inventory that listed every piece of digital content ZTE previously had and the specific characteristics of each piece. Later, I ran a content audit to examine and evaluate the quality of the content listed in the inventory and uncovered content that required updating or to be removed.
With the updated list of content, open card sorting sessions were conducted with 3 online and 3 on-site participants. The result of these sessions helps us reorganize the Support section that makes sense to customers in the revised site information architecture.


I couldn't find information about the repair service, and live chat was unavailable, so I called the support line and waited for over 30 minutes.

— Brian, 34 yrs

User Interviews

We conducted online interviews with 5 customers to get their feedback on the Support section and to further understand issues and pain points.


I never register any of my electronics so I don't understand why do I need to register my phone?

— Kendra, 29 yrs

3a

Design

Wireframes | Prototypes

Wireframes

An initial round of wireframes were created for review. However, client expressed desire to see something more visual appealing, so we went ahead and moved on to prototyping.

Prototypes

Per client's request, instead of using wireframe for layout and placements, I created several PDP variations with different element placements and priorities. 

support-iteration


4a

Evaluate

Interactive Prototypes | User Testing

Interactive Prototype

After numerous rounds of iterations, I built an interactive prototype that could show how the finished PDP would look and flow.

User Testing

Explorative online user testing was ran with 5 participants to see if they can find answers and complete tasks.

usertesting-support1

The

Click on the numbers to read annotations

support-hp 2
1

Contrary to the original small search field, the new search Input field is front and center with placeholder text and features like autocomplete and popular search words

2

Replacing the previous 8 options with 5 organized options with short descriptions

3a

Top 5 most popular FAQ provided by the call center in the hope to reduce calls for these questions

4a

Contact information such as phone number, email, or live chat can be accessed quickly and directly from the support page

#Details
1Contrary to the original small search field, the new search Input field is front and center with placeholder text and features like autocomplete and popular search words
2Replacing the previous 8 options with 5 organized options with short descriptions
3Top 5 most popular FAQ provided by the call center in the hope to reduce calls for these questions
4Contact information such as phone number, email, or live chat can be accessed quickly and directly from the support page

support4
5a

2 CTA buttons for users to choose from (Request repair or check repair status)

6a

Provide information on how to obtain RMA for repair

7a

Clear checklist to ensure a smooth repair process

8a

Important information such as how to pack device to reduce unaccepted packages

#Details
52 CTA buttons for users to choose from (Request repair or check repair status)
6Provide information on how to obtain RMA for repair
7Clear checklist to ensure a smooth repair process
8Important information such as how to pack device to reduce unaccepted packages

support3
9a

User feedback indicated confusion on why they need to register device nowadays, so we provided 3 benefits to motivate device registration

10a

Minimal design on Registration form and layout to make the registration process easier

#Details
9User feedback indicated confusion on why they need to register device nowadays, so we provided 3 benefits to motivate device registration
10Minimal design on Registration form and layout to make the registration process easier

00:00:00
00:00:05
5a

Outcomes

  • Reduced Requests to Call Center and Live Chat

    users can now find the most popular answers on the Support Page without waiting to speak to a support agent

  • Better Content Organization

    content is organized into 5 options with clear description 

  • Increased CR on Device Registration

    3 benefits are provided to encourage device registration

  • Reduced no. of unaccepted or returned RMA packages

    users now can find clear instructions on the repair request, with a checklist to prepare the phone & package which can reduce unaccepted package received by the repair center