Twilio Polls

Announcements

Design Notebooks

Let’s take a few minutes to review some of your Design Notebook entries from last week.

Surveys

Why do we use surveys and questionnaires?

Survey Guide

Types of Survey Questions

  • Closed-ended Questions
  • Open-ended Questions

Types of Survey Questions on Explorable

Online Survey Tools

Here’s an example TCNJ Qualtrics Survey

Phone Polls

  1. Download the source code for this week’s examples from the class Github Organization.
  2. Unzip the  repository on your local machine and upload the contents to a new folder in the ‘www’ folder on your TCNJ web account.
  3. Let’s try out the examples one by one.

Basic Phone Interview Loop

flowchart_lg

Interview Loop with <Gather>

  1. After you’ve uploaded the poll_gather.xml and response.php files to your TCNJ web account, log into Twilio, click into your number detail page, and edit the Voice request url for your number to point to ‘poll_gather.xml’.
  2. Call your Twilio number.
  3. What happened?
<!-- poll_gather.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
 <!-- ask poll question, default finish key is # -->
 <Gather action="./response.php" method="get">
 <Say>Welcome to the 2015 Oscars phone poll.</Say>
 <Say>What film would you vote for for Best Picture?</Say>
 <Say>Press 1 for American Sniper.</Say>
 <Say>Press 2 for Birdman.</Say>
 <Say>Press 3 for Boyhood.</Say>
 <Say>Press 4 for The Grand Budapest Hotel.</Say>
 <Say>Press 5 for The Imitation Game.</Say>
 <Say>Press 6 for Selma.</Say>
 <Say>Press 7 for The Theory of Everything.</Say>
 <Say>Press 8 for Whiplash.</Say>
 <Say>Or press 9 to repeat these choices.</Say>
 </Gather>
</Response>
// response.php
<?php
header('Content-type: text/xml');
echo '<?xml version="1.0" encoding="UTF-8"?>';

// collect the selection number
$selection = (int) $_REQUEST['Digits'];

echo '<Response>';

switch($selection){
case 1:
echo "<Say>Thanks for your response. You chose American Sniper.</Say>";
break;

case 2:
echo "<Say>Thanks for your response. You chose Birdman.</Say>";
break;

case 3:
echo "<Say>Thanks for your response. You chose Boyhood.</Say>";
break;

case 4:
echo "<Say>Thanks for your response. You chose The Grand Budapest Hotel.</Say>";
break;

case 5:
echo "<Say>Thanks for your response. You chose The Imatation Game.</Say>";
break;

case 6:
echo "<Say>Thanks for your response. You chose Selma.</Say>";
break;

case 7:
echo "<Say>Thanks for your response. You chose The Theory of Everything.</Say>";
break;

case 8:
echo "<Say>Thanks for your response. You chose Whiplash.</Say>";
break;

case 9:
echo "<Say>O K. Redirecting back to the choices.</Say><Redirect>./poll_gather.xml</Redirect>";
break;

default:
echo "<Say>I didn't understand your selection.</Say><Redirect>./poll_gather.xml</Redirect>";
break;
}

// close out file pointer
fclose($fp);

echo '</Response>';
?>

Storing Responses to a File

  1. After you’ve uploaded the poll_gather_data.xml, record_data.php and data.txt files to your TCNJ web account, log into Twilio, click into your number detail page, and edit the Voice request url for your number to point to ‘poll_gather_data.xml’.
  2. Call your Twilio number.
  3. What happened?
  4. Now point your web browser to http://www.tcnj.edu/~your-user-name/your-folder/data.txt
  5. What do you see?

*A note on file permissions – these examples write the callers’ selections to a comma-separated file (csv). You’ll need to set the file permissions on your data file to ‘read & write’ with settings 666.

