$30 off During Our Annual Pro Sale. View Details »

Enriching Chatbot Journey with Live Chat Experiences

Enriching Chatbot Journey with Live Chat Experiences

LINE Developers Thailand

September 13, 2020
Tweet

More Decks by LINE Developers Thailand

Other Decks in Technology

Transcript

  1. 12:40 - 13:15
    Chanintorn Asavavichairoj
    Enriching Chatbot
    Journey with Live
    Chat Experiences
    Vice President Software Engineer, SCB

    View Slide

  2. View Slide

  3. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Enriching Chatbot Journey
    with Live Chat Experiences
    LINE THAILAND
    DEVELOPER CONFERENCE 2020

    View Slide

  4. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Hi there !!!
    Jo, Software Engineer from
    SCB Digital Banking

    View Slide

  5. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF

    View Slide

  6. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Conversational Banking
    Online Banking
    Mobile Banking
    Telephone Banking

    View Slide

  7. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    2017
    SCB Connect
    Banking and technology marriages
    Conversational Banking
    Banking
    Channels
    Technology
    1965
    Terminals
    with text interface
    1967
    ATM
    1980
    Cell Phones
    1990
    Web Technology
    2007
    Smartphone
    2016
    Conversation Interface (CUI)
    2017
    Conversational Banking
    1983
    First SCB ATM
    1984
    First SCB Telephone Banking
    1984
    Telephone Banking
    2001
    First SCB EASY NET
    1999
    Online Banking
    2013
    SCB EASY APP
    2012
    Mobile Banking

    View Slide

  8. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Messaging Behavioural
    Conversational Banking
    Reference : https://www.accenture.com/us-en/insight-conversational-banking
    64% Choose messaging
    rather than email / calls
    64 %
    60% Shopping using
    messaging application
    60 %
    80% More engaging
    with conversation
    80 %
    In 1 billion messages are
    exchanged in messaging
    each month
    1B

    View Slide

  9. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    State of Conversational Banking
    Conversational Banking
    Self service
    + Virtual Assistant

    View Slide

  10. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Conversation with Artificial Intelligent
    Building Assistant Platform
    ยอดเงินคงเหลือ xx บาท

    บอทจ๋าา .. เหลือเงินในบัญชีเท่าไร
    Instantly Reply
    24hr x 7days
    Cost Saving
    Reduce operation cost
    Reduce Routines Tasks
    Automated simplicity operation tasks

    View Slide

  11. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Conversation with Artificial Intelligent
    Building Assistant Platform
    บอทจ๋าา .. เหลือเงินในบัญชีเท่าไร
    หูกระจงควรปลูกให้ห่างจากตัวบ้าน

    View Slide

  12. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Customer Satisfaction Rate
    Conversational Banking
    Reference : https://www.accenture.com/us-en/insight-conversational-banking
    60 %
    68 %
    Conversation with A.I.
    Conversation with Live Agent
    - Knowledge Attrition
    - Waiting time
    - Sensitive Case
    - Isolated Case
    - Low level of expertise
    - Expensive

    View Slide

  13. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Customer Satisfaction Rate with Digital Assistant
    Conversational Banking
    Reference : https://www.accenture.com/us-en/insight-conversational-banking
    88 %
    60 %
    68 %
    Conversation with A.I.
    Conversation with Live Agent Digital Assistant!
    Balancing between
    A.I. and live agent
    - Knowledge Attrition
    - Waiting time
    - Sensitive Case
    - Isolated Case
    - Low level of expertise
    - Expensive

    View Slide

  14. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Analytics on
    Building Assistant Platform
    Dialogflow
    Enterprise Edition
    Reporting
    Data Studio
    Data Warehouse
    BigQuery
    Logging
    Stackdriver
    Messaging Publisher
    Cloud PubSub
    Subscription
    Cloud Functions
    Sensitivity Filter
    Cloud Data Loss Prevention
    Sentiment Detector
    Cloud NPL
    SCB Connect inside
    Banking Infrastructure
    Related Sessions ..
    LINE THAILAND DEVELOPER CONFERENCE 2019
    LINE Developer Thailand

    View Slide

  15. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Confusion Matrix
    Chatbot Performance
    True Positive True Negative
    False Positive False Negative

    View Slide

  16. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Confusion Matrix
    Chatbot Performance
    SCB mobile application name?
    True Positive
    Hit!

    SCB EASY
    True Negative
    Correct Rejection
    (if chatbot really doesn’t know)

    Sorry, I don’t know
    False Positive
    False Alarm
    (completely wrong!)

    SCB Connect
    False Negative
    Missed!
    (chatbot know but could not answer)

    Sorry, I don’t know

    View Slide

  17. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Fallback! Missed
    Classification
    Fallback!
    Confusion Matrix
    Chatbot Performance
    True Positive True Negative False Positive False Negative
    Hit! Correct Rejection
    (if chatbot really doesn’t know)
    False Alarm
    (completely wrong!)
    Missed!
    (chatbot know but could not answer)


    SCB EASY Sorry, I don’t know SCB Connect Sorry, I don’t know

    View Slide

  18. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Missed Classification
    Chatbot Performance
    False Positive
    Missed Classification
    Manual Labeling
    Satisfaction Survey
    Tone and sentiment
    0% 100%
    X %
    Ambitious Confident Level
    Fallback


    Y %




    View Slide

  19. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Enriching chatbot with ..
    Live Agent

    View Slide

  20. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Enriching Chatbot with Live Agent
    Building Assistant Platform
    Knowledge
    Management



    Escalation
    Analyst







    Customer
    Start Conversation

    View Slide

  21. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Training Workflow
    Building Assistant Platform
    Knowledge
    Management



    Escalation
    Analyst
    Training
    and Lab







    Customer
    Start Conversation

    View Slide

  22. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Conversation with Live Agent (Call Center)
    Building Assistant Platform
    Sorry, I don’t know
    Sorry, I don’t know
    Sorry, I don’t know



    #@%&{]!~]){>=+*?
    #@%&{]!~]){>=+*?
    #@%&{]!~]){>=+*?
    Fallback
    Fallback
    Fallback
    2
    3
    1
    Start Live Chat ? Entry Intent to Live Chat

    View Slide

  23. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF

    View Slide

  24. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Response Settings
    LINE Official Account Manager
    LINE Official Account Manager
    < > @ https://manager.line.biz/
    Manually
    mode switching

    View Slide

  25. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    So … How we build this ?

    View Slide

  26. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Fulfilment APIs
    Knowledge Based
    NLU
    Intent and entities extractor
    Dialog Management
    Predicts from context
    Message Generator
    Predefine message template
    Integration
    Fulfilment Connector
    On The Shelf Solution
    High Level Architecture
    Webhook
    Messaging API
    Dialogflow

    View Slide

  27. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Customize Chatbot Solution
    High Level Architecture
    NLU
    Dialog Management
    Message Generator
    Integration
    Webhook
    Messaging API
    Fulfilment Connector
    Dialogflow
    Chatbot
    Controller
    Conversation Message Adapter
    Fulfilment APIs
    Knowledge Based
    Dialogflow
    API V2
    Restful

    View Slide

  28. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Building Conversational Platform
    High Level Architecture
    Switcher
    Messaging
    Chatbot
    Controller / Fulfilment
    (Default)
    Live Agent
    System
    Conversation Message Adapter
    Knowledge Based
    Corebank System
    Dialogflow
    Other Service
    Escalate to
    Live Chat
    Customer Relation System

    View Slide

  29. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Building Conversational Platform
    High Level Architecture
    Chatbot
    Controller / Fulfilment
    Live Agent
    System
    Conversation Message Adapter
    Switcher
    Messaging
    Handover
    to Chatbot
    Knowledge Based
    Corebank System
    Other Service
    Customer Relation System
    Dialogflow

    View Slide

  30. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Inside Switcher!
    High Level Architecture
    Switcher
    Message Event
    Follow Event
    Unfollow Event
    Join Event
    Leave Event
    Member Join Event
    Member Leave Event
    Postback Event
    Beacon Event
    Account Link Event
    Webhook
    Streaming Processing with KSQL
    User Profile
    Chatlogs
    Beacon
    Micro Location
    Analytics
    Account Links
    Unsend Event Video viewing
    complete event
    Device Link Event
    Device Unlink Event
    LINE Things
    scenario execution
    event

    View Slide

  31. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Inside Switcher!
    High Level Architecture
    Switcher
    Webhook
    Streaming Processing with KSQL
    User Profile
    Chatlogs
    Beacon
    Micro Location
    Analytics
    Account Links
    Message Event
    Follow Event
    Unfollow Event
    Join Event
    Leave Event
    Member Join Event
    Member Leave Event
    Postback Event
    Beacon Event
    Account Link Event
    Unsend Event Video viewing
    complete event
    Device Link Event
    Device Unlink Event
    LINE Things
    scenario execution
    event

    View Slide

  32. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Inside Switcher!
    High Level Architecture
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    {
    "replyToken": "nHuyWiB7yP5Zw52FIkcQobQuGDXCTA",
    "type": "message",
    "mode": "active",
    "timestamp": 1462629479859,
    "source": {
    "type": "user",
    "userId": "U4af4980629..."
    },
    "message": {
    "id": "325708",
    "type": "text",
    "text": "Hello world!"
    ]
    }
    Switcher

    Push when handover
    Pop when handover
    or timeout
    Message Event
    Postback Event
    Handover

    View Slide

  33. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Customer Connect
    LINE Account Connect
    Auto Reply
    Manual Reply
    (Live Chat)
    LINE to Call
    Call to LINE
    Non-Voice Agent
    Chatbot
    IVR / Call


    Voice Agent




    Training
    Escalate to Live Chat
    Escalate to Call
    Provide Official Account
    though LINE account
    which belong to phone number
    Switcher

    View Slide

  34. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Enriching User Experiences with
    LINE Messaging API


    Icon / Nickname Switch Personalize Rich Menu
    Message
    Title
    Custom with Flex Message

    View Slide

  35. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Icon / Nickname Switch API
    LINE Messaging API
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    {
    "type": "text",
    "text": "Hello from Agent!",
    "sender": {
    "name": "SCB Agent",
    "iconUrl": "https://connect.scb/scbagent.png"
    }
    }
    Icon / Nickname Switch
    The LINE Official Account with which Icon/Nickname
    Switch can be used, when sending a message, you can
    specify the icon displayed in LINE and a part of the
    account name.
    The part surrounded by a green frame indicates an
    example of the icon and account name changed using
    Icon/Nickname Switch. The account name displayed at
    the top of the screen will not change.

    View Slide

  36. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    Icon / Nickname Switch API
    LINE Messaging API
    SCB Agent
    Hello from Agent!
    Hello from Bot!

    10:42
    10:42
    {
    "type": "text",
    "text": "Hello from Agent!",
    "sender": {
    "name": "SCB Agent",
    "iconUrl": "https://connect.scb/scbagent.png"
    }
    }

    View Slide

  37. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    Message Classify using Flex Message
    LINE Messaging API
    Hello from Agent!
    SCB AGENT
    SCB Agent
    Hello from Bot!

    10:42
    10:42
    {
    "type": "flex",
    "altText": "Hello from Agent!",
    "contents": {
    "type": "bubble",
    "body": {
    "type": "box",
    "layout": "vertical",
    "paddingTop": "10px",
    "paddingStart": "10px",
    "paddingEnd": "10px",
    "contents": [
    ...

    View Slide

  38. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Personalize Rich Menu
    LINE Messaging API
    Default Rich Menu Personalize User Rich Menu
    with Postback button

    View Slide

  39. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    Personalize Rich Menu
    LINE Messaging API
    {
    "size": {
    "width": 2500,
    "height": 843
    },
    "selected": true,
    "name": "Rich Menu",
    "chatBarText": "Live Chat",
    "areas": [
    {
    "bounds": {
    "x": 194,
    "y": 214,
    ...
    Personalize User Rich Menu
    with Postback button

    View Slide

  40. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    Personalize Rich Menu
    LINE Messaging API
    {
    "size": {
    "width": 2500,
    "height": 843
    },
    "selected": true,
    "name": "Rich Menu",
    "chatBarText": "Live Chat",
    "areas": [
    {
    "bounds": {
    "x": 194,
    "y": 214,
    ...
    Create Rich Menu
    1
    Upload and attach image
    2
    Link rich menu to user
    3
    Unlink rich menu from user
    4

    View Slide

  41. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Personalize Rich Menu
    LINE Messaging API
    POST https://api.line.me/v2/bot/richmenu
    Create Rich Menu
    Upload and attach image
    Link rich menu to user
    Unlink rich menu from user
    1
    2
    3
    4
    POST
    https://api-data.line.me/v2/bot/
    richmenu/{richMenuId}/content
    POST
    https://api.line.me/v2/bot/user/
    {userId}/richmenu/{richMenuId}
    DELETE
    https://api.line.me/v2/bot/user/
    {userId}/richmenu

    View Slide

  42. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    @scbconnect

    View Slide

  43. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF

    View Slide

  44. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Existed SCB Connect Use Case
    SCB Connect

    View Slide

  45. © 2020 THE SIAM COMMERCIAL BANK PUBLIC COMPANY LTD | LINEDEVCONF
    Be our digital banking family!

    View Slide

  46. View Slide