Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
BotにおけるUI/UX設計ノウハウ
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Niishi Kubo
August 03, 2018
Design
5
2k
BotにおけるUI/UX設計ノウハウ
2018/08/03【大阪】Bot Developers Meetup - LINE Bot開発者の勉強会
https://line.connpass.com/event/95135/
Niishi Kubo
August 03, 2018
Tweet
Share
More Decks by Niishi Kubo
See All by Niishi Kubo
GitLab Duo Agent Platform × AGENTS.md で実現するSpec-Driven Development / GitLab Duo Agent Platform × AGENTS.md
n11sh1
0
230
IaC・Terraform導入後の運用課題を改善!GitLabで実現する安全で効率的なインフラ管理
n11sh1
0
200
【ライブコーディング】 GitLab Duoで体感する『未来の開発体験』 - エージェントからAIコードレビューまで - #gitlab
n11sh1
0
110
GitLab Mobile DevOps と SaaS runners on macOS (Beta) の紹介
n11sh1
1
610
【B-5】農家と流通業者のタッチポイントにLINE Botを導入した話/LINE Bot case studies touch points of farmers and distributors
n11sh1
0
2.3k
自社オンプレのGitLabアップデートの歴史/GitLab's Update History On-premises
n11sh1
2
1.2k
Design Forms of Bot
n11sh1
0
88
What's Hackenduro
n11sh1
0
71
Hackenduro2018 Blockchain team
n11sh1
0
68
Other Decks in Design
See All in Design
CULTURE DECK/Creative Director
mhand01
0
980
30分でわかるインサイトマネジメント(2025年12月バージョン)
centou
1
480
新規AIプロダクトで、事前に知るべきだった3つの壁 〜医療AIを1年間作って、従来の開発が通用しなかった話〜 / Three Walls in Building AI Products
shikichee
2
3.9k
Goodpatch Tour💙 / We are hiring!
goodpatch
31
1.1M
decksh object reference
ajstarks
2
1.5k
Build for the Web, Build on the Web, Build With the Web
csswizardry
0
300
TWCP#21 UXデザインと哲学のはなし
shinn
0
320
【pmconf2025】PdMの頭の中を見える化する体験構造図
kamechi7222222
1
2.1k
「ツール」から「パートナー」へ。AI伴走時代のUXデザインとは?~操作を減らし、成果を最大にするための設計~
ncdc
1
280
Accelerating performance improvement based on a software review evaluation matrix
kitanosirokuma
0
150
CULTURE DECK/Frontend Engineer
mhand01
0
1.1k
「デザイン」の自分ごと化から始める、デザインピープルのふるまい
mewmo
0
200
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
85
9.4k
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
390
Code Review Best Practice
trishagee
74
20k
Amusing Abliteration
ianozsvald
0
140
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
3.7k
How Software Deployment tools have changed in the past 20 years
geshan
0
33k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.1k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
122
21k
Site-Speed That Sticks
csswizardry
13
1.1k
Agile Leadership in an Agile Organization
kimpetersen
PRO
0
120
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
0
240
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
180
Transcript
Bot ʹ͓͚Δ UI/UX ઃܭϊϋ
• Bot ։ൃ࣮ • UI/UX ઃܭϊϋ • ͳͥઃܭ͕ඞཁͳͷ͔ʁ • ͲͷΑ͏ʹઃܭ͢Δ͔ʁ
• Ͳ͏ͬͯϓϩτλΠϓΛ࡞Δ͔ʁ • ใऩू TIPS ΞδΣϯμ
• ߹ಉձࣾWVVUʢ͏ʔͿʣ • ৽نࣄۀͷ্ཱͪ͛ • גࣜձࣾZYYXʢ͡ʔ͘͢ʣ • WebγεςϜ/ΞϓϦͷडୗ։ൃ • גࣜձࣾࡔϊ్த
• ژͷࡊͷྲྀ௨ձࣾ • ੜଉ • େࡕɺژɺ౦ژ • ΤϯδχΞാग़ͰɺࠓϏδωεدΓͷࣄ ͯ͠Δਓ ࣗݾհ @n11sh1
• ϓϥοτϑΥʔϜ • LINE • త • Ո͕Էઌͷྲྀ௨ۀऀʹग़ՙใΛڞ༗ ͢ΔͨΊʢि1ճʣ •
ػೳ • ग़ՙใͷొʢex. τϚτ10kgΛ݄,ਫ, ۚʹग़ՙͰ͖Δʣ • גࣜձࣾࡔϊ్தʹͯՔಇத ࡊग़ՙใڞ༗ Bot
• ϓϥοτϑΥʔϜ • Slack • త • *OnboardingͰ໎ࢠʹͳΓ͕ͪ ͳͷͰɺϦʔυΛͭ͘Δ •
ػೳ • ৽نϝϯόʔʹɺඞਢใˍ λεΫͷ௨ • طଘϝϯόʔʹɺؔ࿈͢Δα ϒλεΫͷ௨ Welcome Bot * Onboarding ৫ͷҰһαʔϏεͷϢʔβʔͱͯ͠৽͘͠Ճೖͨ͠ ϝϯόʔʹख΄Ͳ͖Λߦ͍ɺ׳Εͤ͞Δϓϩηεͷ͜ͱ
ίΠϯૹۚ גՁ ͦͷଞ
͖ΐ͏͢༰ UI/UX ઃܭϊϋ ॻ੶ ࣮ମݧ
ͳͥઃܭ͕ඞཁͳͷ͔ʁ “transparent” user experience ҹʹΒͳ͍ ͬͯΒ͑ͳ͍ * Amir, Shevat. :
“Designing Bots: Creating Conversational Experiences”, 2017, No.673 ex. ϒϩοΫ͞ΕΔެࣜLINEΞΧϯτ
ͲͷΑ͏ʹઃܭ͢Δ͔ʁ શମ૾Λଊ͑Δ ࡉ෦ʹΛ͚Δ • ϓϥοτϑΥʔϜͷಛʢར༻Ϣʔ βʔ, ఏڙAPI ͳͲʣ • తˍػೳͷ໌֬Խ
• ϩΰ໊শ • ϢʔβʔͱBotͷձϑϩʔ • ίϯςϯπʢςΩετ, ը૾, ಈը, Ի, Ґஔใ, Ϙλϯʣ • AIʢࣗવݴޠॲཧʣͷಋೖɹͳͲ
ࡊग़ՙใڞ༗ Bot • ϓϥοτϑΥʔϜ • LINE • త • Ո͕Էઌͷྲྀ௨ۀऀʹग़ՙใΛڞ༗
͢ΔͨΊʢि1ճʣ • ػೳ • ग़ՙใͷొʢex. τϚτ10kgΛ݄,ਫ, ۚʹग़ՙՄೳͰ͢ɻʣ • גࣜձࣾࡔϊ్தʹͯՔಇத
Welcome Bot * Onboarding ৫ͷҰһαʔϏεͷϢʔβʔͱͯ͠৽͘͠Ճೖͨ͠ ϝϯόʔʹख΄Ͳ͖Λߦ͍ɺ׳Εͤ͞Δϓϩηεͷ͜ͱ • ϓϥοτϑΥʔϜ • Slack
• త • *OnboardingͰ໎ࢠʹͳΓ͕ͪ ͳͷͰɺϦʔυΛͭ͘Δ • ػೳ • ৽نϝϯόʔʹɺඞਢใˍ λεΫͷ௨ • طଘϝϯόʔʹɺؔ࿈͢Δα ϒλεΫͷ௨
ઃܭ͢Δ ̑ষҎ߱ʹॻ͍ͯ͋Δ͔ΒಡΜͰʂ ͩͱऴΘͬͯ͠·͏ͷͰ…
ઃܭ͢Δ 1. Branding, personality, and human involvement 2. AI 3.
The Conversation 4. Rich interactions 5. Context and memory 6. Discovery and installation 7. Engagement methods 8. Monetization * Amir, Shevat. : “Designing Bots: Creating Conversational Experiences”, 2017, No.673
ձͷछྨ λεΫओಋͷձ τϐοΫओಋͷձ • ͠ΓͱΓͳͲҙਤͷͳ͍ձ͕ϝΠϯ • ਖ਼֬ੑෆཁɺΉ͠Ζ༧֎ͷฦ͕ ٻΊΒΕΔ • ϧʔϧԽͮ͠Β͘AIͳͲ͕ඞཁ
• C͚ίϯςϯπ͕ଟ͍ • ୡঢ়گͷ֬ೝ, डऔ࣌ͷมߋ, ࠶ ୡґཔ • ਖ਼֬ੑ͕ٻΊΒΕΔ • ձΛϧʔϧԽͰ͖ΕAIͳͲෆཁ • B͚, C͚ͲͪΒ
Onboarding ͲͪΒ͕ ͍͍ͨʁ
Onboarding Ͳ͏ΞΫγϣϯͯ͠ྑ͍ͷ͔͔Βͳ͍ ʮ࠶ୡґཔʯͱςΩετೖྗʁ ͱΓ͋͑ͣԡͨ͠Β࣍ਐΊͦ͏ ࣍ճΞΫηε࣌͑Δ
Onboarding νϡʔτϦΞϧಈըϦϯΫΛఴ LINEΞϓϦͰYouTube࠶ੜ
ϧʔϧϕʔεͷձ STEP1 ૹΓঢ়൪߸Λ͖͘ STEP2 رୡ࣌Λ͖͘ STEP3 ࠷ऴ֬ೝ STEP4 มߋྃ
ϧʔϧϕʔεͷձ STEP3 ࠷ऴ֬ೝ STEP4 มߋྃ • ૹΓঢ়൪߸ͱرୡ࣌Λಉ࣌ʹೖྗ͞ΕͨΒʁ • ୡ࣌ʹʮຊʯʮʯͱೖྗ͞ΕͨΒʁ •
ૹΓঢ়൪߸ͱرୡ࣌Λٯʹೖྗ͞ΕͨΒʁ STEP1 ૹΓঢ়൪߸Λ͖͘ STEP2 رୡ࣌Λ͖͘
ࣗવݴޠཧղͱձͷཧ ࣗવݴޠཧղʢNatural Language Understandingʣ Ϣʔβʔೖྗ͔ΒҙਤʢIntentʣͱΩʔϫʔυʢEntityʣΛநग़͢Δɻ ex. Intentɿ࠶ୡґཔ EntityɿૹΓঢ়൪߸, رୡ࣌ʢຊʹ8݄3ɺʹᶃ18࣌ʙ20࣌ᶄ19࣌ʙ21࣌ʣ ձͷཧʢConversation
Managementʣ நग़ͨ͠Entity͕λεΫྃͷ݅Λຬ͍ͨͯ͠Δ͔Ͳ͏͔ɻ ex. رୡ͔࣌͠Ϣʔβʔೖྗ͞Ε͍ͯͳ͍߹ɺૹΓঢ়൪߸ͷೖྗΛଅ͢ɻ
վྑޙͷձ
Dialogflow https://dialogflow.com
ͦͷଞ Watson Assistant https://www.ibm.com/watson/jp-ja/developercloud/conversation.html LUIS https://www.luis.ai Amazon Lex https://aws.amazon.com/jp/lex/
LINE Bot Designer https://developers.line.me/ja/services/bot-designer/
Flex Message Simulator https://developers.line.me/console/fx/
Botsociety https://botsociety.io
Cacoo https://cacoo.com
ใऩू TIPS Chatbots Magazine https://chatbotsmagazine.com UX Collective - Bots https://uxdesign.cc/tagged/bots
The UX of Chatbots http://uxofchatbots.com BotList https://botlist.co botwiki https://botwiki.org
·ͱΊ • ҹʹΔˍͬͯΒ͏ͨΊʹઃܭ͢Δ • શମ૾Λଊ͑Δ • దͳϓϥοτϑΥʔϜΛબ͢Δ • తˍػೳΛ໌֬ʹ͢Δ •
ࡉ෦ʹΛ͚Δ • Onboarding͕ॏཁ • ϦονίϯςϯπͰϢʔβʔΤϯήʔδϦϯάΛߴΊΔ • AIʢࣗવݴޠॲཧʣMUSTͰͳ͍͕ɺUXͷ্ʹܨ͕Δ • Bot༻ϓϩτλΠϐϯάπʔϧͰ։ൃޮUPʂ
Thank U