top of page
Background
Frame 3 (3).png

Background

​

“Voice user interfaces are helping to improve all kinds of different user experiences, and some believe that voice will power 50% of all searches by 2020.”

​

 (citation: Goossens, Frederik. “Designing a VUI - Voice User Interface.” Medium, UX Planet, 18 May 2018, uxplanet.org/designing-a-vui-voice-user-interface-c0b3b9b57ace.)

 

Whether we’re talking about VUIs (Voice User Interfaces) for mobile apps or smart home speakers, voice interactions are becoming more common and valuable in today’s technology, especially with the concern of screen fatigue.

​

Let's use our knowledge of human psychology and linguistics as well as user experience design to ensure that we create usable, useful and intuitive VUI. Utilizing existing skills, this project focused on creating a voice interface for a medical APP with specific functionalities developing or building new Alexa Skills in the process.

​

Team

​

         Teaming: Agile

         Current Phase: MVP Delivered

         My Role: UX Designer, Scripted the Dialogue

​

My Role

​

  • User Research

  • Creating Device Persona

  • Creating Conversation Flows

  • Creating Dialogue

  • Testing

​

  • Tools: Luciad Chart, Adobe XD, Github, Voice Flow, Amazon Alexa Console

 

Challenge

​

  1.  Creating the best practice for various user scenarios of voice interaction.

  2.  Transforming APP flow into voice interface, eliminating user confusion.

  3.  VUI interacts with the back-end system accurately, less waiting time

  4.  Create a smooth and intuitive conversation with user personas.

 

Frame 2.png
Why VUI?

Why VUI?

​

Smartphone users are incredibly adept at two-thumbed texting and multitasking between tasks. Why do we want to add a voice conversation? What benefits can voice assistant bring to the users?

​

Significant Advantages of Voice Interface:
1. Speed: 
           speaking (dictating) text messages is faster than typing or manually research.
2. Hands-free: 
           users can make commands by speaking while occupied (driving or cooking).
3. Intuitiveness:
           any interface will somehow have barriers between it and its users. Voice interface can avoid gaps caused by visual communications.

 

What makes a successful conversation experience?

​

1. Keep the communication simple and conversational

2. Confirm when a task has been completed

3. Create a strong error strategy

4. Add an extra layer of security

5. Use visual to assist smartly (e.g. visual confirmation)

​

Design Process (I created for this project)

​

VUI designers need to create the entire conversation, from start to finish, between the system and the end-users. 

Like other UX projects, I took the design thinking process with voice design methods on the top of it to achieve a successful conversation flow.

Design Process
My First Board - New frame (5).jpg
Understand

1. Understand


Understand the interaction between a user persona and an assistant persona within the user journey map. 

​

1.1 User Persona


Unlike standard persona, I focused on user motivation on this project.

• What are the benefits of using a voice command versus a mobile APP?

• What information will bring security concern to users?

​

My First Board - New frame (1).jpg

1.2 Device Persona

​

Besides user research, understand the ability and characters of the device is very crucial. For this project, we are getting to know Alexa. 

My First Board - Device Persona.jpg

The device also knows manners. It is important to use conversational markers to keep user engagement. Useful conversational markers:

  1. Timeline (First, halfway here, last step)

  2. Acknowledgments (Thanks, got it, Alright, sorry about that)

  3. Ask for clarification 

  4. Positive feedback (nice to hear that, I'm glad to help you) 

​

Now, we have a good understanding of the device, we can start to look into user journey, and try to assist the users.

Customer journey map.png

1.2 User Journey Mapping

​

Similar as other UX projects, it is important to conduct user research specific to the VUI functions we are designing.

 

A journey map is a common method that identifies users’ needs at the various stages of engagement. It can also show how and where voice can be a method of interaction.

 

Here, I used “Ordering a Pizza with Alexa” as an example to break down user actions and reactions.

​

Journey Maps also help to reveal design opportunities.

​

Define

2. Define

​

Define user needs and pain point with design approach. After approved, mixed them into agile system with user stories. Define user cases with flow maps to ensure all the seniors will be handled. 

​

Start with this happy path, we define the explicit command during the conversation.

flow vui 3.jpg

2.1 Define the users’ requirements

​

The first step is to capture the different scenarios before turning them into a conversational dialogue flow between the user and the voice assistant.

Using Agile, write down requirements into backlog with user stories. 
With each user story in mind, design dialog flows for each them all.

My First Board - New frame (4).jpg

2.2 Conversation Flow

​

Prototyping VUI conversations with dialog flows the flow covered most of the user scenarios, showing the interaction between device and user.

​

Key of success:

1. Keep the Communication Simple and Conversational

2. Confirm When a Task Has been Completed

3. Create a Strong Error Strategy

4. Add an Extra Layer of Security

 

IDX- Conversation Flow Template - Flow E
Deliverable

2.3 Alpha Test: Role Play 
 

The first round of tests is like a role play. One person plays the user; another person plays the device. 

Role play is an easy way to help you create more intuitive flow. To create design carefully, a system should handle some of the more common forms of these subtleties; for example, users might say "thank you" at the end of the conversation. You can design your system to either ignore this or acknowledge it with a "you are welcome."

 

3. Deliverable

​

Instead of interface or visual elements, VUI includes dialogues, error messages, user flows. 

​

3.1 Understand a sentence

​

Before a dialog can be created, designers need to understand the anatomy of a voice command. When designing VUIs, designers always need to think about the objective of the voice interactions (i.e., What is the user trying to accomplish in this scenario?). A users’ voice command consists of three key factors: the intent, utterance, and slot.

 

image 6.png

3.2 Voice Script (Hi-Fi mockup)

​

Every possible utterance or response should be put into a spreadsheet, including error messages. 

pasted image 0.png

3.3 Talk to Developers

​

The conversation flows and dialog sheets are the most important deliverable. Passing along to the developers, it is important to make sure the developers understand some of the extreme cases. 

 

pasted image 0 (2).png
Testing

4. Testing

​

Before skills are deployed, test the conversation in the developer console. 

 

Frame 5 (2).png
Reflection

5. Reflection

​

It is my first time designing a voice interaction app and dive into the massive flow of user cases.

 

Either voice or tactile interaction, the key to success is always to use simple flow or common elements to keep the flow intuitive, but the approach will vary with the devices and platforms.

 

For voice, designers need to focus on the goal and users habits in the circumstance, and how can we make the process fast and directive. 

​

Thank you for reading :)

​

bottom of page