VUI design and method to support number-guessing game

Slide 1

Slide 1 text

VUI design and method to support number-guessing game Yoichiro Tanaka, Google Developers Expert

Slide 2

Slide 2 text

Yoichiro Tanaka Software Engineer / IT Architect Google Developers Expert (Web) twitter.com/yoichiro google.com/+YoichiroTanaka

Slide 3

Slide 3 text

What is this? The following know-hows which I used when developing the number-guessing game app named "Bulls and Cows" for Google Assistant: ● VUI (Voice User Interface) design points and devices ● Methods and procedures at VUI design.

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

Happy path of Bulls and Cows

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

No content

Slide 8

Slide 8 text

No content

Slide 9

Slide 9 text

No content

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

No content

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

Design Checklist

Slide 14

Slide 14 text

https://developers.google.com/actions/design/checklist

Slide 15

Slide 15 text

Greetings and Goodbyes

Slide 16

Slide 16 text

Greetings and Goodbyes Tell users who you are. Give the right amount of information. End conversations appropriately.

Slide 17

Slide 17 text

Tell users who you are Give users an app name in the welcome message so that users can recognize what the app can be invoked. Welcome to Bulls and Cows. It is a game that guesses all three different digits. Zero is not included. Now, please say three digit numbers.

Slide 18

Slide 18 text

Give the right amount of information Give a minimum rule at first. ● Informed the thing ○ This app wants the user to say three digit number. ● Not informed the thing ○ Judge condition (n bulls, n cows) Tell users only what they wants first to do, and finish saying the Welcome Message as short as possible. Welcome to Bulls and Cows. It is a game that guesses all three different digits. Zero is not included. Now, please say three digit numbers.

Slide 19

Slide 19 text

Give the right amount of information A design which is not implemented yet: Cater your greeting to users with varying degrees of familiarity with your actions The experience of listening to "part of the rules of the game" every time you invoke the app is not good. -> You can control with app.getLastSeen() Welcome to Bulls and Cows. It is a game that guesses all three different digits. Zero is not included. Now, please say three digit numbers. I know...

Slide 20

Slide 20 text

End conversations appropriately Users can end the conversation with phrases like "bye" whenever they are in any contexts. Welcome to Bulls and Cows. It is a game that guesses all three different digits. Zero is not included. Now, please say three digit numbers. Bye The answer was 9, 5 and 3. Let's play again next time. Bulls and Cows left the conversation

Slide 21

Slide 21 text

End conversations appropriately Offer a chance which users can end the conversation when they achieve the purpose. Congratulation! You got three Bulls! Do you want to play again? 123 Bulls and Cows left the conversation No Ok, Bulls and Cows is finished. Let's play again next time.

Slide 22

Slide 22 text

Conversation Repair (Error Handling)

Slide 23

Slide 23 text

Prevent errors by expecting variations Handle two expressions users are going to say for the "please say three digit numbers". ● "One hundred and twenty three." → 123 ● "One two three" → 1 2 3 Both is a three digit number. 1 bull and 0 cow. One hundred and twenty three. One, two, three. 1 bull and 0 cow.

Slide 24

Slide 24 text

No content

Slide 25

Slide 25 text

Provide helpful reprompts or pivot to another question Users may give up when they take mistakes many times. -> The user never invoke the app again because of the difficulty. 1 bull and 0 cow. 123 456 789 1 bull and 0 cow. 1 bull and 0 cow.

Slide 26

Slide 26 text

Provide helpful reprompts or pivot to another question Ask whether want to hear a hint when the user takes mistakes three times. ● Avoid teach the hint without the user's opinion. ● Present a feeling that the app is worried about the user's many mistakes. ● By helping to achieve the purpose (= navigate to the correct answer), let the user a success experience as possible. 1 Bull and 0 Cow. Do you need a hint? 789 The sum of three digit numbers is 16. Yes

Slide 27

Slide 27 text

Provide helpful reprompts or pivot to another question There shoud be users who continue the game ignoring the suggestion of providing the hint. -> Predict behaviors of users in advance, provide an experience to be able to continue the game. 1 Bull and 0 Cow. Do you need a hint? 789 1 Bull and 0 Cow. 123

Slide 28

Slide 28 text

Conversational Dialogs

Slide 29

Slide 29 text

Sound natural It's a conversation, is not a auto-answer of call-centers. -> An important thing is believing users. ● Thrusting to say fixed phrases to users brings sounds un-natural. ● Simply, should say "Do you need ... ?". 1 Bull and 0 Cow. You can get a hint by saying "Hint" anytime. Hint 1 Bull and 0 Cow. Do you need a hint? Yes

Slide 30

Slide 30 text

1 Bull and 0 Cow. You can get a hint by saying "Hint" anytime. Hint 1 Bull and 0 Cow. You can get a hint by saying "Hint" anytime. 789 Hint The sum of three digit numbers is 16. [Should avoid] The implementation is simple, but the conversation is absplutely mechanical. * Rounded corners are Context, Rectangles are Intent.

Slide 31

Slide 31 text

