Build your first chat bot with WhatsApp, Twilio and Dialogflow

Today's customers expect an always on experience – to transact and have their questions answered whenever and wherever they are – without downloading an app or searching a slow website.

A way to achieve this is through a WhatsApp chat bot that is always ready to help, but building a bot that doesn't frustrate clients is surprisingly tricky.

In this talk I'll walk you through building your first chat bot using integrated tools like WhatsApp, Google Assistant, Twilio and Dialogflow for natural language processing, all without needing a PhD in machine learning.

Transcript

1. View Slide

2. Build your first chat bot
   with WhatsApp, Twilio and Dialogflow
   Dale Humby
   CTO, Nomanini
   Google Cloud Platform Developer Expert
   

   View Slide

3. View Slide

4. 90’s
   

   View Slide

5. 90’s 00’s
   

   View Slide

6. 90’s 00’s 10’s
   

   View Slide

7. View Slide

8. View Slide

9. Average user spends
   2 hours 22 min per day
   on their phone
   

   View Slide

10. View Slide

11. Meet your customers
    where they already are
    

    View Slide

12. View Slide

13. 90’s 00’s 10’s Next
    

    View Slide

14. Don’t have to learn a new UI
    

    View Slide

15. Departures
    Fast answers to simple questions
    

    View Slide

16. Opportunity for a personal connection
    

    View Slide

17. WhatsApp
    

    View Slide

18. Dialogflow
    WhatsApp
    

    View Slide

19. Dialogflow
    WhatsApp
    

    View Slide

20. API
    Backend
    services
    0xc0ffee lab
    

    View Slide

21. View Slide

22. API
    Backend
    services
    0xc0ffee
    lab
    

    View Slide

23. Dialogflow
    API
    Backend
    services
    0xc0ffee
    lab
    

    View Slide

24. Dialogflow
    Agent
    

    View Slide

25. Dialogflow
    Agent
    Unstructured
    language
    “Please can I have a
    coffee?”
    “Deliver a flat white to
    3 Main Rd at 10am”
    “Espresso. Black,
    please.”
    

    View Slide

26. Dialogflow
    Agent
    Unstructured
    language
    Structured
    data
    “Please can I have a
    coffee?”
    “Deliver a flat white to
    3 Main Rd at 10am”
    “Espresso. Black,
    please.”
    $time
    $location
    $coffeeType
    

    View Slide

27. Dialogflow
    Agent
    Unstructured
    language
    Structured
    data
    “Please can I have a
    coffee?”
    “Deliver a flat white to
    3 Main Rd at 10am”
    “Espresso. Black,
    please.”
    $time
    $location
    Expression
    $coffeeType
    

    View Slide

28. Dialogflow
    Agent
    Unstructured
    language
    Structured
    data
    “Please can I have a
    coffee?”
    “Deliver a flat white to
    3 Main Rd at 10am”
    “Espresso. Black,
    please.”
    $time
    $location
    Expression Intent
    $coffeeType
    

    View Slide

29. Dialogflow
    Agent
    Unstructured
    language
    Structured
    data
    “Please can I have a
    coffee?”
    “Deliver a flat white to
    3 Main Rd at 10am”
    “Espresso. Black,
    please.”
    $time
    $location
    Expression Intent Parameters
    $coffeeType
    

    View Slide

30. Dialogflow
    Agent
    Let’s build
    

    View Slide

31. Dialogflow
    API
    Backend
    services
    0xc0ffee
    lab
    

    View Slide

32. API
    Backend
    services
    0xc0ffee
    lab
    Dialogflow
    

    View Slide

33. Dialogflow
    API
    Backend
    services
    0xc0ffee
    lab
    

    View Slide

34. View Slide

35. Dialogflow
    API
    Backend
    services
    0xc0ffee
    lab
    Firebase
    Functions
    

    View Slide

36. Dialogflow
    API
    Backend
    services
    0xc0ffee
    lab
    Firebase
    Functions
    Google Assistant
    

    View Slide

37. Top tips for building a good conversational UI “AI”
    “Can I teach this to a high school student
    in 1 hour and expect them to do it well?”
    

    View Slide

38. Top tips for building a good conversational UI “AI”
    “Can I teach this to a high school student
    in 1 hour and expect them to do it well?”
    Find all the cat photos
    Spam / not?
    Answer simple questions
    Order and deliver coffee
    

    View Slide

39. Top tips for building a good conversational UI “AI”
    “Can I teach this to a high school student
    in 1 hour and expect them to do it well?”
    Summarise current world affairs
    Give me a legal opinion on ...
    Predict the stock market
    Find all the cat photos
    Spam / not?
    Answer simple questions
    Order and deliver coffee
    

    View Slide

40. Top tips for building good conversational UI’s
    ● Simple, structured requests – fast, accurate answers
    ● Give it a personality
    ● Check logs
    ○ Analytics
    ○ Unmatched intents
    ○ Improve training data
    

    View Slide

41. So you want WhatsApp for business… our story
    

    View Slide

42. So you want WhatsApp for business… our story
    ● Brace yourself… took me 6 months
    ● Need to use an aggregator (e.g. Twilio)
    ● Need Facebook for Business
    ● Twilio WhatsApp is very beta. I probably sent 8 support tickets.
    Dashboard broke after each stage
    ● SA telephone number (+27) did not work. US number did
    ● WhatsApp profile pic 640x640 jpg (no transparent background)
    ● WhatsApp has to approve your push messages
    ● Unlikely to get the green tick (unless you’re a global brand)
    

    View Slide

43. Send a WhatsApp message to
    +1 415 523 8886
    with code
    join eventually-seems
    

    View Slide

44. Resources
    Dialogflow dialogflow.cloud.google.com (free)
    Twilio twilio.com/try-twilio ($15 credit at signup)
    Codelabs
    Build your first chatbot with Dialogflow
    codelabs.developers.google.com/codelabs/chatbots-dialogflow-appointment-scheduler/
    Build Actions on Google Assistant
    codelabs.developers.google.com/codelabs/actions-1
    Dale Humby
    dale@nomanini.com
    dalehumby.com
    We’re hiring
    nomanini.com/careers
    

    View Slide

45. Thanks
    dale@nomanini.com
    

    View Slide

46. OMG
    the demo failed
    

    View Slide

47. View Slide

48. View Slide

49. View Slide

50. View Slide

51. View Slide

52. View Slide

53. View Slide

54. View Slide

55. View Slide

56. View Slide

57. View Slide

58. View Slide

59. View Slide

60. View Slide

61. View Slide

62. View Slide

63. View Slide

64. View Slide

65. View Slide

66. View Slide

67. View Slide

68. Send a WhatsApp message to
    +1 415 523 8886
    with code
    join eventually-seems.
    

    View Slide

69. Backup slides
    

    View Slide

70. Final tip: Use Chatbots as another tool in your toolbox
    Chatbot
    KB
    Suggest
    answers
    Sentiment
    analysis
    Speech ⟷
    text
    Transcripts Customer
    satisfaction
    Handoff to human operator
    

    View Slide