More Related Content
Similar to Microinteractions on chat UI ( and chatbot ) / UX JAM 19 presentation (20)
More from Yuhei Iwata (6)
Microinteractions on chat UI ( and chatbot ) / UX JAM 19 presentation
- 1. 2016/10/12(水) UX JAM 12 @ 株式会社オロ
Microinteractions
on chat UI
and 👽
Yuhey IWATA
2017/07/20(木) UX JAM 19 @ GMO Yours
- 7. コンテンツ
◆ テキスト
◆ 画像・動画等のメディア
◆ テンプレートに基づく付加情報
タイミング
◆ 返信がくるまでの時間
◆ タイピングしている時間
◆ 既読がつくまでの時間
ステータス
◆ 入力中表示
◆ 既読表示
◆ オンライン表示
ボタン/チケット/位置情報/etc.
よくあるチャットのUIと要素
7
機械学習でごりごり頑張られている
- 8. コンテンツ
◆ テキスト
◆ 画像・動画等のメディア
◆ テンプレートに基づく付加情報
タイミング
◆ 返信がくるまでの時間
◆ タイピングしている時間
◆ 既読がつくまでの時間
ステータス
◆ 入力中表示
◆ 既読表示
◆ オンライン表示
ボタン/チケット/位置情報/etc.
よくあるチャットのUIと要素
8こっちも頑張らないとバランス悪い
- 9. 👨 - 👩 特有のタイムラグ
入力中表示
9
既読表示
- 15. Facebook Messengerで見せかける
15
Facebook messenger API bot : “Typing bubble” “ indicator bubble”
https://stackoverflow.com/questions/36887919/facebook-messenger-api-bot-typing-bubble-indicator-bubble
{
"recipient":{
"id":"USER_ID"
},
"sender_action":"typing_on" // 20秒間入力中
}
{
"recipient":{
"id":"USER_ID"
},
“sender_action”:"mark_seen" // 既読付ける
}
送信APIにsender_actionを埋め込んでPOST
するだけ
入力中にする
一番下まで既読にする