[Should do] The amount of the implementation increases, but can bring sounds natural. 789 Hint 1 Bull 0 Cow. Do you need a hint? 1 Bull and 0 Cow. Do you need a hint? Yes Yes The sum of three digit numbers is 16. The sum of three digit numbers is 16. I see. Please say three digit numbers. 1 Bull and 0 Cow I didn't understand well. Please say three digit numbers. No 123 ??? * Rounded corners are Context, Rectangles are Intent.

Slide 32

Slide 32 text

Sound natural Prepare multiple phrases for one reply message. ● Don't provide unnatural sounds as possible. ● The number of the valiations is 3. The more, the better. ● Currently, the output phrase is selected by random. Actually, it is necessary to find a way not to select the same phrase continuously. Congratulation! You got three Bulls! Do you want to play again? Great! You got three Bulls! Do you want to play again? You got three Bulls! Wow! Do you want to play again?

Slide 33

Slide 33 text

A message resource file.

Slide 34

Slide 34 text

Tools and Procedures for Design

Slide 35

Slide 35 text

Tools for Design Currently, most nothing's tools for VUI designing. ● Many companies and communities are finding a way. Many tools might be provided from now. ● We don't have any tools, but we need some tool to design VUI apps. It is necessary to find some method by own (or refer to recommendations on Actions on Google)

Slide 36

Slide 36 text

My method 1. Write scenarios. 2. Find contexts. 3. Draw navigation between contexts. 4. Find intents, and add them to the context navigation. 5. Apply each dialog before and after each intent.

Slide 37

Slide 37 text

1. Write scenarios

Slide 38

Slide 38 text

Color alternate rows in Google Spreadsheet in advance. Convenience!

Slide 39

Slide 39 text

Happy Path

Slide 40

Slide 40 text

Play again

Slide 41

Slide 41 text

Help

Slide 42

Slide 42 text

Hint

Slide 43

Slide 43 text

Mistakes three times

Slide 44

Slide 44 text

2. Find contexts

Slide 45

Slide 45 text

2. Find contexts Search for a place where the theme of the conversation changed. Then extract before and after change as "context". ● "Listen to a three-digit number, and answer the judgment result" ● "After answering correctly, ask whether play again one more time" ● "After three mistakes, ask whether want to hear the hint"

Slide 46

Slide 46 text

Happy Path - The theme changed from "Now, gaming" to "Ask whether plays again" -> The context changed.

Slide 47

Slide 47 text

Help - Heard the help in "Gaming", but the theme not changed from "Gaming". As the result, the context is still "Gaming".

Slide 48

Slide 48 text

Mistakes 3 times - By mistaken 3 times, the theme changed to "Asking to hear a hint". That is, the context changed.

Slide 49

Slide 49 text

3. Draw navigation between contexts

Slide 50

Slide 50 text

"Now gaming" "Ask whether play again" "Ask whether want to hear a hint" Can understand an abstract of the conversation stream by drawing navigation between contexts.

Slide 51

Slide 51 text

4. Find intents

Slide 52

Slide 52 text

Happy Path - "I take a guess of three digit number" = "input.numbers" , "Specify that I don't play again" = "play_again.no"

Slide 53

Slide 53 text

Happy Path - The "input.numbers" intent changes a context (from "game" to "play_again")

Slide 54

Slide 54 text

Hint - "Hear a hint" = "help_hint" intent

Slide 55

Slide 55 text

Mistakes 3 times - The "input.numbers" intent also changes a context to "hear_hint"

Slide 56

Slide 56 text

4. And add them to the context navigation.

Slide 57

Slide 57 text

No content

Slide 58

Slide 58 text

5. Apply each dialog before and after each intent.

Slide 59

Slide 59 text

Ex: Insert intents and apply dialogs between the "game" context and the "hear_hint" context. 789 Hint 1 Bull 0 Cow. Do you need a hint? Yes The sum of three digit numbers is 16. The sum of three digit numbers is 16. I see. Please say three digit numbers. 1 Bull and 0 Cow I didn't understand well. Please say three digit numbers. No 123 ??? * Rounded corners are Context, Rectangles are Intent.

Slide 60

Slide 60 text

Mapping to Dialogflow

Slide 61

Slide 61 text

789 1 Bull and 0 Cow. Do you need a hint? 1 Bull and 0 Cow Congratulation! You got three Bulls! Do you want to play again? Training phrases Input context Output context Output context Output context Response Response Response

Slide 62

Slide 62 text

No content

Slide 63

Slide 63 text

Actually, Fulfillment is necessary A fulfillment is called from each intent. -> The fulfillment determines the following: ● Output contexts ● Response In the area of VUI design, it is unnecessary to include a fulfillment, because the fulfillment is for implementation.

Slide 64

Slide 64 text

Conclusion To fill the design checklist is important. There is no design tool and procedure established now. The flow may be better: Scenarios -> Contexts -> Intents -> Navigation -> Dialogs -> Implementation Don't need rich tools. To start a design, use Google Spreadsheet first!

Slide 65

Slide 65 text

Appendix

Slide 66

Slide 66 text

dialogflow-query-checker This is a checker tool to validate a result phrase against each query sent to the Dialogflow. https://github.com/yoichiro/dialogflow-query-checker

Slide 67

Slide 67 text

Botsociety.io Create a dialog mock up rapidly. Can export the video and generate code. Publish this mock up for testing. https://botsociety.io

Slide 68

Slide 68 text

Fin.