<!-- poll_gather_data.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
 <!-- ask poll question, default finish key is # -->
 <Gather action="./record_data.php" method="get">
 <Say>Welcome to the 2015 Oscars phone poll.</Say>
 <Say>What film would you vote for for Best Picture?</Say>
 <Say>Press 1 for American Sniper.</Say>
 <Say>Press 2 for Birdman.</Say>
 <Say>Press 3 for Boyhood.</Say>
 <Say>Press 4 for The Grand Budapest Hotel.</Say>
 <Say>Press 5 for The Imatation Game.</Say>
 <Say>Press 6 for Selma.</Say>
 <Say>Press 7 for The Theory of Everything.</Say>
 <Say>Press 8 for Whiplash.</Say>
 <Say>Or press 9 to repeat these choices.</Say>
 </Gather>
</Response>
// record_data.php
<?php
 header('Content-type: text/xml');
 echo '<?xml version="1.0" encoding="UTF-8"?>'; 
 
 // collect the selection number
 $selection = (int) $_REQUEST['Digits'];
 // collect the caller's phone number
 $from = $_REQUEST["From"];
 // get the exact time of the response
 $t = time();
 // set the timezone
 date_default_timezone_set('America/New_York');
 // open a file ponter to write our data
 $fp = fopen("data.txt", "a");
 
 echo '<Response>';
 
 switch($selection){
 case 1:
 // write the callers phone number, selection, a timestamp of the record
 fwrite($fp, $from . ',Best Picture,American Sniper,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose American Sniper.</Say>";
 break;
 
 case 2:
 // write the callers phone number, selection, a timestamp of the record & respond
 fwrite($fp, $from . ',Best Picture,Birdman,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose Birdman.</Say>";
 break;
 
 case 3:
 // write the callers phone number, selection, a timestamp of the record
 fwrite($fp, $from . ',Best Picture,Boyhood,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose Boyhood.</Say>";
 break;
 
 case 4:
 // write the callers phone number, selection, a timestamp of the record & respond
 fwrite($fp, $from . ',Best Picture,The Grand Budapest Hotel,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose The Grand Budapest Hotel.</Say>";
 break;
 
 case 5:
 // write the callers phone number, selection, a timestamp of the record
 fwrite($fp, $from . ',Best Picture,The Imitation Game,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose The Imatation Game.</Say>";
 break;
 
 case 6:
 // write the callers phone number, selection, a timestamp of the record 
 fwrite($fp, $from . ',Best Picture,Selma,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose Selma.</Say>";
 break;
 
 case 7:
 // write the callers phone number, selection, a timestamp of the record
 fwrite($fp, $from . ',Best Picture,The Theory of Everything,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose The Theory of Everything.</Say>";
 break;
 
 case 8:
 // write the callers phone number, selection, a timestamp of the record
 fwrite($fp, $from . ',Best Picture,Whiplash,' . date("c", $t) . "\n");
 echo "<Say>Thanks for your response. You chose Whiplash.</Say>";
 break;
 
 case 9:
 echo "<Say>O K. Redirecting back to the choices.</Say><Redirect>./poll_gather_data.xml</Redirect>";
 break; 
 
 default:
 echo "<Say>I didn't understand your selection.</Say><Redirect>./poll_gather_data.xml</Redirect>";
 break;
 }
 
 // close out file pointer
 fclose($fp);
 
 echo '</Response>';
?>

Interview Loop with <Record>

  1. After you’ve uploaded the poll_record_data.xml and recording.php files to your TCNJ web account, log into Twilio, click into your number detail page, and edit the Voice request url for your number to point to ‘poll_record_data.xml’.
  2. Call your Twilio number.
  3. What happened?
  4. Now point your web browser to http://www.tcnj.edu/~your-user-name/your-folder/data.txt
  5. What do you see?
<!-- poll_record_data.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
 <Say>Welcome to the 2015 Oscars Phone Poll</Say>
 <Say>What was your favorite movie last year? Record your answer at the beep. Press the pound key when you're done recording.</Say>
 <Record 
 action="http://www.tcnj.edu/~your-username/your-folder/recording.php"
 method="GET"
 maxLength="20"
 finishOnKey="#"
 />
</Response>
<?php
 header("content-type: text/xml");
 echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";
 
 // collect the cller's phone number
 $from = $_REQUEST["From"];
 // get the exact time of the response
 $t = time();
 // set the timezone
 date_default_timezone_set('America/New_York');
 // open a file ponter to write our data
 $fp = fopen("data.txt", "a");
 
 // get the url to the voice recording
 $recording = $_REQUEST['RecordingUrl'];
 // get the duration of the voice recording
 $duration = $_REQUEST['RecordingDuration'];
 // write the data file
 fwrite($fp, $from . ',Favorite Movie this year,' . $recording . ',' . $duration . ',' . date("c", $t) . "\n");
?>
<Response>
 <Say>Thanks for taking our poll. Your favorite movie this year was</Say>
 <Play><?php echo $recording; ?></Play>
</Response>

An SMS Example

  1. After you’ve uploaded the sms_poll_data.php file to your TCNJ web account, log into Twilio, click into your number detail page, and edit the Messaging request url for your number to point to ‘sms_poll_data.php’.
  2. Call your Twilio number.
  3. What happened?
  4. Now point your web browser to http://www.tcnj.edu/~your-user-name/your-folder/data.txt
  5. What do you see?
<?php
 // we can get the number of the sender using the 'Fromn' request value
 $from = $_REQUEST['From'];
 $msg = $_REQUEST['Body'];
 
 header("content-type: text/xml");
 echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";
 // get the exact time of the response
 $t = time();
 // set the timezone
 date_default_timezone_set('America/New_York');
 // open a file ponter to write our data
 $fp = fopen("data.txt", "a");
 switch($msg){
 case "poll":
 $out = "Thanks for taking our poll! Text us back with the name of your favorite movie from last year!";
 break;
 
 default:
 // write the data file
 fwrite($fp, $from . ',sms,Favorite Movie this year,' . $msg . ',' . date("c", $t) . "\n");
 $out = "Really? Your favorite film last year was " . $msg;
 break;
 }
 
 // close out file pointer
 fclose($fp);
?>
<Response>
 <Message><?php echo $out; ?></Message>
</Response>

Challenge

  1. Break up into your groups and compare notes on your list of questions for your Partner Organizations from last week’s assignment.
  2. Using the Phone Poll design pattern, create a Phone Poll app that asks 3 closed-ended questions and one open-ended question.
  3. Be sure to store the responses in a comma-separated (csv) file on your TCNJ web account.

Assignment

Partner Organization Interview and Follow-up Survey

  1. Meet with your team and combine all of your questions from last week’s assignment.
  2. Discuss your questions and determine if there are any other questions that need to be added.
  3. Refine your questions to fit into either the closed- or open-ended question type forms and organize them into 2 groups: initial interview questions, and secondary & followup questions
  4. Create a one-sheet list of your initial interview questions in preparation for a call with your Partner Organization (call time to be determined).
  5. Using the secondary & followup questions list, create a TCNJ Qualtrics survey as a starting point for a followup survey to your initial interview call.

Design Notebook

  1. Create a new page in your Design Notebook and label it “Interview & Survey” and today’s date.
  2. List the initial interview questions you and your group came up with in preparation for your initial interviews.
  3. Include a link to your TCNJ Qualtrics Survey.

*Assignments are due before class begins on Mondays. Be prepared to present your work in class for discussion.

Voice Recordings

Announcements

  • Today: Voice Recording equipment overview & demonstration at the IMM Cage with Dickie
  • Tim Wisniewski, Chief Data Officer, The City of Philadelphia – Brown Bag Lunch Feb 20, 12:30-1:30 & 3:00-4:00 @ IMM
  • Next Week, Feb 23 – Phone Polls
  • Partner Organization Interviews, setting up for the week of Feb 23 or March 2

Design Notebooks

Let’s take a few minutes to go over some of your Design Notebook entries from last week.

Cage Visit

Let’s head over to the cage to meet with Dickie.

Design Patterns

Christopher Alexander – The Timeless Way of Building

The Gang of Four – Design Patterns

Architectural Patterns

Interactive Voice Response (IVR) Patterns

Phone Menus

  • keypad input
  • voice input

Leave-a-Message

  • crowd-sourced incident reporting
  • oral histories
  • voicemail

Phone Polls

  • keypad input multiple choice
  • voice response

Click-to-Call

  • web/mobile interface to initiate a call out

SMS-to-Call

  • sms message to initiate a call out

Voice Broadcast

  • call out notification to a group of numbers

Message Broadcast

  • SMS out to a group of numbers

Twilio Voice Recordings

Twilio’s Text-to-Speech engine is cool, but…

  • language limitations (even Alice supports only 26 languages/dialects)
  • sometimes we want greater flexibility with specific voices, i.e. celebrities

Today we’ll be using Twilio’s <Play> and <Record> TwiML verbs.

  1. Download the source code for this week’s examples from the class Github Organization.
  2. Unzip the  repository on your local machine and upload the contents to a new folder in the ‘www’ folder on your TCNJ web account.
  3. Let’s try out the examples one by one.

Basic Voice Playback

Instead of using Twilio’s text-to-speech engine, let’s play back a recorded message.

  1. After you’ve uploaded the basic-voice.xml file to your TCNJ web account, log into Twilio, click into your number detail page, and edit the Voice request url for your number to point to ‘basic-voice-playback.xml’.
  2. Call your Twilio number.
  3. What happened?
<!-- basic-voice-playback.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
    <Play>http://www.mediamesis.net/imm/3hellos2.wav</Play>
</Response>

Twilio <Play> documentation

Gathering Input

Now let’s use the <Play> verb with <Gather>.

  1. Upload matrix.xml and checkpill.php to your TCNJ web account and edit the Voice request url in the Twilio Dashboard for your number to point to your edited file.
  2. Call your Twilio number.
  3. What happened?
 <!-- matrix.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
    <Gather action="./check_pill.php" method="get" finishOnKey="*">
        <Play>http://www.mediamesis.net/imm/redpill.mp3</Play>
        <Say>Press 1 to take the red pill.</Say>
        <Say>Press 2 to take the blue pill.</Say>
    </Gather>
</Response>
 /* checkpill.php */
<?php
$pill = $_REQUEST['Digits'];

header("content-type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";

if($pill == 1){ // red pill
    echo "<Response>";
    echo "<Play>http://www.mediamesis.net/imm/bluepill.mp3</Play>";
    echo "</Response>";
} else if($pill = 2) { // blue pill
    echo "<Response>";
    echo "<Play>http://www.mediamesis.net/imm/matrix66.mp3</Play>"
    echo "</Response>";
} else { // other
    echo "<Response>";
    echo "<Say>Sorry, I didn't understand your selection. Please try again.</Say>"; 
    echo "<Redirect method=\"POST\">http://yourserver/matrix.xml</Redirect>";
    echo "</Response>";
}

“Please Leave a Message…”

Now let’s try building a simple answering machine.

  1. Upload voicemail.xml and record.php to your TCNJ web account and edit the Voice request url in the Twilio Dashboard for your number to point to your edited file.
  2. Call your Twilio number.
  3. What happened?
<!-- voicemail.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
   <Say>Leave a message after the beep. Press the pound key when you're done recording.</Say>
  <Record 
      action="http://www.tcnj.edu/~thompsom/imm-470-03/voice-recordings/record.php"
      method="GET"
      maxLength="20"
      finishOnKey="#"
   />
</Response>
/* recording.php */
<?php
header("content-type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";

$recording = $_REQUEST['RecordingUrl']; 
$duration = $_REQUEST['RecordingDuration'];
?>
<Response>
 <Say>Thanks for calling. Your message was <?php echo $duration; ?> seconds long. Here's the message you left.</Say>
 <Play><?php echo $recording; ?></Play>
</Response>

Twilio <Record> Documentation

Workflow for Creating Voice Menu Recordings

Basic flow

  1. Start with a flow diagram
  2. Prototype it using <Say>
  3. Create a script for the voice talent
  4. Record the messages
  5. Implement using <Play>

What about foreign languages/dialects?

Challenge

Break into your groups and review the Twilio Audio Recording Best Practices.

Using Audacity or other audio recording software, create a voice menu + leave-a-message app that presents the caller with information about the upcoming HackTCNJ event and prompts them to record a message about what kind of app they’re thinking about creating at the event.

Create menu options for:

  • Date, time and location
  • An overview description of the event
  • A sponsor listing
  • Request the caller leave-a-message about what they’d like to create at the event

Assignment

Know Your Audience

  • Read pages 52-59 in the Freedom Fone User and  Advocacy Guide
  • Create a new page in your Design Notebook and name it “Know Your Audience” and today’s date. Make a list of all the audience characteristics you feel would be important to your Partner Organization. Research as much as you can about each of the items discussed in the reading, filling in the information based upon what you know or can find out about your Partner Organizations’ communities.

Questions for Your Partner Organization

  • Create a list of questions for your Partner Organization about their services and most pressing communication problems.
  • Create another slide in your Design Notebook, titling it “Interview Questions” and today’s date., and drop in your list of questions from above.
  • Next week, you’ll combine your questions with those from your teammates to create a master list.

*Assignments are due before class begins on Mondays. Be prepared to present your work in class for discussion.

More Info

Voice Menus

Announcements

A couple of items in the news from last week:

Design Notebooks

Let’s take a few minutes to discuss your Design Notebooks.

Voice Menus

SMS is great, but…

  • Only supports 160 characters
  • Assumes the device supports a language you understand well enough
  • Assumes you can read and write

What languages do the most common devices support?

Android

iPhone

What countries support local phone numbers for Twilio?

Twilio International – Global Reach, Local Experience

Twilio Voice

In addition to SMS, Twilio supports voice. You can use voice using Twilio’s text-to-speech engine, or use recorded messages. Today we’ll be using the text-to-speech engine.

  1. Download the source code for this week’s examples from the class Github Organization.
  2. Unzip the  repository on your local machine and upload the contents to a new folder in the ‘www’ folder on your TCNJ web account.
  3. Let’s try out the examples one by one.

Basic Voice

  1. After you’ve uploaded the basic-voice.xml file to your TCNJ web account, log into Twilio, click into your number detail page, and edit the Voice request url for your number to point to ‘basic-voice.xml’.
  2. Call your Twilio number.
  3. What happened?
<!-- basic-voice.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
    <Say>Hello Twilio!</Say>
</Response>

TwiML Say Documentation

Voice Attribute

Let’ experiment. Take a look at the documentation for the <Say> command paying particular attention to the ‘voice’ attribute.

  1. Try changing the voice for your app.
  2. Re-upload the your file to your TCNJ web account and edit the Voice request url for your number to point to your edited file.
  3. Call your Twilio number.
  4. What happened?
Langauge Attribute
  1. Once you’ve successfully changed the voice, try changing the language.
  2. Re-upload the your file to your TCNJ web account and edit the Voice request url for your number to point to your edited file.
  3. Call your Twilio number.
  4. What happened?

Twilio Voice Request Variables

Similar to our experience last week sending SMS messages, TwiML for Voice also supports a number of request variables we can access. Like last week, we can use this to create a simple phone book so we can recognize callers.

  1. Change (or add) the phone record in the phone book array in your source code.
  2. Re-upload the your file to your TCNJ web account and edit the Voice request url for your number to point to voice-request-vars.php.
  3. Call your Twilio number.
  4. What happened?
<!-- voice-request-vars.php -->
<?php
$from = $_REQUEST["From"];

// make an associative array of senders we know, indexed by phone number
$phonebook = array(
    "+12152642459"=>"Professor Thompson",
);

$name = "étranger";

// if the caller is in our phonebook, then greet them by name
// otherwise, refer to them as étranger
if(isset($phonebook[$_REQUEST['From']])) {
    $name = $phonebook[$_REQUEST['From']];
}
header("content-type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";
?>
<Response>
    <Say voice="alice" language="fr-FR">Allô <?php echo $name ?>.</Say>
<Response>

TwiML Voice Request Variables

Gathering Input

Now let’s see if we can gather information interactively from the user.

  1. Upload numbergame.xml and checknumber.php to your TCNJ web account and edit the Voice request url for your number to point to your edited file.
  2. Call your Twilio number.
  3. What happened?
 <!-- numbergame.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
    <Gather action="./check_number.php" method="get" finishOnKey="*">
        <Say>I'm thinking of a number between 1 and 10, enter the number then press star.</Say>
    </Gather>
</Response>
 /* checknumber.php */
<?php
$number = 5;
$guess = $_REQUEST['Digits'];

header("content-type: text/xml");
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";

if($guess == $number){
    echo "<Response>";
    echo "<Say>Correct. The number was ".$number.". You win!</Say>";
    echo "</Response>";
} else {
    echo "<Response>";
    echo "<Say>Incorrect. Guess again.</Say>";
    echo "<Redirect method="POST">http://yourserver/numbergame.xml</Redirect>";
    echo "</Response>";
}

TwiML Gather Documentation

Navigating a Tree

Now let’s navigate a simple voice menu.

  1. Upload class-menu.xml and class-menu-processor.php to your TCNJ web account and edit the Voice request url for your number to point to your edited file.
  2. Call your Twilio number.
  3. What happened?
  4. How could you improve the user’s experience?
 <!-- class-menu.xml -->
<?xml version="1.0" encoding="UTF-8"?>
<Response>
    <Gather action="./class-menu-processor.php" numDigits="1">
        <Say>Welcome to Interactive Design for the Developing World, Spring 2015.</Say>
        <Say>For the course description, press 1.</Say>
        <Say>For the course location and meeting time, press 2.</Say>
        <Say>To leave a message for the instructor, press 3.</Say>         
    </Gather>
    <!-- Timeout defaults to 5 seconds, if customer doesn't input anything, redirect to prompt and try again. -->
    <Say>Sorry, I didn't get your response.</Say>
    <Redirect>./class-menu.xml</Redirect>
</Response>
/* class-menu-processor.php */
<?php 

$selection = (int) $_REQUEST['Digits'];
header('Content-type: text/xml');

echo '<?xml version="1.0" encoding="UTF-8"?>'; 
echo '<Response>';
 
switch($selection){
    case 1:
        echo "<Say>For many in the United States...</Say>";
    break;
 
    case 2:
        echo "<Say>I M M 470 0 3, meets every Monday morning, 9 30 a m to 12 20 p m, in A I M M 2 22.</Say>";
     break;
 
    case 3:
        echo "<Dial>215-264-2459</Dial>";
    break;
 
    default:
        echo "<Say>I didn't understand your selection.</Say><Redirect>./class-menu.xml</Redirect>";
    break;
}
 
echo '</Response>';
?>

TwiML Redirect Documentation

Initiating A Call

Let’s look at how you can call out to initiate an interactive phone menu. This won’t work from your TCNJ account. You’ll need other outside hosting or to run something like MAMP on your local machine.

Twilio REST API: Making Calls

Other TwiML Verbs

TwiML – the Twilio Markup Language

Challenge

  • Break up into teams along the lines of the partner organization you chose as part of last week’s assignment.
  • Create a voice menu for your selected partner organization, including options for the most important informational elements of your chosen organization (program, hours of operation, location, etc.).
  • What language would you use if you complete control over language?
  • How might you use SMS in support of your voice menu?

Assignment

SMS & IVR

Create a new page in your Design Notebook and name it “SMS & IVR” along with today’s date.

  • Read the Real World Examples chapter in the Freedom Fone User & Advocacy Guide.
  • Identify one (or more) of the examples and explain how a similar approach might work with your favorite Partner Organization from last week’s assignment.

Other Examples in the “Wild”

Create another page in your Design Notebook, naming it “SMS & IVR Examples” and today’s date.

  • Demonstrating your Google-foo, search the web for other SMS and/or IVR projects that have been implemented by organizations like your favorite Partner Organization from last week.
  • Has the project been successful? How specifically did they engage with their audience(s) and with what technologies (SMS, IVR, 3rd party messaging apps, etc)? Could you replicate their project for your organization? What would you do differently?

*Assignments are due before class begins on Mondays. Be prepared to present your work in class for discussion.

SMS

Announcements

Design Notebook Discussion

Let’s take a few minutes to talk about your Design Notebook entries from last week. First let’s review the assignment from last week.

Now let’s use the randomizer to pick who’ll show their work:

javascript: alert(Math.floor(Math.random()*17)+1);

SMS

SMS stands for Short Message Service and is a text-based, point-to-point messaging protocol. SMS messages are limited to 160 characters.

Availability

SMS is virtually universal, being available on both feature phones and smart phones. It it part of the GSM (Global System for Mobile Communications) network standard, and is available on most 3G & 4G networks.

There are an estimated 7 billion mobile subscribers globally, that’s about 95% of the world population. Smartphones are estimated to make up about 17% of that total. Since SMS is available on most features phones and smartphones, most of the 7 billion subs have SMS capabilities.

Examples

The Network Effect, Social Graph & “Going Viral”

  • 1 fax machine is useless, 20 million has a lot more value. The network effect states that the value of something increases with the number of nodes in the network.
  • Facebook Friends and 6 Degrees of Kevin Bacon
  • What does it mean to “go viral”?

Influencers & R number

  • In Malcolm Gladwell’s The Tipping Point, The Law of the Few dictates that some individuals are better at transmitting information than others. Connectors extend the social graph, Mavens are experts in  subject, and Salespeople are masters of persuasion. Together, these few create tipping points, where a message goes viral.
  • In epidemiology, the basic reproduction number, R0 indicates the rate of transmission of a disease. When R0 < 1, the disease will die out. When R0 >= 1, it will continue to spread.
  • The trick to going viral then, is to get your message to the “Few” that can leverage their social graph to obtain an R0 value of > 1, the bigger the number, the more viral.

Receiving SMS

  • Log into your Twilio Account and navigate to your Manage Numbers page.
  • Download and extract the SMS repository from the class Github page
  • Using Filezilla, Fetch or another FTP client, upload the hello.xml file to your TCNJ web account.
  • Back on your Twilio Account Manage Numbers page, click into your number to view your number details.
  • In the Messaging field, input the full URL to your hello.xml file on your TCNJ web account, i.e. http://www.tcnj.edu/~username/imm-470-03/sms/hello.xml
  • On your phone, text a message to your Twilio phone number.

If all goes according to plan, you should receive a text back from your Twilio service.

Let’s take a look at the code for hello.xml on Github.

Responding to SMS

  • First, let’s rewrite our hello.xml file as a PHP file, to give us greater flexibility, we can use the one already converted in the sms repository you downloaded earlier.
  • Upload the hello.php file from the sms repository to your TCNJ web server account.
  • On your Twilio Account number detail page, update the URL in the Message field to point to the new hello.php file instead of hello.xml.
  • On your phone, text a message to your Twilio phone number.

Did you receive a text back from Twilio?

Let’s have a look at hello.php on Github.

How about MMS?

While we’re at it, let’s try sending a multimedia file as a message. This is known as MMS, for Multimedia Message Service.

  • Upload the hello-mms.php file from the sms repository to your TCNJ web server account.
  • On your Twilio Account number detail page, update the URL in the Message field to point to the new hello-mms.php file instead of hello.php.
  • Text your Twilio phone number. What happens?

Let’s check out the code.

What Info Comes in a Message?

One useful feature of the Twilio service is that it passes in a number of pieces of information to your Message url. Two of these “request” variables include a “From” variable, which contains the phone number of the sending device, and a “Body” variable, which contains the text of the message sent to you.

Let’s take a look at the code on Github.

  • Upload the hello-request-info.php file from the sms repository to your TCNJ web server account.
  • On your Twilio Account number detail page, update the URL in the Message field to point to the new hello-request-info.php file instead of hello-mms.php.
  • On your phone, text a message to your Twilio phone number.

You should receive a message back that includes your phone number and the text of your original message.

For more details on what data gets passed into your Twilio script, check out TwiML Message Requests.

Creating a Personalized Phone Book

Armed with this Request data, we can use PHP to create a more personalized messaging experience for senders whose phone numbers we already know – sort of like a phone book sms app.

  • Upload the hello-mom.php file from the sms repository to your TCNJ web server account.
  • On your Twilio Account number detail page, update the URL in the Message field to point to the new hello-mom.php file instead of hello-request-info.php.
  • On your phone, text a message to your Twilio phone number, have someone else on you phone list call your Twilio number. What message do they receive? What about someone who’s not on your phone list?

Let’s take a look at the code.

Voice-Activated SMS

What if you could have your answering machine send an SMS to particular people in your phone book when they call your voice line?

You can do it with Twilio:

  • Upload the hello-mom-voice.php file from the sms repository to your TCNJ web server account.
  • On your Twilio Account number detail page, update the URL in the Message field to point to the new hello-mom-voice.php file instead of hello-mom.php.
  • Have someone on your phone list call your Twilio number with their cell phone. When they get your voicemail, your service will send an SMS with wahtever info you want them to get.

Let’s check out hello-mom-voice.php.

Sending SMS

In addition to replying to SMS messages you receive at your Twilio number, you can also use the Twilio REST API to send messages in bulk to a list of contact numbers.

Let’s have a look at the code on Github.

*The send-sms-notification.php code in the class sms repository does NOT currently work on the TCNJ web server accounts due to security issues on the TCNJ servers. It should work on other hosting environments or locally on your own computer if you’re running MAMP or such.

Twilio REST API

Weekly Challenge

Imaging you’re part of a flash mob a cappella group. Everyone in your group has a phone, but not everyone is on FB or Snapchat and there’s no email list, website or FB page. You’re scheduled to meet up at 8:00 this evening at Quakerbridge Mall for a performance, but there’s bad weather moving in, and you really don’t have time to monitor the weather AND make 15 phone calls.

Working independently or in groups, sketch out and prototype an SMS app you can use to automatically update your fellow mobsters on performance status whenever they message you with the phrase “performance status”.

Homework Assignment

The State of SMS

Create a new page in your Design Notebook and name it “The State of SMS” along with today’s date. Read the following articles about 3rd party messaging apps surpassing SMS in message volume. Discuss what this means with respect to SMS as a messaging channel in various user-centered contexts – including broadband availability, open vs. private services, and audience splintering – is SMS the “great equalizer”? Support your argument with additional data about SMS & 3rd party messaging app usage in a specific location & be sure to consider

Partner Organizations

Create another page in your Design Notebook, naming it “Partner Organizations and today’s date. Review the information about the four partner organizations, or search the web for other organizations that interest you, and discuss which appeal to you most and why.

*Assignments are due before class begins on Mondays. Be prepared to present your work in class for discussion.

More Resources

First Day of Class

Intros:

Let’s go around the room and introduce ourselves, our interests and expertise (will help us organize into groups).

Basic Premise of this Course:

The future is already here – it’s just not very evenly distributed. 

– William Gibson

A Digital Divide

Syllabus:

Let’s go over the Syllabus.

Basic Tools:

Assignment:

Create a Google Presentation on Google Drive and name it “Design Notebook”.

Read

Write

  • Create a slide in your Design Notebook and name it “ICT4Dev Design Context” with today’s date.
  • Keeping your response to one slide, consider the two articles above and discuss how the PlayPumps project may have benefitted had it’s donors applied a Donor Funding Charter?
  • On another slide, discuss how the application of a Donor Funding Charter might mitigate “unintended consequences” in “complex adaptive systems” as described in Stop Trying to Save the World.
  • Be sure to share your Google Presentation and post a link to it as a comment to this blog post below.

*Assignments are due before class begins on Mondays. Be prepared to present your work in class for discussion.