How to build a scalable Slack chatbot: Find out best practices for chatbots user experience and how to build these bots using GCP serverless technologies.

1. Building Slack Bots
with Google Cloud
Tomomi Imura (@girlie_mac)
#GDGCloudSF

2. @girlie_mac
Tomomi Imura
Slack
@girlie_mac

3. @girlie_mac
Bret McGowen
@bretmcg
Google
The content is created with:
Thankyou!

4. @girlie_mac
What are Bots?
A bot is a software application that runs
automated tasks (scripts).
Typically, bots perform tasks that are
both simple and structurally repetitive,
at a much higher rate than would be
possible for a human alone.

5. @girlie_mac
What are Bots?
Bots also are a user experience that can
expose products and services to users
through conversational engagement
and rich interactions.

6. @girlie_mac
!

7. @girlie_mac

8. @girlie_mac
Google
Cloud Functions
Slack PlatformSlack Client
Events
Web API
Events
Web API
Bot Architecture Example

9. @girlie_mac
Bot
Interactions
Bot Interaction Types
and Slack Platform Features

10. @girlie_mac
Interactions 1 - Slash commands

11. @girlie_mac
The example payload sent to the configured external URL via HTTP POST:
token=gIkuvaNzQIHg97ATvDxqgjtO
team_id=T0001
team_domain=example
channel_id=C2147483705
channel_name=general
user_id=U2147483697
user_name=bob
command=/weather
text=94901
response_url=https://hooks.slack.com/commands/1234/5678
trigger_id=13345224609.738474920.8088930838d88f008e0
Slash commands

12. @girlie_mac
Send back a plain text or JSON response with HTTP 200 “OK”:
{
"text": "It's 80 degrees right now.",
"attachments": [
{
"text": "Partly cloudy today and tomorrow"
}
]
}
Slash commands

13. @girlie_mac
★ Name the command thoughtfully
★ Avoid a generic command e.g. /find
★ Format the results
★ Even if no reply is posted back,
respond w/ HTTP 200
Slash Command Best Practice

14. @girlie_mac
Slash Command Use Cases - CRM

15. @girlie_mac
Interactions 2 - Notifications

16. @girlie_mac
Notifications
POST Request to chat.postMessage (https://slack.com/api/...)
POST /api/chat.postMessage
Content-type: application/json
Authorization: Bearer xoxa-xxxxxxxxx-xxxxxxx
{"channel":"C061EG9SL","text":"Hello, human."}

17. @girlie_mac

18. @girlie_mac
★ Format the text
★ Keep it simple
★ Use emoji effectively
★ Do not ever never spam users!
Notification Best Practice

19. @girlie_mac
Interactions 3 - Conversations

20. @girlie_mac
Conversations
Listening to events

21. @girlie_mac
Conversations
Listening to events
"event": {
"type": "message",
"channel": "C2147483705",
"user": "U2147483697",
"text": "Hello world",
"ts": "1355517523.000005"
}
If your bot sees trigger words, send back a message with
chat.postMessage

22. @girlie_mac
★ Let users know how the bot works w/
thoughtful onboarding / guide
★ Support keywords like help
★ Combine w/ rich interactions like
buttons
Conversational Bots Best Practice

23. @girlie_mac
Interactions 4 - UI Elements
Make the interactions richer w/ buttons & menus

24. @girlie_mac
Interactions 4 - UI Elements
Make the interactions richer w/ dialogs

25. @girlie_mac
Use Cases - Project Management

26. @girlie_mac
Bot Interactions Summary
Slash commands - Send results on user’s demand
Notifications - Send reports or alerts into a conversation
Bot conversations - Facilitate short workflows
Rich interactions - Augmenting all of these with actionable
buttons, menus, dialogs, etc.

27. @girlie_mac
Demo

28. 28
Emoji
Reaction
(“Reacji”)
Event

29. @girlie_mac
Reacjilator
Triggers by an emoji reaction event
Translation API
event:{
type: 'reaction_added',
user: 'U5R3PALPN',
item: {
type: 'message',
channel: 'C5TS6D8CC',
ts: '1508284331.000239'
},
reaction: 'flag-jp',
item_user: 'U5R3PALPN',
event_ts: '1508284554.000254'
}
Extract the message with
conversation.replies
method
reaction_added
event is triggered
1
2

30. @girlie_mac
Source code
https://github.com/slackapi/reacjilator

31. @girlie_mac
Building AI
Assistants on
GCP

32. @girlie_mac
High-level Bot Architecture
Business logic
Database
HTTP
Machine Learning

33. @girlie_mac
w/Natural Language Processing
Business logic
Database
HTTP
Machine Learning
Dialogflow
HTTP

34. @girlie_mac
What is NLP?
Process and analyze natural language data to make the interactions
between computers and human (natural) languages possible

35. @girlie_mac
NLP w/ Dialogflow
Dialogflow
Unstructured Text
(Human Understandable)
User Intent
(Machine Understandable)
Hey,
@officebot

36. @girlie_mac
Dialogflow https://console.dialogflow.com

37. @girlie_mac
But wait,
do you really
need NLP / AI?

38. @girlie_mac
Notifications Slash Commands Conversational

39. @girlie_mac
Notifications Slash Commands Conversational
Nuh Maybe Yass!

40. @girlie_mac
GCP All the Things!
Cloud
Functions
Cloud
Datastore
HTTP JSON
request
Dialogflow
Cloud ML
Vision

41. @girlie_mac
Demo

42. 42
Keanu Bot

43. @girlie_mac
KianuBot Architecture
Cloud
Functions
DialogflowSlack
Server
Slack
Client
Cloud
Functions
Query FulfillmentEvent

44. @girlie_mac
Source code
https://github.com/bretmcg/keanubot
By Alan Ho & Bret McGowen

45. @girlie_mac
But keep in mind...
Bot interface is really a human interface.
Write code for machine,
but build bots for human!

46. @girlie_mac
Thank you!
@girlie_mac
BY-SA

47. @girlie_mac
Resources
Slack API
https://api.slack.com
Google Cloud - Slack Tutorial
https://cloud.google.com/functions/docs/tutorials/slack
Slack Platform Blog
https://medium.com/slack-developer-blog/