Video and slides synchronized, mp3 and slide download available at URL http://bit.ly/2o2hek6. Angie Terrell discusses the current state of conversational interfaces and human-centered design principles to guide the design of conversational apps. From messaging apps, with screen interface, to voice interfaces which require natural language processing, she talks about fundamental user-centered design principles to build experiences that avoid frustration and annoyance and provide value. Filmed at qconsf.com. Angie Terrell is the Director of Design at Big Nerd Ranch where she leads a team of user experience and interface designers. She designs mobile and web products for clients and is also an instructor for Big Nerd Ranch, teaching others to design for mobile and emerging technology.

1. Designing for Conversational UI
Angie Terrell
Design Director, Big Nerd Ranch

2. InfoQ.com: News & Community Site
• Over 1,000,000 software developers, architects and CTOs read the site world-
wide every month
• 250,000 senior developers subscribe to our weekly newsletter
• Published in 4 languages (English, Chinese, Japanese and Brazilian
Portuguese)
• Post content from our QCon conferences
• 2 dedicated podcast channels: The InfoQ Podcast, with a focus on
Architecture and The Engineering Culture Podcast, with a focus on building
• 96 deep dives on innovative topics packed as downloadable emags and
minibooks
• Over 40 new content items per week
Watch the video with slide
synchronization on InfoQ.com!
https://www.infoq.com/presentations/
design-conversational-interface

3. Purpose of QCon
- to empower software development by facilitating the spread of
knowledge and innovation
Strategy
- practitioner-driven conference designed for YOU: influencers of
change and innovation in your teams
- speakers and topics driving the evolution and innovation
- connecting and catalyzing the influencers and innovators
Highlights
- attended by more than 12,000 delegates since 2007
- held in 9 cities worldwide
Presented at QCon San Francisco
www.qconsf.com

4. Designing for Conversational UI
Angie Terrell
Design Director, Big Nerd Ranch

5. Designing for People who Use
Conversational UI
Angie Terrell
Design Director, Big Nerd Ranch

6. The Landscape

10. 2025

11. 2040

12. 2075

18. The Challenge

19. –Your client
“We need a bot.”

20. Getting Started

21. User Interface Design

22. User Interface Design
• Select the tasks to support

23. User Interface Design
• Select the tasks to support
• Determine the structure of the dialogue

24. User Interface Design
• Select the tasks to support
• Determine the structure of the dialogue
• Deciding which commands and features are available to the user

25. User Interface Design
• Select the tasks to support
• Determine the structure of the dialogue
• Deciding which commands and features are available to the user
• Letting user specify what they want

26. User Interface Design
• Select the tasks to support
• Determine the structure of the dialogue
• Deciding which commands and features are available to the user
• Letting user specify what they want
• Making the computer provide feedback on its actions

27. User Interface Design

28. User Interface Design
1. What is the environment/context?

29. User Interface Design
1. What is the environment/context?
2. What will be the common behaviors or modes of the user?

30. User Interface Design
1. What is the environment/context?
2. What will be the common behaviors or modes of the user?
3. What are the needs and expectations of the user?

31. Guidelines & Principles for
Conversational Interfaces

33. 1. Prompt-and-Response

34. 1. Prompt-and-Response 2. Recognition over Recall

35. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus

36. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus
4. Always Provide a Fallback

37. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus
4. Always Provide a Fallback 5. Respect People’s Time

38. 1. Prompt-and-Response

39. Intents

40. No Intent

41. No Intent
Hi Weatherbot.

42. No Intent
Hi Weatherbot.
Hello. You can request to hear the local weather or weather in
a particular city. Which will it be?

43. Partial Intent

44. Partial Intent
Weatherbot, what is the weather like in Madison?

45. Partial Intent
Weatherbot, what is the weather like in Madison?
Okay, I can check the weather in Madison. In what State?

46. Partial Intent
Weatherbot, what is the weather like in Madison?
Okay, I can check the weather in Madison. In what State?
Wisconsin.

47. Partial Intent
Weatherbot, what is the weather like in Madison?
Okay, I can check the weather in Madison. In what State?
Wisconsin.
Today’s weather in Madison, Wisconsin is…

