Everyone is talking about voice assistants now and with Actions on Google expanding to even more countries across Europe, interest in Voice User Interface is growing rapidly. We can read a lot of articles and predictions about it, but there’s one thing still missing here – the proper tools for VUI designers.
When I started to work on my first action, I was convinced that with all that hype around assistants, I would find at least 10-15 different tools to choose from. I was planning to test all of these and share my thoughts with fellow designers. I couldn’t have been more wrong. The vast majority of the articles on designing for VUI will tell you that you should start with pen and paper. Just write a simple blue path, sit with your friend and check if there’s nothing awkward and… what then? You can treat paper notes as the foundation for the user-assistant conversation. But we needed something that would allow us to move forward a little bit more – to make quick iterations, change wording and word order to finally design all use cases and intents.
Not to mention that Actions on Google allows us to expand the conversation to other surfaces such as mobile phones or Google Home Hub. All of those should be handled and described in the final project to provide the highest quality for the product.
As a result, I had to alternate search criteria to find several useful tools. Here are my three favourite picks that I’ve been using with several ongoing projects.
Top 3 tools for Voice User Interface designers
1. Dialogue/Popped
Designing Voice User Interfaces by Cathy Pearl made me realise I might need to search for something else. Writing a script-play seems like a nice thing to start with. She mentioned Celtx, and that was my first hunch. Celtx script offers both mobile and desktop apps. The interface, although very simple, didn’t exactly meet my expectations. I was looking for something that would more closely reflect the interface used by Actions on Google on mobile phones.
And this is when I found a great app called Dialogue: Screenplay Writer. Unfortunately, it is only available on the App Store. Android users can still use the app’s web counterpart Popped.app. But… The biggest drawback here is that even though both applications seem to be one product, there is no synchronisation between the systems… Both seem to deliver very similar workflow, but you won’t be able to move freely between the two platforms.
But let’s get to the point. How can you use Dialogue? You may want to use the application during the early stages of creating your voice assistant – create first basic flows, their corresponding intents, and interactions between the assistant and the user. The app lets you divide your “script-play” into scenes which may serve as a separate use case for intents. Use those scenes for early-stage testing with your friends or work colleagues. What looks great in writing might not always sound that great when spoken out loud. You can run the test whenever you want – you will only need your phone. You can also keep your notes within the app.
There’s one more feature in the app which I find very useful. You can create custom-made avatars for your assistant or user. The avatar can be built from existing components divided into six categories: head, haircut, ears, eyes, eyebrows, and lips (+ colour). Personally, I use the editor to suggest some basic concepts for the persona of the assistant. This is the time to decide if our assistant will be a chick stylist, a computer nerd or a hipster barista.
Summing up, if you are writing the first dialog options for your assistant, you should definitely give it a try. I’m waiting for the integration between mobile and desktop app.
2. Celtx for Game Writers
Previously mentioned celtx offers a wide variety of products for creative writers. The basic celtx script may be used in a similar manner to Popped & Dialogue apps, but in a less appealing way. But there’s one product that might get your attention. A dedicated solution for game script writing. Interactive dialogue, dynamic visualisation – this is what we are looking for! The interface is not so straightforward and easy to use like in previous apps but offers more advanced features that might come in handy when designing that best Action on Google.
The app should help you create the whole flow for your action and all user-assistant interactions. Who doesn’t like to draw diagrams? For similar purposes, I’ve used draw.io and although the tool is great in many ways, I got tired of moving all branches back and forth when changing how we handle specific intents.
Celtx allows me to write more complex dialogue options with multiple branches but provides me with a general overview of the whole flow. Dynamic visualisation is customisable in terms of graphical representation. That helps a lot when I want all paths to be covered on one diagram and not to get lost in the process. For each intent, you can create both blue and red paths and distinguish them with a specific colour from the palette. If you feel that your diagram is becoming too complex you can always move the branches in such a way that feels convenient. And if that doesn’t help, you can always start a new sequence for a new intent and move it away from the first one.
This app also allows for collaboration, which I think is the biggest advantage here. You can work on the general flow and intents and let copywriters do their stuff.
The app might feel a little overwhelming at first, but after a short time, you’ll be using it like a pro.
3. Botsociety
When I was about to forsake my search for the perfect Actions on Google tool, I found this great app called Botsociety. I think you won’t find anything closer to a real-life assistant experience than this. The creators state that this is the tool to make your bot or voice assistant more humane.
I would say that Botsociety takes what’s best from the two above-mentioned apps to create one very easy to use solution to cover most of VUI designers’ needs. Sketching flows feels very natural – just like a regular conversation. You can even record user’s voice to get a transcript! Every each dialog option allows you to add a new path for the conversation. As far as the Action on Google is concerned, you are able to choose the voice for your assistant and later on decide to put emphasis on a specific word or change the pitch of the voice.
When you’re done, you may review the conversation on a flowchart which is generated automatically based on the written conversation. There are also several export options, one of which lets you export a video of a chosen path. Finally, you can share the project with other team members or clients and let them comment on specific dialogue parts, just like you can do on any collaborative design tool, such as Invision! How cool is that?
If that was not enough, you can collaborate with the dev team to use Botsociety’s API to integrate it with Dialogflow and create intents and variables for them to use.
Yet, I’m missing one feature. The tool does not offer rich responses used with a mobile phone on Actions on Google. This is somehow a big drawback for me. I would love to include some basic or table cards within the flow. Botsociety is focusing only on voice responses as far as Action on Google is concerned.
If you haven’t used the application already, you should do it right away. It will make a lot of things much easier, and speed up the process of building your action.
Best VUI design tools: final thoughts
I hope you will find this review helpful. Using those three tools in on-going projects for Actions on Google made my work a lot easier. If you’ve heard of any other tool that I should also take into consideration, please drop me a line on kamil.matuszewski@miquido.com. I hope some new tools will emerge soon so our job will be even easier.