Real time voice call integration - Confoo 2012

Editor's Notes

• #2: Good morning, I’m here to talk about how you can integrate real time voice calls and mobile services into your web application.
• #3: Today I’m going to talk about:Telephony integration the providers availableWhat they offer and how they tend to workSome sample applications:-verify a users phone numberTracking phone leadsAnd providing feedback on eventsI’m also going to talk about how we use it at Smith Electric
• #4: I’m too much of a wimp to bring any live coding into the presentation however...
• #5: There are some live and semi-live videos. There were originally three live demos, however my phone doesn’t work here – so two of them are pre-prepared, and one is for you to join in with later.
• #6: For those of you who don’t know me; I’m Michael Peacock – I’m the web systems developer for Smith Electric Vehicles on their telemetry project. I’m an experienced lead developer, I spent 5 years running a small web design and development firm, writing bespoke CMS, E-Commerce and CRM solutions. I’ve written a few PHP related books, and volunteer with the PHP North-East user group in the UK.You can find me on twitter, or contact me if you have any questions later.
• #7: Smith are the worlds largest manufacturer of all electric, commercial vehicles. Founded over 90 years ago to build electric delivery vehicles – both battery based and cable based. In 2009 the company opened its doors in the US, and at the start of last year the US operation bought out the European company which brings us to where we are today.
• #8: Normally when I tell people I work with Electric Vehicles, they think of hybrids like the Prius, or they think about passenger electric vehicles such as the Nissan Leaf. When I tell them its COMMERCIAL electric vehicles, they think about milkfloats or airport passenger buggies.What we actually make are large scale, fully electric delivery and transport vehicles.
• #9: These vehicles range from depo based delivery vehicles to home delivery vehicles to utility applications, military applications right through to the american school bus.
• #10: Telephony integration gives us access to a range of features directly in our web applications. When it comes to calls we can:Make callsReceive callsRecord what a user is saying and even transcribe those callsAnd log the key pressesWith SMS and mobile integration we can send and receive text messages (a fairly common service / API now)
• #11: We can also provision numbers, and work with text to speech, speech to text and different languages, accents and voices.
• #12: I was first given exposure to integrating calls and texts into websites and web applications six years ago. The first was a gambling website which needed to verify their customers landline phone numbers. They used a complicated and expensive service to get the job done – and all it did was verify the number.Sending and receiving text messages was some what easier, back then it was still a clunky process – now there are many services which offer this. I’m going to be focusing more on call integration.
• #13: There are two main players in the field:Twilio and tropo; both are good and both are big players – we will review them before diving into building phone powered applications.
• #14: With both providers its free to get started – either with free credit or with free development environments. They both support the core features such as sending and receiving calls, text messages, IVR menus, recording key presses number provisioning. However they have some pretty key differences; Twilio has browser and mobile integration, as well as the ability to connect to other twilio accounts – allowing you to sell your app, while letting your customer pay for usage; whereas Tropo provide integration with SIP, Instant messengers and can actually process requests based on what the caller says, not just what they press.
• #15: Why would you want to do this?Most people I talk to say one of two things:Phone integration – wow thats really cool there are loads of things I can do with that- Why would I want to do that?Lets look through some potential use cases.
• #16: Customer service:Order dispatched- thanks for the order- rate your purchaseWould you like a call back?
• #17: Tacking leadsLeads which are still based on callsCalling to arrange to look at a used car, you would want to call the owner but the site advertising the car would want to keep track on how useful it was being, while also protecting the seller by not giving out their real phone numberMany big companies use number provisioning for tracking leads. Now we can too.We could even integrate it into a CMS for A/B testing
• #18: Verify phone numberTwo factor authConfirming critical actions/transaction
• #25: Say something with the Say tagWe can repeat what we sayEven change the gender of the voiceThe accent of the voiceAnd even the language
• #26: We can play audio files with the Play tag, supplying the Url to a file,And we can loop the file to with the loop attribute
• #27: Twilio gives us a whole bunch of creative commons hold music if we want it!
• #28: We can use the Gather tag to ask the caller a question, then use the appropriate attributes to set:Where to submit the response toHow to send the responseHow long we should wait for a responseHow many digits we are expecting, is this a 4 digit pin or a phone number?And/or should we wait for a specific key press to class the input as over
• #29: We can also record what the caller says,Action method timeout and finish atributes as before a maximum length of the recording we can opt to have the recoding transcribed and the transcription sent to a callbackUrlWe can even control if the call should play a beep sound before the caller leaves their message.
• #30: The transcription service brings some caveats:Its a paid for service the maximum duration is 2 minutesThe call back contains the text of the call, if the transcripotion succeeded or failed and the resource properties of the transcription so we can access it using the API later
• #31: We can send a text message with the SMS tag, specifying:Who to send it to who to send it from (must be verified or owner)A call back for success/failure
• #32: Within an active call we can dial additional numbersThis can be calling another number, a user using the twilio client, or creating a conference bridge.
• #33: We also have some tags to hangup, redirect the call, reject the call and pause
• #34: Being XML based makes it really easy to write apps, but XML is really tedious to write,We dont want it lying around solution: client library; it generates it for us
• #35: How and why does the rest side of the service work: we use it for phone numbers to:SearchBuyUpdate and delete numbersWe use it to make a callAnd we use it to send a text (independantly, as opposed to within the flow of a call)
• #36: How can we be sure its twilio communicating with us, someone could just be calling our application and pretending to be someone with a specific number?Twilio signs requests- it contains a hash of the various paramaters- read the manual, I didn;t at first and spent ages adding hacks and tokens into my apps when they wre not needed
• #37: How do you debug phone apps?Powerful debugging toolLogs each time an error occursGives full output of what twilio sent and what it received.
• #38: Sandbox..
• #41: Field serviceFly around the world to install a GPRS unit- dont have internet access themselves to check the data comes throughSo they phone up and askDriver alertsRoute deviationRange issues as a result
• #42: I’m not going to answer this one; hopefuly by now, you already have a few ideas..
• #43: Let’s build some stuff:Phone number verificationLead trackingConference talk feedback
• #44: Requirement: You need to verify the validity of a users phone number.Ask the user for their number and tell them an access codeCall the numberAsk for the access codeCheck the access codeVerify the number
• #46: Create an unverified user object, this has a verified status property of falseUse data posted in a form to populateGenerate a random codeSave the userGet the ID
• #47: Initialise the twilio client, with our secret API detailsCreate a callSet out outoing number,The incoming number,And the URL which will generate the XML for the call
• #48: We need to ask for a response:Create the twilm objectRequest 4 digits and post them back to our appAsk the caller to provide the code and output the XML
• #49: When processing the callback, get the digits they pressedVerify they are correctVerify or reject the verification
• #50: Got the code wrong? Just ask again
• #51: All OK? Lets tell them
• #52: Use a JS heartbeat to look at the databasr to see if the users number is verified, when it is bounce them to a page welcoming them as opposed to the page showing the verification code.
• #53: Lets walk through itUser signs upCode generatedThey receive the callEnter detailsAccount verified
• #54: Advertiser signs upA number is automatically assigned to themCalls to that number route to our main tracking applicationCall is loggedCaller is transferred
• #55: Find a local canadian number, grab the first one and buy it
• #56: Update it to point to our App
• #57: We have a new number
• #58: Twilio posts the number used, so we can have multiple numbers pointing to one app
• #59: We can even get caller ID data if we want
• #60: We have the numberLook it up in the databaseFind the actual advertisers / lead owners numberLog the lead conversion (call)Connect the call