48. Full Intent

49. Full Intent
Weatherbot, what will it be like in San Francisco, California today?

50. Full Intent
Weatherbot, what will it be like in San Francisco, California today?
Today’s weather in San Francisco, California is…

51. Intents

52. Close-ended

53. Close-Ended

54. Close-Ended
What is a top-rated bike pump?

55. Close-Ended
What is a top-rated bike pump?
The top-rated bike pump is the Vibrelli High
Performance Bike Pump for $37.98.

56. Close-Ended
What is a top-rated bike pump?
The top-rated bike pump is the Vibrelli High
Performance Bike Pump for $37.98.
Would you like to hear the rest?

57. Close-Ended
What is a top-rated bike pump?
The top-rated bike pump is the Vibrelli High
Performance Bike Pump for $37.98.
Would you like to hear the rest?
No.

58. Close-ended

59. Options

60. Options

61. Options
Would you like french fries or a salad?

62. Options
Yes.
Would you like french fries or a salad?

63. Options
Yes.
Would you like french fries or a salad?
don’t do this

64. Options

65. Options
Which side would you like: french fries or salad?

66. Options
Salad.
Which side would you like: french fries or salad?

67. Options

68. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus
4. Always Provide a Fallback 5. Respect People’s Time

69. 2. Recognition over Recall

70. - Luke Wroblewski
“When there's no graphical user interface (icons, labels, etc.)
in a product to guide us, our memory becomes the UI.”

71. Help

72. Help
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?

73. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?

74. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:

75. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:

76. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,

77. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,
give John 5 points,

78. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,
give John 5 points,
tell me the score,

79. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,
give John 5 points,
tell me the score,
start a new game, or

80. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,
give John 5 points,
tell me the score,
start a new game, or
reset all players.

81. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,
give John 5 points,
tell me the score,
start a new game, or
reset all players.

82. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,
give John 5 points,
tell me the score,
start a new game, or
reset all players.
So, how can I help?

83. Help
Help.
Score Keeper. You can give a player points, ask for the
score, or say help. What would you like?
Here are some things you can say:
add John,
give John 5 points,
tell me the score,
start a new game, or
reset all players.
So, how can I help?

86. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus
4. Always Provide a Fallback 5. Respect People’s Time

87. 3. Speech Requires Focus

88. –Human Factors and Voice Interactive Systems
“[People] lose attention after 10-15 seconds of listening
to a prompt.”

91. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus
4. Always Provide a Fallback 5. Respect People’s Time

92. 4. Always Provide a Fallback

93. Fallback

94. Fallback
Get off the couch!

95. Fallback
Get off the couch!
I’m sorry, Angie, but I didn’t understand “get off the couch”.

96. Fallback
Get off the couch!
I’m sorry, Angie, but I didn’t understand “get off the couch”.

97. Fallback
Get off the couch!
I’m sorry, Angie, but I didn’t understand “get off the couch”.
The available colors are: purple, orange, red, green, and blue.

98. Fallback
Get off the couch!
I’m sorry, Angie, but I didn’t understand “get off the couch”.
The available colors are: purple, orange, red, green, and blue.

99. Fallback
Get off the couch!
I’m sorry, Angie, but I didn’t understand “get off the couch”.
The available colors are: purple, orange, red, green, and blue.
Which will it be?”

100. Fallback
Get off the couch!
I’m sorry, Angie, but I didn’t understand “get off the couch”.
The available colors are: purple, orange, red, green, and blue.
Which will it be?”

103. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus
4. Always Provide a Fallback 5. Respect People’s Time

104. 5. Respect People’s Time

108. 1. Prompt-and-Response 2. Recognition over Recall 3. Speech Requires Focus
4. Always Provide a Fallback 5. Respect People’s Time

109. Recap
• At the present, we cannot interact with machines likes humans
• Designing a conversational UI does not free us from the most
substantial problems of user interface design
• Employ the 5 guidelines for conversational UI

111. Thank you.

112. Watch the video with slide
synchronization on InfoQ.com!
https://www.infoq.com/presentations/
design-conversational-interface