Helping users create help for themselves

Working with Reply.ai

Introduction

Chatbots are becoming a more and more widely used tool in online mediums. They are a convenient tool to use to maximize the efficiency of certain websites when delivering information to the user. For example, in the e-commerce industry, a chatbot could assist workers in answering customer queries and questions.

The chatbot itself is a fairly simple idea. The user asks a question, and the bot receives a question. Once received, the bot analyzes the question for key words and phrases, matches it to preexisting information stored in a vault based on those key words and phrases, and then returns that information to the user. This process is shown in the diagram below.

Simple view of the chatbot process

Reply.ai is a company that provides a medium through which companies can build their bespoke chatbots. Their goal is to make the process of creating a chatbot as simple and as efficient as possible so as to provide their clients with a comfortable environment in which to create, adjust, tweak, and train. Our goal was to help Reply.ai to achieve this level of delightful usability.

The Research Phase

Initial Problem Statement

How might we create a dashboard that is clear, accessible, and credible?

User Research and Persona

We went on to gather some information on our users through interviews and information that Reply.ai was able to provide us. After gathering our research, we synthesized the data and produced one major persona shown below.

Primary Persona

With our research now at a tangible stage and our primary persona complete, we were able to revise and refine our initial problem statement to one that was better suited to our goal.

Revised Problem Statement

How might we design a dashboard that has clearly organized data and requires minimal effort to learn and operate?

The Design Phase

Objectives

With this, we started to brainstorm and list out key objectives we wanted to achieve in our design. We agreed that users should be able to do the following:

  1. View the currently stored data in a visually appealing and organized way
  2. Filter the list of preset questions based on specific commands
  3. Optimize each error with no more than 6 actions
  4. Edit each question with no more than 4 actions

These objectives resulted in four distinct features listed respectively below.

  1. → Overview page
  2. → Queue page
  3. → Optimization page
  4. → Question editing page

Task Flows

We created two task flows, one for the optimization page, and one for the question page. Diagrams for both are shown below. The important part to note is the number of actions that each process takes. We were able to exceed our goal for the optimization page, and meet our goal for the question page.

Task Flows

Prototype and User Testing

After creating our task flows, we went on to redesign the four pages we listed above. We then used Invision to create a prototype, and presented this to our clients at Reply.ai. Photos of the prototype are shown below with annotations indicating the function of each major element.

Prototype screens

Our user testing was fairly successful. Our results were as follows.

  • 4 of 5 users suggested that a tutorial would still be helpful since the concept of creating a functioning chatbot can be daunting to anyone who is unfamiliar with it no matter how simple the process may be
  • 3 of 5 users found that the optimization process was clear and efficient
  • 3 of 5 users could imagine themselves working on the dashboard for over an hour

Some further comments included:

  • The colors are easy to look at
  • The “Top Requests” are very helpful on the optimization page

Next Steps

Moving forward from this stage, we wanted to create an even more friendly question editing page which would, itself, be a “chat-style” process. We would also like to augment the gamification that is already in place throughout the platform, and continue our research with the stakeholders to enhance the organization and efficiency.