5 minutes

A Beginner’s Guide to Voice UX Prototyping

0 Comments

As voice technology becomes more and more prominent, we’ll need to design more and more voice apps.

In this post, I will go over a general overview for those who are unfamiliar with voice prototyping. It’s not a complicated process but it is a little different than the typical UI prototyping we often do for website or app.

1. Speech is a New Medium

Speech interactions aren’t as logical or linear as user flows within a website. A conversation can happen anywhere, anytime. On a website, a user can only go where you allow them to.

This also means that we have to realize that users don’t communicate the someway when they write/text than when they speak. A conversation is ever flowing. And, although it can circle back to a previous point of information, a conversation doesn’t go backward only forward.

Speech is a New Medium

It’s a different interaction when you’re looking up pizza deliveries on your phone vs asking Alex or Siri to order one for you. It’s also a different experience when you misspell pizza in a Google search then when Alexa or Siri did not understand you. Keep this in mind when you’re designing for voice: you’re designing a conversation interface, designing it for how people speak not write.

2. Creating a Persona

Start off by considering the role your voice app will play within the user experience of your users. What is their role? Next, you must ask yourself who is your persona? How does the persona of your voice app represent the brand?

A voice application of any kind is an extension of your brand. You should first reflect on what the company’s brand is and use these characteristics to define the persona of the voice app. Imagine that your users are going to be interacting with an extension of your brand. It’s a new but fun and creative opportunity to delight your users or customers even further. It’s also a fantastic opportunity to build a stronger bond between your company and brand and your users.

Determining the characteristic of your persona will have a profound effect on how your users will perceive your voice app and your company. For example, is your voice persona female or male? Is it witty or funny? These things matter.

Impress your audience with animated websites and web presentations.

With Slides, we don’t make you start from an empty slate. All you have to do is to pick the elements you like best and combine them. Each slide has been carefully crafted to satisfy three key criteria: aesthetic, function and usability. That way you know every element works together seamlessly while enhancing the impact of your content.

Create a Website
Creating a Persona

Lastly, and whatever you do, the voice persona needs to be relatable for your users. Look at who your users are and what would be the most familiar to them.

3. Writing out Sample Dialogs

Next, you will need to indicate where a possible voice interaction could, would or should happen within a user flow. You won’t be able to write it all out within a flow the same way you can’t design the mobile app pages within it either. A flow is a flow after all.

After indicating where they happen, briefly describe the scenarios in which a voice interaction would happen. This will give you a clear purpose of a voice interaction and a lot more context for writing out a sample dialog. And that’s what you do next. For each scenario, write out your sample dialogs.

Below is a sample dialog.

User: I want to order a pizza.

Voice app: Hey Paula, no problem. I see you’ve ordered the same thing the last few times. Do you want to order a large cheese pizza with an order of mozzarella stick again?

User: Yeah, sure.

Voice app: Great. Do you want us to deliver it to you in about 30 min or do you want to pick up in the shop? It will be ready for pick up in 10 min.

User: Deliver it to my house.

Voice app: The house address we have on file is 123 Alphabet Street is that correct?

User: Yes it is.

Voice app: You got it. That’s going to be $15.79. Do you want to pay with one of the cards we have on file or cash on delivery?

User: with cash

Voice app: Your order has been placed and I’ve emailed you a confirmation. The delivery should arrive around 8:30 PM.

4. Voice Prototyping

Alas, we’re into the prototyping stage! There are many tools out there but be aware that voice design is still a fairly new medium. There are only a handful of prototyping tools out there compared to the numerous website prototyping tools.

You can try one of the following apps:

  • Thestoryline – an interface mapping tool for Alexa Skills.
  • Sayspring – voice interface tool for both Alexa and Google Assistant
  • Botsociety – multi-platform voice prototyping tool for Messenger, Slack, Alexa and Google Home
  • Dialogflow – for building natural conversation experiences

Document your dialogs

You should also keep your prototypes and dialogs well documented. Documenting you dialogs is just as important as documenting any other aspect of your product. Each dialog should, at the very least, have a unique name, type (an order, transfer, cancellation, etc), initiation (what prompts this specific dialog) and the outcome (what will this achieve for the user? What can the user expect next?).

Error states

Errors are bound to occur for a verity of reasons, from the voice app not recognizing what the user said to the user not providing the appropriate information required to move on.

You will need to include error states in your dialogs just like you’d with an online form. The best way to address errors when the user is not compliant is to provide progressive and helpful directions. You want to mitigate the issue and get the user to provide the proper information instead. If you’re asking a user for a date like a birthday or a credit card expiration, a user can tell you this information in a warty of ways such as with only numbers or a mixture of both numbers and words. For example, I can say my birthday is May 1st, 1999 or the first of May, ’99. You need to account for that.

Furthermore, what if a user gets confused about how to provide the date? What if there is a long pause or an ‘ugh’ or an ‘ummmm…’? What do you do then?

Here is an example provided by Emily Grace Adiseshiah:

Voice app: What’s your date of birth?

User: Uh…

Voice app: Just tell me your date of birth using 2 digits for the month, 2 digits for the day, and 4 for the year.

Error states

Additionally, there are a few other issues to consider. What if a user is speaking with a heavy accent, has a stutter, speaks quietly or is in a noisy area. Again, take these things into account respectively and make sure to make room for these specific issues within your prototype.

Test your prototype

The point of any prototype is to test your ideas so go ahead and do that. Test your prototype with real people and see how well your voice app and the overall project is doing.

“The road to product glory is littered with the broken bodies of those who didn’t want to – or thought they didn’t need to – test their assumptions.” – James Fox What’s the Point of Prototyping?

Conclusion

In this post, we’ve covered the general process of how to prototype voice interactions. Have you worked with voice prototyping before? What are your thoughts on it? Do you have any other pro tips for our beginners?

Paula Borowska

Paula is a freelance web designer who documents her travels with photos and words. She works with small companies that want to re-brand their online businesses to create products that change lives of their customers all in the hopes of gaining more customers and retaining their current ones longer.

Posts by Paula Borowska
Cookie Icon
We use cookies to ensure that we give you the best experience on our website.
  • I disagree
  • I agree