Transform Customer Experience on Websites
Ashley started to work remotely from home due to the pandemic. She googled "no green screen background removal" and found Personify Inc. She opened the website but was not sure which products to try and where to download the software. She clicked the "Try Free" button to sign up and was finally able to download the software. After playing around with the software, she encountered some issues but couldn't find the answers from the website. She didn't hear back from the support team after submitting a ticket for 4 days. She was frustrated because she couldn't make the software work.
The primary goal of this project was to streamline the workflow and customer journey on the websites for all stakeholders.
Problem Statement
1. Personify had an exhausting amount of support tickets that impacted the end-user experience and overwhelmed the team.
2. Personify has three different but similar products aiming at different market segments. Due to the accessible information was limited, lots of users were confused and reluctant to try the products.
Design Goals
Streamline Customer Journey
Highlight products' value propositions
Reorganize the information architecture!
1. Make navigating on the site easy and smooth
2. Deliver the value propositions to differentiate products efficiently
3. Establish a sense of place and clear relationships within the page content
What should be done?
Discovery
User Journey Map
Starting with mapping out the user journey of our website, our business goals, and the current site map to identify the areas that we can work on for improvements.
Data-Informed Hypotheses
I monitored session times, bounce rates, goal completions, and user behaviors on Google Analytics. We formed the design hypotheses of each phase based on the analytics, and discrepancies between the sitemap and the user journey.
Design Process
Hypothesis-Driven Ideation
The ideation phase is based on translating key observations and opportunities into actionable solutions. I worked with different internal stakeholders on the brainstorming, including using deliverables to explain the UX concepts.
Problem 1 - Download
From Confusion to Clarification
Problems
1. User could not easily access information that affects purchase decisions
2. Users were unable to see any sign of "download software" in the previous journey without log-in, they must sign up for an account. This led to a high drop-off rate after landing on the sign-up page.
Hypothesis Statement
If the user can download without log-in and get an overview of the system requirements, then they can easily access to try the product without failing the installation.
Design Decision #1 a clear navigation
Cleared up the information architecture on the site map while putting download in the navigation bar.
📍 Old nav bar did not include key information
📍 New nav bar makes key information more accessible
Design Decision #2 add a download page
Users are given choice. They are able to download both Wins & Mac versions of the software while getting informed with the requirements, and a link to all the previous versions on one page.
Problem 2 - Support
From Inefficient to Optimized
Problems
The previous FAQs of both products were hidden inside all the resources. By clicking FAQs, it brought users to an article with all kinds of questions (without order) listed in it. The way it was presented led to countless support tickets every day because users couldn't find the information they need, would rather jump to contacting us.
📍 Old support page
Hypothesis Statement
If the user can download without log-in and get an overview of the system requirements, then they can get the answers ASAP and would not have to reach out to support.
Design Decision
#1
The new design of FAQs greatly utilized the collapse and expand patterns to keep the layout clean when other information is not needed. For easy navigation, the questions are categorized under two software, between "General" and "Troubleshooting" while Tips go to "Featured Articles".
#2
Questions are listed in links form and by clicking it, users will see the answers expanded (please refer to the video below). Save time for users to find the answers by themselves.
#3
Users can directly access the support form once they enter the "support" page from the navigation bar, which greatly shortens the journey of post-sales support.
3
2
1
📍 I also designed the mobile version to ensure the design is responsive.
Problem 3 - Content
From Ambiguous to Obvious
Problem
Website visitors who just started their new remote working life need a way to understand what are the core values and capabilities of Personify's products in order to know if the products are the right tools for the next online presentation.
Design Decision
Presenting the complex information in a clean way. I reorganized the layout of the information, rewrote the copies, and chose the images that best represent the value of our products. The value proposition of the products and features are clearly visualized. So website visitors can grab who we are and what Personify is offering at a quick glance.
Role
UX Architect, Content Strategy
Duration
2 months, launched in Aug 2020
Process
Data analytics, user journey, hypotheses, streamlined information architecture, validation with wireframes, prototyping.
Success Metrics
120% increase in download rate;
37% Increase in upgrade rate;
support ticket decreased by 79%
Live Site
Reorganize information architecture, design graphics and copywriting.
Reorganize information architecture, design graphics and copywriting.
Reorganize information architecture, design graphics and copywriting.
Validation
I presented the mid-fidelity prototype of the new design to 7 users for usability testing and 95% able to successfully achieve the goals of
1. Exploring and understand the products (Awareness)
2. Easy access to software (Consideration)
3. Shorten the time of finding solutions to designated problems (Post-Sales)
Therefore, we moved on to high fidelity prototyping and staging.
Conclusion
After the new IA and design are implemented, we've seen a tremendous 120% increase in the download rate since users are able to easily access to try the software. Moreover, a 37% increase in the subscription rate as the content on the website gives clear messages on the capabilities of our products. Last but not least, the number of support ticket decreased significantly by 79% as FAQs is easily accessible.
(For confidentiality reasons, I have omitted the actual values for these metrics.)
As our team took the Lean UX approach on this redesign project, we need to keep monitoring live site data in Google Analytics and iterate accordingly.
Takeaways
Data is a crucial friend
The live site data of your website on Google Analytics tells you a lot of insights even without conduct a usability test. The following metrics are essential to monitor and iterate accordingly- conversion rate, drop-off rate, goal completions, and navigation summary.
Visual communication changes the game
An efficient visual communication could replace a million copies. It is also vital to communicate with visual designers from a user standpoint and promote the UX vision.