Voice interfaces and user experiences are a trending topic in the world of website design because user behavior is demanding it.

Just think of how often you ask Alexa, Google, or Siri for help on any given day. Think about the push for more accessibly designed websites that work more effectively with devices such as screen readers. Then think about whether these things are coming into play during the design and development process.

They should be.

It is more important than ever to integrate voice UX into your design process.

What is Voice UX?

Voice UX – or voice user experience – is growing in use every day.

• 27% of the global population uses voice for web searches
• 11 million people regularly use voice assistants
• 50% of almost all searches use voice

A voice user interface allows people and devices to interact through natural speech. This is a new concept for web designers because it requires two-way communication with an interface.

People talk to activate or ask questions that may be found on the website and the device speaks back to the user to deliver those answers or read website content.

The most common types of voice applications include:

• Voice-activated devices
• Website information to be “read” by voice devices
• Screen readers for accessibility (this is the most simple use in terms of design and won’t be the main focus here)

Many people argue that voice is a fast-approaching future for web design with the number of people using these devices and features growing almost daily.

Why Voice UX Matters

Voice UX matters to you as a designer because people are using it to access your products. You might not think of this as “design” because it isn’t visual, but it impacts those decisions as well.

It’s likely you’ve been adding alt text to images for a while. You may have initiated this practice to help with search, but it also helps with voice because interfaces now have an extra signal as to what is on the screen visually. Screen readers will use that to communicate to visitors what is on the page. Search engines use it to respond to voice queries.

Voice is important because of the ease and usability of the tool and how quickly users have adopted use. As online listening continues to improve – just think of how much more accurate Siri is now compared to five years ago – usage will continue to grow.

People use it for a variety of reasons including:

• Speed; voice can be faster than typing
• Ability to work hands-free
• Ability to work without looking at a device
• Lack technological barriers that some devices and tools have

At the end of the day, voice design matters because, without it, your design is likely to fall behind the curve.

Key Considerations

Voice is most important when it comes to certain types of informational experiences. Voice UX is common with more transactional experiences that have relatively short durations.

People use voice to:

• Accomplish a task (increase volume; make a purchase)
• Gather information (ask a question looking for a direct answer)
• Entertain themselves (have conversation with device)

With that in mind, the elements of voice are the same as traditional design. Instead of thinking about color, typography, and spacing, the focus is on intent, utterance, and slots (or variables).

Intent is the goal of the interaction. This is divided into high-utility (a specific task or request) and low-utility (ambiguous or vague request) interactions. The more high-utility of the request, the easier and more likely it is to get a more accurate response. An example would be “dog-walker in London” (high-utility) versus “local dog walker” (low-utility).

Utterance is how the user speaks a command. When it comes to voice semantics do matter, although interfaces are getting better at understanding this all the time. For you, this means your interface needs to understand multiple variations of the same thing.

Slots or variables are elements of voice interactions that might not be required. These are the optional “fields” in the conversation or request. This can be the most complicated element of voice interaction because you have to weigh optional versus required “fields” and prioritize information or variables. In a nutshell, slots help refine search queries in voice to make them more specific and valuable to the person asking for information.

Voice Interface Prototyping

When it comes to thinking about voice interface design the wireframe is going to look a lot different. You actually have to change your mindset a bit and think more like a writer or storyboarder.

The traditional wireframe will be replaced with a dialog flow that reads like a back and forth conversation to map how users may ask questions to get to content and what those responses will look like.

Instead of buttons and links, you map flows that include keywords that prompt a voice engagement, options for how that “conversation” might go, and sample phrases and dialogs for voice assistants when they come across your content.

Tips for Designing for Voice

Once you have a dialog flow – the voice UI wireframe of sorts – then you have to integrate some of the same cues you would with a visual design for voice so that users have complete control and understanding of their experiences.

This includes:

• Creating a feedback loop that denotes a start and finish to voice interactions
• Designing an “out” or help scenario if the user isn’t getting what they want
• Thinking about security and how users get into your website with payment or passwords
• Language and speech patterns; we often write differently than we speak

The most difficult part of designing for voice might be interpretation. How do you really know what the user is asking for?

When designing with voice in mind, the idea of microcontent – particularly for transactional inquiries – is important. Short answers to questions can help your website get more interactions with voice. Simple answers, often following a question, can help your website become more visible and discoverable to searchers using voice.

Think about how you can design these microcontent pieces throughout your design to facilitate voice interactions for almost any user. It may be one of the most simple voice design elements any team can implement because it is rooted in content.

With screen readers, the voice engagement is pretty simple, they simply recite the information on the screen. Voice-activated controls and search are different in that they are trying to interpret intent. That’s a tricky business that requires a lot of trial and error.

Conclusion

Voice interfaces are a growing area of design. While you may not be fully designing for voice, everything you do does have an impact.

It’s important to think about both kinds of voice interactions – voice coming from the user to engage with the interface and voice coming from the interface for the user to listen to. Remember both parts of the “conversation” when thinking about voice UX.

With the growth of voice as a search tool and for e-commerce, this practical trend will likely continue to grow. Now is the time to start planning for it in your projects.