paint-brush
How to Create Your Own Google Call Screen Using Twilioby@wilsonwong13
191 reads

How to Create Your Own Google Call Screen Using Twilio

by Wilson WongAugust 31st, 2020
Read on Terminal Reader
Read this story w/o Javascript
tldt arrow

Too Long; Didn't Read

Apple has its own feature in iOS 13 that allows users to send unknown callers to voicemail. The problem is that sometimes the user is expecting a callback and does not want to send the caller straight to voicemails. To help solve this issue, I have created my own call screen solution using Twilio Studio and Node-Red. I think the reason why is because some companies have a list of numbers they will not send to their numbers is because a text message is sent by text code.

Companies Mentioned

Mention Thumbnail
Mention Thumbnail

Coin Mentioned

Mention Thumbnail
featured image - How to Create Your Own Google Call Screen Using Twilio
Wilson Wong HackerNoon profile picture

Google Call Screen for Android helps users to combat robocalls. Apple has its own feature in iOS 13 that allows users to send unknown callers to voicemail. While this feature is nice there is one glaring issue. The problem is that sometimes the user is expecting a callback and does not want to send the caller straight to voicemail, such as a call from a recruiter, delivery driver, Uber/Lyft driver and etc. To help solve this issue, I have created my own call screen solution using Twilio Studio and Node-Red.

Demo

What do you need?

  • Node-Red Instance
  • Twilio Account
  • Twilio Number that has the capability to send and receive SMS, and to make calls
  • Download this beep audio file — http://soundbible.com/mp3/Short%20Beep%20Tone-SoundBible.com-1937840853.mp3
  • Optional: Sign up Watson Natural Language Understanding if you want to capture the caller’s name and the company they represent from the call message. Need to add Watson Node in your Node-Red

Getting Started Twilio

Friendly Name = Transfer
//This will be use to transfer the call to you when you accept
<?xml version="1.0" encoding="UTF-8"?>
<Response>
  <Dial callerId="<<YOUR TWILIO NUMBER>>">
    <Number><<YOUR PERSONAL PHONE NUMBER>></Number>
  </Dial>
</Response>
Friendly Name = Failed Call
//Used for if a called has fail or you didn't pick up
<?xml version="1.0" encoding="UTF-8"?>
<Response>
  <Say>Sorry,<<YOUR NAME>> is currently busy right now. <<SHE/HE>>’ll try to get back to you as soon <<SHE/HE>> is available. Good bye.</Say>
  <Hangup/>
</Response>
  1. Create two TwiML Bins, look at the code block above. Keep track of the URLs of the bins once you save it. Make sure you format your phone numbers to E.164
  2. Upload the beep file that you download by going to Assets in your Twilio console and dragging and dropping the file. Take a note of the asset URL
  3. Go to Twilio Studio, create a new flow, give it a name and click on Import from JSON. Then copy and paste the JSON from this link
  4. In the flow, there is a widget call setVariables. Please set your name, your Node-Red URL, your beep asset URL, and your personal phone as values and save the flow. Note: Example of Node-Red URL value, http://testing.ngrok.io
  5. Go to your Twilio phone number and set both the incoming voice and messaging to call your new studio flow

Getting Started on Node-Red

  1. In your Node-Red dashboard click on the hamburger icon that is at the top right of the page and select Import, then copy and paste or import this JSON. If you want to use Watson Natural Language Understanding, import this Watson JSON. Make sure you have the Watson Nodes install before importing the JSON
  2. Click on the node label Set All Variables and set your Twilio Account Sid, Auth Token, and TwiML Bins URLs
  3. (Optional) If you signed up Watson Natural Language Understanding, go to the Watson Natural Language Understanding node and fill in your credentials. On your Twilio studio flow go to setVariables widget and set usingWatsonNLU variable to true
  4. On the top right of the page click Deploy and you should be ready now!

How to Demo?

Just add the Twilio number as a contact on your phone and use a second phone to call the Twilio number. On the call, you should be getting a greeting message and asked to state your purpose after the beep. Once you replied, you will be placed on hold. On your main phone, you should be getting a message from Twilio that has vCard and a text message that looks like the example below

Phone call from:+12345678912

Message: This is a dummy message
To accept the call, reply back with on of the following words: Accept, Yes, Sure, Connect

Otherwise ignore this message.

To accept the call, replied to the text message the word “accept” and Twilio will connect your main phone to your second phone. If you were able to connect, Success! You have done it! If you want to don’t want to accept the call, just leave it and the caller should be getting an ending message within a 1 min or so.

What if I want the person to connect with me ASAP?

After the beep, if the user press 1 on the keypad they’ll be connected to your main phone number. Downside? You won’t know their caller phone number.

Now what?

Instead of giving out your main phone number when signing up for services, while handing out your resume, creating a profile, and etc, you can give your Twilio number and keep your main phone number private.

Limitations?

The biggest limitation is that some services that you signed up will require you to verify your phone number by using a passcode sent by text. There are ways to forward the text messages to your main phone number from the Twilio number, but sometimes you won’t get any passcode. I think the reason why is because some companies have a list of numbers they will not send a text to because that number belongs to a company, such as Twilio, and not to an individual person.

Customization

  • Want to change how you accept a call? Go to setVariables widget and change acceptCode values. You can create your own acceptCode, just make sure each word is separate by a comma
  • Want different hold music? Go to sendCallertoQueue widget and replace the Hold Music TwiML URL field with your URL of choice. You can find a great library here

Troubleshooting

  • Watson NLU not work? Make sure you either fill in your username and password or your API key in the Watson NLU node. Check that you're using the correct Service Endpoint. Check on the Twilio Studio setVariables that usingWatsonNLU is set to true
  • Other beeps — http://soundbible.com/tags-beep.html

This article was previously published behind a paywall at: https://medium.com/@wilsonwong13/create-your-own-google-call-screen-using-twilio-and-ibm-node-red-ca01d3fa34f0?source=friends_link&sk=7aae432bfcf600ab083ae8c1d542c791