20191112_VUI開発で最も大切なデザインのお話

by yuka matsuba

Slide 1

Slide 1 text

VUI開発で最も大切なデザインのお話松葉有香

Slide 2

Slide 2 text

松葉有香まつばゆか某SIer勤務のシステムエンジニア → UXデザイナー @a093_jp #アカペラ #HADO #Alexa #Clova #Lambda #Node.js #スキル開発100チャレンジ #イラスト

Slide 3

Slide 3 text

本を書きました

Slide 4

Slide 4 text

【加藤家の食卓】サークルページ https://techbookfest.org/event/tbf07/circle/5730552053235712

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

出版までの経歴

Slide 7

Slide 7 text

※ スキル＝VUIにおけるアプリケーション #スキル開発100チャレンジ 2017.12

Slide 8

Slide 8 text

Why? 出展：ロボットスタート（https://robotstart.info/2018/12/04/japanese-alexa-skill-2000.html） 2018年12月4日日本国内のスキル数 2000突破

Slide 9

Slide 9 text

Why? 2000分の100 って、5%？作れたら、すごくね？（´-`）.｡oO

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

#スキル開発100チャレンジ ※ スキル＝VUIにおけるアプリケーション 2017.12

Slide 12

Slide 12 text

今は115個

Slide 13

Slide 13 text

2019.6.8〜6.9 2019.6.22〜6.23 2019.7.27 1位  2位  2位  Alexaスキルアワード2019 ハッカソンすごろく脱出ゲームお姫さまの国うん◯出た

Slide 14

Slide 14 text

4ヶ月連続達成！

Slide 15

Slide 15 text

これらの経験を通して気づいたこと

Slide 16

Slide 16 text

ユーザーに愛されるために大切な要素 GOOD VUI DESIGN

Slide 17

Slide 17 text

ユーザーに愛されるために大切な要素便利心地よい面白い

Slide 18

Slide 18 text

ユーザーに愛されるために大切な要素 if(心地よい && (便利 || 面白い))

Slide 19

Slide 19 text

ユーザーに愛されるために大切な要素 if(心地よい && (便利 || 面白い)) この大切さを伝えたい

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

GOOD VUI DESIGN VUIデザインとはなぜよいVUIデザインが大切なのか HOW TO DESIGN VUI FAILURE EXAMPLES 1. 2. 3. 4.

Slide 22

Slide 22 text

1 VUIデザインとは

Slide 23

Slide 23 text

UI DESIGN どのように操作すればどのように動くかを定義すること VUI DESIGN?

Slide 24

Slide 24 text

おすすめのレシピを教えて ♪ 和洋中どれがいいですか？和かな ♪ 和のレシピですね。それなら… VUI DESIGN? VUI DESIGN どのように発話すればどのように応答するかを定義すること

Slide 25

Slide 25 text

おすすめのレシピを教えて ♪ 和洋中どれがいいですか？和かな ♪ 和のレシピですね。それなら… VUI DESIGN? VUI DESIGN どのように発話すればどのように応答するかを定義することユーザーにどう言わせるのかそれに対してどう答えるのか

Slide 26

Slide 26 text

おすすめのレシピを教えて ♪ 和洋中どれがいいですか？和かな ♪ 和のレシピですね。それなら… VUI DESIGN? VUI DESIGN どのように発話すればどのように応答するかを定義することユーザーにどう言わせるのかそれに対してどう答えるのか会話設計

Slide 27

Slide 27 text

なぜよいVUIデザインが大切なのか 2

Slide 28

Slide 28 text

VUI の特徴学習することなく自然に操れる手や目が拘束されない ×

Slide 29

Slide 29 text

VUI の特徴学習することなく自然に操れる × これをいかに実現するかがよいVUIデザインになるか否かの分かれ道会話設計に依存

Slide 30

Slide 30 text

よい VUI DESIGN ができないと… 負の体験が蓄積 VUIが衰退使ってもらえない

Slide 31

Slide 31 text

よい VUI DESIGN ができないと… 負の体験が蓄積 VUIが衰退使ってもらえないそんなの嫌！

Slide 32

Slide 32 text

スマートスピーカーを愛する私たちのためにこれから愛して欲しい人たちのために私たちはよいVUIデザインを考えなければいけない

Slide 33

Slide 33 text

if(心地よい && (便利 || 面白い)) だからよいVUIデザインが大切

Slide 34

Slide 34 text

HOW TO DESIGN VUI 3

Slide 35

Slide 35 text

HOW TO DESIGN VUI ユーザーに与える体験を定義するユーザーペルソナを決める

Slide 36

Slide 36 text

ターゲットに適した話し方を考える SLOWLY EASILY BRIEFLY アシスタントの役割を決める GAME MASTER BUDDY ENEMY NARRATOR アシスタントの性格を決める HOW TO DESIGN VUI セリフを考える（会話設計） ♪ 口調テンションスタンス

Slide 37

Slide 37 text

アシスタントの役割を決める GAME MASTER BUDDY ENEMY NARRATOR アシスタントの性格を決める HOW TO DESIGN VUI セリフを考える（会話設計） ♪ 口調テンションスタンス HOW ターゲットに適した話し方を考える SLOWLY EASILY BRIEFLY VUIデザイナーはまるで『映画監督』

Slide 38

Slide 38 text

難しいのはやったことがないからそして一見難しく見えないから会話なんて誰でもできるじゃーん

Slide 39

Slide 39 text

そして本当は難しくないだってみんな心地よさは判断できるはず気持ちわるいよー！

Slide 40

Slide 40 text

FAILURE EXAMPLES SUCCESSFUL EXAMPLES ひとつひとつの会話に真剣に向き合うことが大切

Slide 41

Slide 41 text

FAILURE EXAMPLES 4

Slide 42

Slide 42 text

FAILURE EXAMPLES 〇〇スキルへようこそ。このスキルでは、〇〇ができます。〇〇をするためには、まず、〇〇と言ってください。すると、〇〇となりますので、そうしたら … 長ぇなぁ… 説明が長い 1

Slide 43

Slide 43 text

FAILURE EXAMPLES 長ぇなぁ… 説明が長い 1 起動回数に応じて説明を変える〇〇スキルへようこそ。このスキルでは、〇〇ができます。〇〇をするためには、まず、〇〇と言ってください。すると、〇〇となりますので、そうしたら …

Slide 44

Slide 44 text

〇〇〇スキルへようこそ。このスキルでは、〇〇ができます。どうしますか？ FAILURE EXAMPLES サポート不足何言えばいいの…？ 2

Slide 45

Slide 45 text

FAILURE EXAMPLES サポート不足何言えばいいの…？ 2 ロールプレイで試してみる〇〇〇スキルへようこそ。このスキルでは、〇〇ができます。どうしますか？

Slide 46

Slide 46 text

〇〇スキルへようこそこのスキルでは〇〇ができます早速始めますか？ FAILURE EXAMPLES 間がない聞き取りづらい… 3

Slide 47

Slide 47 text

FAILURE EXAMPLES 間がない聞き取りづらい… 3 心地よい間の長さを探る〇〇スキルへようこそこのスキルでは〇〇ができます早速始めますか？

Slide 48

Slide 48 text

FAILURE EXAMPLES 正確に聞き取りにくい海岸? 開眼? 4 カイガンでカイガンしました

Slide 49

Slide 49 text

FAILURE EXAMPLES 正確に聞き取りにくい海岸? 開眼? 4 カイガンでカイガンしました ↓ 海辺で開眼しましたなるべく訓読みを使う

Slide 50

Slide 50 text

〇〇は１番、△△は２番は、□□は３番、◇◇は４番、▼▼は５番、 ΔΔは６番、どれにしますか？ FAILURE EXAMPLES 大量の情報を与えるどれだっけ… 5

Slide 51

Slide 51 text

〇〇は１番、△△は２番は、□□は３番、◇◇は４番、▼▼は５番、 ΔΔは６番、どれにしますか？ FAILURE EXAMPLES 大量の情報を与えるどれだっけ… 5 メイン機能のみ伝えてヘルプに移譲・スキル分割

Slide 52

Slide 52 text

FAILURE EXAMPLES どこのイベントが知りたいですか？大量の情報を聞く長ぇなぁ… どんなジャンルがいいですか？いつのイベントが知りたいですか？ 6

Slide 53

Slide 53 text

FAILURE EXAMPLES どこのイベントが知りたいですか？大量の情報を聞く長ぇなぁ… どんなジャンルがいいですか？いつのイベントが知りたいですか？ 6 スキル分割・VUI化しない

Slide 54

Slide 54 text

今日もついたち頑張っていきましょう！ FAILURE EXAMPLES 発話が間違っている 7

Slide 55

Slide 55 text

FAILURE EXAMPLES 発話が間違っているついたち…? いちにち!? 7 今日もついたち頑張っていきましょう！

Slide 56

Slide 56 text

FAILURE EXAMPLES 発話が間違っているついたち…? いちにち!? 7 読みに注意今日もついたち頑張っていきましょう！イントネーションの調整も！

Slide 57

Slide 57 text

FAILURE EXAMPLES 1 2 3 4 5 6 7 説明が長いサポート不足間がない正確に聞き取りにくい大量の情報を与える大量の情報を聞く発話が間違っている

Slide 58

Slide 58 text

FAILURE EXAMPLES 1 2 3 4 5 6 7 説明が長いサポート不足間がない正確に聞き取りにくい大量の情報を与える大量の情報を聞く発話が間違っている人と人との会話だと思って違和感をなくしていく

Slide 59

Slide 59 text

SUMMARY

Slide 60

Slide 60 text

SUMMARY 負の体験が蓄積 VUIが衰退心地よい &&（便利 || 面白い）！会話設計 GOOD VUI DESIGN

Slide 61

Slide 61 text

SUMMARY FAILURE EXAMPLES SUCCESSFUL EXAMPLES ひとつひとつの会話に真剣に向き合って心地よさを判断

Slide 62

Slide 62 text

SUMMARY FAILURE EXAMPLES ユーザーにとって便利な・心地よい・面白い VUIデザインを目指しましょう！に陥らないように 1 2 3 4 5 6 7 説明が長いサポート不足間がない発話が間違っている大量の情報を与える大量の情報を聞く正確に聞き取りにくい

Slide 63

Slide 63 text

@a093_jp Thank you ♪ BOOTH, Kindleで販売中 http://a093.jp/goods/ 技術書博覧会もでます

Slide 64

Slide 64 text

No content