Introduction

Hi everyone, Mark here from Voiceflow, with another great template to help you get started in conversation design.

Quizzes and games are two of the most popular categories for voice experiences. In this video, I'll be walking you through a quiz-based experience called Spell the Word.

What are we covering in this video?

This video is broken down into a few different sections. First, we'll explain what Spell the Word is. Then, we'll show you how it works by walking through the project design. Next, we'll explain how to design for phonetics. And finally, we'll test the experience to see it in action.

Design Walkthrough of Template

Let's dive in. With our Spell the Word template, you can customize the game and add any words you see fit to make it as easy or as challenging as you like. Designed to suit audiences of all ages, Spell the Word brings the excitement of a live spelling bee right into your home. Before we walk you through the design, however, let's explain how it works.

When we open Spell the Word, the game selects random words for the user to spell - as the word Dog for example. If the user is able to spell the word correctly,  the system will recognize their response as a match, which will then prompt an audio jingle or "earcon", and a congratulations message from the assistant. If the user gets the wrong answer, they'll be prompted with a message telling them their answer is incorrect, and whether they would like to try again.

This project is split into three main parts. The first part handles picking a random word. For this, we are using the random step with a total of six paths because we have a total of six different words that can be guessed upon for this experience. We have also checked the "no duplicates" checkbox within the random step to avoid a word showing up more than once within the same user session.

The second part is comparing the word the user has spelled out with the correct answer. Because this experience relies on voice inputs, it's important to remember that voice responses rely on phonetics, aka how things sound, not how they're spelled. Therefore, when building this part of the experience, we design our system to account for how letters "sound" when a user is spelling them out loud. And so we created a custom intent for that with a custom slot.

To recreate the "spelling" experience, we've added a spell_intent. However, the custom spell slot we've created is a bit different. As I mentioned, because the user is spelling the word, for example, CAR, they will respond with C. A. R.. And so naturally how they spell the word is how we want to grab that information.

How do we do this? First, we assign each word to a slot value, and then using the slot synonyms field, we input the spelling of each word as you see them typed here. This will now match the correct spelling of a word to its corresponding slot value (which is the word itself).

So if the user says C.A.R. the slot value will be equal to CAR the word, not the spelling out of the letters. This plays an important role in how we carry out the next step or the third and final part of the experience.

For this, we are using the IF step which states that: if word (so the random word the user is spelling) equals spell (the slot value with the slot synonym mapped to the correct word), then the spelling of C.A.R will be equal to the word car. And if CAR {word} equals CAR {spell}, then the user has answered correctly, and we'll proceed to the block named Jingle + Correct. Here, one of three audio jingles will be randomly picked to play since we have enabled randomize outputs.

Now, if the user answers incorrectly, they will head down the other path leading them to the Jingle +  Wrong block where the assistant will say, 'that's not the correct answer'. It will then give the correct answer and ask if you would like to try again.

We also want to spell the word back to the user when they answer incorrectly. To do this, we have used the SSML tag 'interpret as character.' So for example, if the user misspelled the word car, we can add in the SSML tag interpret as character so that the assistant spells each letter of the word CAR when this speak step is trigger.

Prototyping the Experience

Let's prototype this in our test tool and see it in action.

Assistant: Hi and welcome to Spell the Word
‍Assistant: [Earcon plays]
‍Assistant: Can you spell the word, PIZZA?
‍User: The word PIZZA is P.I.Z.Z.A
‍Assistant: Ok, you said P.I.Z.Z.A
‍Assistant: [Correct Earcon plays]
‍Assistant: Congratulations! You have correctly spelled the word PIZZA. Do you want to try again?

Wrapping up

So that's an overview of the Spell the Word template. We hope this template inspires you to get creative so you can design unique quizzes and games of your own! If you want to learn about more ways you can build with Voiceflow, check out our templates library! It's entirely free and serves as a great resource to help build out the vision of your next project.