building chatbots

52
January 2017 – NYC Ports & Logistics Hackathon Find the content here: http://bit.do/spark-bot Follow us on Twitter and/or tweet at me. @tessamero and @auhyland By Tessa Mero and Austin Hyland Building Chat Bots Made Easy

Upload: tessa-mero

Post on 12-Apr-2017

40 views

Category:

Technology


2 download

TRANSCRIPT

Page 1: Building Chatbots

January 2017 – NYC Ports & Logistics HackathonFind the content here: http://bit.do/spark-bot

Follow us on Twitter and/or tweet at me. @tessamero and @auhyland

By Tessa Mero and Austin Hyland

Building Chat Bots Made Easy

Page 2: Building Chatbots

2© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

SUMMARY• Who Are We?• What Are Chat Bots?• What are the Benefits?• Integrations vs Bots• Getting Started with a Collaboration API• Create a Chat Bot• Using Cloud9 (c9.io)• Create Webhook Events• Test Your Bot!

Page 3: Building Chatbots

3© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

What You Will Need• Cisco Spark API Account: https://developer.ciscospark.com/• Create Cloud9 Account: http://c9.io• [optional] JSON Viewer: https://

chrome.google.com/webstore/detail/json-viewer/gbmdgpbipfallnflgajpaliibnhdgobh

Page 4: Building Chatbots

4© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Objective

Page 5: Building Chatbots

5© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Who is Tessa?

* Developer Evangelist* Teacher* Open Source Contributor* Community Leader* Mother

Page 6: Building Chatbots

6© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Who is Austin?

* Developer Evangelist* Technologist* Problem Solver* Teacher* Connector

Page 7: Building Chatbots

7© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

What are Chat Bots?

Page 8: Building Chatbots

8© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Clippy!

Page 9: Building Chatbots

9© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 10: Building Chatbots

10© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 11: Building Chatbots

11© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 12: Building Chatbots

12© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 13: Building Chatbots

13© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

What are the Benefits?

Page 14: Building Chatbots

14© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 15: Building Chatbots

15© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 16: Building Chatbots

16© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 17: Building Chatbots

17© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Integrations vs Bots

Page 18: Building Chatbots

18© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

An integration acts as YOU and can see and do

the things you can do.

Page 19: Building Chatbots

19© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 20: Building Chatbots

20© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 21: Building Chatbots

21© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

A bot appears as another member of the room, but can only see messages

that mention it.

Page 22: Building Chatbots

22© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Getting Started with a Collaboration API

Page 23: Building Chatbots

23© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 24: Building Chatbots

24© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

In this case, we will use Cisco Spark API:https://developer.ciscospark.com/

Then Log In!

Create an Account on the API website

Page 25: Building Chatbots

25© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

TODO

TODO

Page 26: Building Chatbots

26© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Creating a Chat Bot

Page 27: Building Chatbots

27© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Click on “My Apps” and Add New (+)

Page 28: Building Chatbots

28© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Select ”Create a Bot”

Page 29: Building Chatbots

29© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Add a Bot Image

http://bit.ly/SparkBot-512x512

Page 30: Building Chatbots

30© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 31: Building Chatbots

31© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Copy API Access Token

Page 32: Building Chatbots

32© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Copy API Access Token

Page 33: Building Chatbots

33© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Deploy a bot on Cloud9

Page 34: Building Chatbots

34© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

c9.io/signup

Page 35: Building Chatbots

35© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 36: Building Chatbots

36© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

A closer look at the Github URL:

https://github.com/CiscoDevNet/node-sparkbot-samples.

Page 37: Building Chatbots

37© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 38: Building Chatbots

38© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Install Node.js in Cloud9• In Cloud9, look at the shell terminal at the bottom.

• Type: “npm install” – The nodejs libraries used by our code sample get downloaded to your Cloud9 Workspace

• Now go to helloworld.js under “examples”

• Click “Run” at the top

Page 39: Building Chatbots

39© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Create Variables• Click the ENV button at the bottom right of the Cloud9

Terminal

• Create two variables:• DEBUG || sparkbot• SPARK_TOKEN || yourtokenkey

Page 40: Building Chatbots

40© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 41: Building Chatbots

41© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Make Your Application Public to Share

Page 42: Building Chatbots

42© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Create Webhook events

Page 43: Building Chatbots

43© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Page 44: Building Chatbots

44© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Create Cisco Spark Webhooks

Page 45: Building Chatbots

45© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

200 Success!• Click “Run”

• See a “200/success” displayed – webhook assigned to unique identifier

• Fired off every time a new message is added to a room your bot is a member of

Page 46: Building Chatbots

46© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Create Another Webhook• Receive an event every time our bot is added to a room• Modify “resource” field: replace “messages” with

“memberships”

• Click “Run” again

• See a ”200 / success” message!

Page 47: Building Chatbots

47© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Test your Cisco Spark Bot

Page 48: Building Chatbots

48© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Test Bots Response – type /hello

Page 49: Building Chatbots

49© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Mention your bot in Group rooms

Page 50: Building Chatbots

50© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Type /hello to test Group chat with bot

Page 51: Building Chatbots

51© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Go Further?• Add a few breakpoints in helloworld.js, restart in debug mode• Add some commands. Find samples here:

https://github.com/CiscoDevNet/node-sparkbot-samples• Note: Lots of nodejs bot frameworks exist for Cisco Spark,

from basic to advanced in various languages.

Page 52: Building Chatbots

52© 2016 Cisco and/or its affiliates. All rights reserved. Cisco Confidential

Thank You

@tessamero@auhyland

http://bit.do/spark-bot