Designing applications for voice interface platforms
- 1. AI/UX Designing applications for voice interface platforms Philip Man, 2018.04.19
- 2. 5
- 3. How are they able to have a conversation? How does she know what he is saying and how does she produce speech to talk back? How did her designer create that?
- 4. Currently a product manager at Starbucks Digital Ventures. Before that product manager at smaller internet companies and startups. Occasional film maker, written and directed some short films and documentaries. Born and raised in the Netherlands. Hello!
- 5. The voice interface is the biggest revolution for UX and UI designers since the birth of the graphical user interface. Voice is the next large platform
- 6. Speech is the most natural form of interaction Write command lines Point with a mouse! Pinch with your fingers! Command with your voice! The Voice User Interface
- 7. 35 million users of voice-enabled speakers in 2017 (+129% over 2016) 55 million households will have a home assistant device by 2020. Smart devices will be up to 175 million Voice is on the rise
- 8. Building applications for voice 25,000 skills 40million devices for Alexa
- 9. What’s out there Cooking experience; guide through a recipe while having dirty hands Order coffee ahead in the car; could even do pick up in drive through Voice controlled home appliances; start laundry while still in bed Whiskey tips and info; don’t have to put your glass down anymore Order a ride; start queuing up while still doing your make up
- 10. Where is your brand present? .COM
- 11. Thinking through what VX will mean to your brand • Purpose and user stories • Design and create • Write a script • Create a personality • Identity intents • New opportunities and new roles A VX design primer
- 12. Product design for screens Product design for voice From screen to speech… …the words become your UI
- 13. Speech Subscribe me to the email news letter Sign me up for the news letter I want updates from this blog I want to subscribe to this service Design for utterances and intent Screen Click to subscribe S U B S C R I B E
- 14. Machine learning is at the heart of voice applications Automatic Speech Recognition Transcribe speech into textASR NLU Natural Language Understanding Extract meaning from the text = =“Black Car” “Black Car” Text to Speech Transform text to natural speechTTS =“Audi A8”
- 15. Building the right product; where does my brand need to be heard? Purpose Eyes and hands free Home device Personal Proactive Use case: what tasks are easier to complete? What things are more fun? Context: where is the user? Create for when eyes and hands are occupied. It’s not a personal device anymore, it’s a family and home device. You’re an assistant: design a proactive experience instead of reactive You’re a person now: learn about the customer from each conversation
- 16. Create the conversation flow Write a script and possible flows. Consider them your conversation wireframes. Just start writing in notepad!
- 17. Break down the speech What is the user trying to do? Design for variations. Utterances Intent
- 18. Your app is a collection of intents Cooking Skill Intents o GetRecipe o OrderIngredients o ShareDinnerRequest o StartRecipe o SetAlarmClock o PreheatOven o PlayDinnerMusic
- 19. The output goes in here
- 21. The meta information from the voice Who’s talking? Gender, age, accent, tone, pace, etc. Personality: What does this person answer? Is the person optimistic or pessimistic? Emotion: In what state is this person during the interaction? Happy? Disappointed? Surprised? VI: Voice Identity
- 22. Be as demanding about words and sounds as you are about being pixel perfect. Pushing words and sounds; what is on brand? "Sorry, you don't have enough money” "Sorry, it seems like there's not enough money”
- 23. Timeline markers Acknowledgements Pointers Transitions “First” ”Then” “Finally” Help set expectations about duration and next steps “Got it” ”Thanks” ”Okay” Feedback to show it’s understood and confirmed “This” “That” “Here is” Help identify subjects previously mentioned and referenced “Now” “So” “Next” Help introduce change when moving to different topic Help the user with speech navigation patterns
- 24. DON’T “I can help you get a ride, tipping your driver, receipts for your last ride, or surge check.” DO “I can help you get a ride, tip your driver, check your surge pricing, or get a copy of a receipt.” Clear UI; Use parallel language
- 25. • Whisper • Break • Emphasis • Phonemic • Prosody and more… This is your personal assistant, Google Home. This is your personal assistant Google Home. The HTML for speech Speech synthesis markup language (SSML) <speak> I already told you, <emphasis level=“strong”>the Tomorrow event is a private event.</emphasis> Why don’t you believe me? </speak>
- 26. A framework to understand personalities (MBTI model) Favorite world - Extraversion or Introversion: focus on inner or outer world? Information - Sensing or Intuition: take in information or interpret and add meaning? Decisions - Thinking or Feeling: make decisions by logic or people and feeling? Structure - Judging or Perceiving: get things decided or stay open and optional? Create a character; who is your brand voice?
- 27. Define its personality in the script • How does this person respond to critique? • How does this person think about gay marriage? • How does this person process new information? • How does he or she make decisions? • How does he or she prefers life to be structured?
- 28. And in different parts of the world What is your voice identity?
- 29. And in different parts of the world What is your voice identity? A young boy Or an uncle
- 30. New kind of teams VX designer Casting director SSML front end developer Sound engineer AI product manager Audio designer Script writer Linguist Production designer Semantics designer Character developer New kind of companies New business models Analytics company Advertising Gaming Social media Legal and trademarking Security and accessibility New design patterns A new paradigm
- 31. Migrating your application to voice www.alpine.ai Try it out yourself
- 32. Write your experience www.getstoryline.com Try it out yourself
- 33. Alexa simulator www.echosim.io Try it out yourself
- 34. Design with your eyes closed Philip Man, philipmanx@gmail.com, www.phlp.mn