Upwork Help Center Redesign:
Find answers fast and easy
Research, UX / UI Design, Product Design
Upwork is a global freelancing platform where businesses and independent professionals connect and collaborate remotely. Upwork’s Help Center is a public website users can visit to find the answers they have about the Upwork platform.
• Research, design and test all UIs related to the project
• Cooperate with Product Manager and Developer to implement products
Team: Customer Experience Director, Product Manager, Product Design Director, Product Designer, Illustrator, Back End Developer.
The Upwork help center team received a lot of questions from users about the Upwork platform because the help center site was difficult to navigate. Upwork decided to migrate the help center to Zendesk. The new help center site needed to be designed, adding the new features the Zendesk customer self-service platform provided, while keeping it consistent with Upwork’s branding.
Project goal
Update the help center design so that it is easily navigatable, better aligned with the current Upwork visual look & feel, and able to fully utilize Zendesk’s platform
Business goal
Efficiently answer customer questions through the Upwork Help Center, thereby freeing personnel from answering direct questions from users
User goal
Easily find answers to questions they have about Upwork’s platform
Based on Upwork users there are 4 categories for user persona:
Freelancers, Agency, Clients, and Enterprise.
Research
Competitive Analysis
An important part of the process was looking at other help centers to learn from their successes and for inspiration for the new layout. I looked at help centers from competitors, along with some outside the industry.
I carried out a usability review on a selection of help centers, in the form of a cognitive walkthrough. I carried it out as a first time user trying to find answer for their issues.
From my cognitive walkthrough reviews I narrowed down the list to 5 designs to focus on. 3 were from industry competitors, while the other 2 were chosen based on their strengths as help centers.
Competitive help center analysis: Usability Review
• Finding answers in some sites required navigating through multiple layers of the website.
• All five help centers had a submission form for the user in order to submit a trouble ticket.
• Customer support contact information was easy to find in all cases.
Most Help centers covered all the answers customers would need for creating an account. There were no issue with the content but some companies had search functions that weren’t well organized or difficult to use. Additionally, it was interesting to see that all sites had customer support sections prominently displayed.
I applied a task flow to show a user’s journey in finding an answer. I displayed every step, to include logical conditions and also mapped out every possible interaction.
After studying the task flow, analyzing what competitive sites focused on, and the content layout of all 5 sites, I quickly sketched 2 homepage wireframes.
I created visual designs after making the low-fidelity wireframe. One of the goals for this project was to make the help center consistent with Upwork’s component library style. I used colors, fonts, spacing, buttons, cards, icons, etc. from Upwork’s branding guidelines.
After discussing with stakeholders, we decided on which content to display and emphasize. The content we agreed were required for the help center were the search bar, categories of topics, suggested articles, and the contact bar. Next, I needed to use Upwork’s global components for the agreed upon content and design it in a manner consistent with Upwork’s branding.
We ran A/B tests to experiment with showing 3 different layouts. 50 external and 100 internal participants were used. We wanted to test which design users could easily navigate to relevant information, the search bar, and the chatbot for answers among the 3 designs. Our product manager conducted the tests in both the mobile and desktop designs.
In general, participants could navigate easily through the app and enjoyed its simplicity. 65% users preferred version 1, while only 14% preferred version 2 and 21% preferred version 3. We decided to go forward with version 1 after the tests.
I created the detailed pixel-perfect visual design for all of the screens. The goal was to think of every possible screen, element, and state that could be needed during development.
After I completed the visual design process, I handed over the specs to the developer for implementation. The submission rate of help requests decreased by approximately 23%. User and staff feedback has been positive, and both users and Upwork staff have been enjoying the new great experience. We continued to improve the help center experience after the initial roll out.
Thank you for watching!
If you like what you see and want to work together, get in touch!
[email protected]
