Giter VIP home page Giter VIP logo

slack-twilio-call-demo's Introduction

Twilio x Slack Demo

“Here's my number, so call me maybe”

Receiving calls and send the transcriptions to Slack


Scenario

A customer-would-be is interested in your product/services/whatever, and call the number listed on web/billboard/something. The phone is prompted to the company's voicemail.

After a message was left, agents get Slack notifications. An agent can follow up with the prospect by initiating a call from Slack.

Scenario for the Live Demo shown at Twilio Signal Conf

Scenario - flow

Tomomi learned about the cat adoption Secenario - scene 1

Tomomi is calling the adoption center Secenario - scene 2

Jason (a rep at the adoption center) saw the transcription on Slack, and initiates a call on Slack Secenario - scene 3

Twilio connects both parties Secenario - scene 4

Jason talks to Tomomi Secenario - scene 5

Tomomi confirms to pick up the kitty! Secenario - scene 6

App Flow

  1. Receiving a call to an incoming call endpoint, which prompt to the TwiML voice message
  2. The call is recorded, and as soon as the recorded voice is transcribed, the callback is called
  3. Use the data with the transcription, a message is created with Block Kit, and sent to a Slack channel via Slack Web API
  4. The message contains an actionable button. By clicking it, it initiates a call via Twilio TwiML
  5. Twilio initiates a call between the prospect and the agent -When the prospect answers the call, it put her on hold, while connecting to the agent's phone

App flow

Slack Setup

⚙️ Creating a New Slack App

First, go to Slack App Creation page to create an app.

🔑 Getting Your Credentials

Your Signing Secret key is at: Settings > Basic information

If you distribute your app to public, you'll need the Client ID and Client Secret too.

OAuth token should be available after instllation under: Features > OAuth & Permissions

The credential info is stored in the .env file. 🗝

SLACK_CLIENT_ID=
SLACK_CLIENT_SECRET=

Scopes

  • bots

Twilio Setup

Set your credentials

TWILIO_PHONE_NUMBER=
TWILIO_SID=
TWILIO_AUTH_TOKEN=

Also, for the convenience (or I am just lazy) I am using a sales rep's number (a physical phone number, non-Twilio number) hard-coded in .env file too.

Set up a webhook for "A CALL COMES IN" at https://www.twilio.com/console/phone-numbers

The hook should point to this Glitch URL with /receive-call route. The webhook URL looks like https://example.com/receive-call


Slide deck at Twilio Signal Conf

https://www.slideshare.net/tomomi/slack-twilio-uniquely-powering-communication

slack-twilio-call-demo's People

Contributors

girliemac avatar

Stargazers

Roach avatar Joe Kraxner avatar Ashley Kang avatar

Watchers

Roach avatar James Cloos avatar  avatar

Forkers

roach

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.