Say Hello.
New Product Development

Help Centre for Care Management System – UX case study

In this case study, I will explain step by step how I’ve designed the Help Centre feature for Care Management desktop app.

Free Download WordPress Themes
Download WordPress Themes
Download Nulled WordPress Themes
Download Best WordPress Themes Free Download
ZG93bmxvYWQgbHluZGEgY291cnNlIGZyZWU=
download micromax firmware
Download WordPress Themes
udemy free download

Task

Design a Help Centre that helps customers effectively to use newly designed desktop app and easy to find an answer to any questions that is related to the system and business.
Help Centre primary purpose is to reduce internal customer services calls.

Worked with

  • CEO, CTO,
  • Operations Manager
  • Customer Care Executive
  • Business Analyst
  • Technical Architect
  • Front-end Developers

My role

  • Analyse Data
  • Brainstorm
  • Workflow
  • Wireframes
  • Prototype
  • User Testing
  • User Interface
  • Interaction Design
  • Lead Front-End Development
  • GUI

"When technology delivers basic needs, user experience dominates"  - Donald Norman

Understand the Problem

To build realistic user stories, I’ve used an excel sheet with real questions and problems from our customers, provided by customer services department.

Excel sheet from custom service department

Bellow are a couple of questions examples raised by our customers:

  • How do I set up a reading list for my staff? (Care Management System related)
  • Do you have a Business Plan? (Business related)
  • What support do you have to help me with managing a disciplinary process? (Care Management System related)
  • Can you recommend any insurance companies? (Business related)

The Persona

Using help from the marketing department, I’ve described the persona.
Also, I’ve categorised the problems and questions of our customers.

User Persona

Using previous user testings and survey results, I’ve created a chart of preferred interaction methods and the possible type of content for the new Help Centre.

Preferred interaction methods and the possible type of content

The Brainstorming

After brainstorming exercise, I’ve categorised the notes, and come up with the structure of content.

Brainstorm

Help Centre Topic Structure

The User flow

I’ve started model the path that the user will take to find the help or answer.

The user flow for Help Centre

The Wireframes and Prototype

Knowing the user flow, I’ve started sketch ideas on how can look the Help Centre. I split the Help Centre feature into two parts: Help Centre Sidebar and Main Page of Help Centre. Help Centre Sidebar purpose is to find an answer for actual page. The goal of the Main Page of Help Centre is to present more information for overall Care Management System app.

Sketching

Sidebar. Video Tab.

Sidebar. FAQ Tab.

Sidebar. Audio Tab.

Sidebar. Resources Tab.

Quick links idea

FAQ

User testing

I’ve tested with five participants. As measurements I used the following:

  • What users do next if they need help to complete a particular action.
  • How quick participants find help to complete the task.

User testing

Iteration

Based on user testing results, I have made the following changes

  • Simplify the sidebar
  • Made more visible the Help Centre icon
Help Centre Wireframes UX

Whiteboarding

Sidebar

Search

Main Page

FAQ

Video

Audio

Resources

FAQ

Visual Design

Sidebar

Help Centre tooltip after 30 sec no screen activity detected.

Active Help Centre

Search by product

Search

Single Help Centre Topic Page. FAQ.

Single Help Centre Topic Page. Video.

Iterations

After second user testing I’ve improved Help Centre Main Page, including quick action buttons: “Get started,” “Suggestions”, “Ask questions,” “Book webinar”; Also, I’ve reduced the top part to win more space for content in the middle.

Changed icons with labels

Main Help Centre Page

Suggestions

Add Back button. More space for answer.

Lead Front-End Development

It was fascinating all visuals convert into HTML templates. I’ve worked with a team of two talented front-end developers. Also, I was responsible for quality assurance to make sure that HTML templates look precisely the same as designed visuals.

Result

I've learned how to manage a team of two developers efficiently. It was an inspiring journey.
I've started collecting the data on how performing the Help Centre feature. After I get enough numbers of analytics, I'll share with you more details about the outcome.

Next Case Study

Mobile Wizard Design Forms – UX Case Study