Let’s take a few minutes to review some of your Design Notebooks. In particular, what did you think of The Jack Principles and how they apply to your project?
How are your projects going? What sort of feedback are you getting from your partners? Have you received the information you need to move forward designing your solutions?
Let’s take some time to update your team pages with the the user flows you developed last week as part of your assignment.
When creating conversational interfaces for SMS, IVR, or VUI-based interfaces like Alexa, Siri or Cortana, you need to design the “personality” behind the system. This personality is sometimes referred to as the system’s persona.
As persona designers, you need to choose the appropriate voice (male, female, Alice, etc), language (English, Spanish, etc) and feel (tone and writing style). The Jack Principals take about a number of guidelines for creating believable personas:
- Maintaining pace
- Creating the Illusion of Awareness
- Maintaining the Illusion of Awareness
Two important technical hurdles in addressing these principles are remembering elements of the conversation (data persistence), and having functional knowledge and authority about the subject of the conversation. From a technical perspective, we can use databases and APIs to provide data persistence and have access to specific knowledge sets.
Data & APIs
Over the last couple of weeks, whenever we need to store data for our apps, we used comma separated text files. This week we’ll have a look at PostgreSQL, “the world’s most advanced open source database”.
PostgreSQL is an object-relational database, which means it can ‘relate’ information together in the form of tables. It used a query language called SQL, or Structured Query Language, to create, update and delete data in the database.
PostgreSQL is used by thousands of organizations, including Etsy, the National Weather Service, Apple & Skype.
As it turns out, you all have access to a PostgreSQL instance at database.tcnj.edu. Let’s log in and create our database.
For our purposes, we’ll need to do three things to database-enable our apps:
- Create the table for our data
- Insert records into our data table
- Retrieve data from our table
Head over to Github and download this week’s example files.
Let’s create a phone book we can use for some of the apps we developed earlier in the semester.
- Log into the TCNJ postgreSQL database and create a new schema called phonebook.
- Now open up the phonebook.sql file from the examples in a text editor and add in your own phone numbers.
- Click the SQL icon in the menu along the top of phpPgAdmin and let’s feed it your updated phonebook.sql file.
- Edit hello_mom_psql.php replacing the database and user info with your own.
- Now upload hello_mom_psql.php onto your TCNJ web account and update your Twilio phone number message url to point to it.
- Text your Twilio phone number from your or a friend’s cell phone. Try calling from a number that’s in your phonebook database, and from a number that is not.
- What happened?
Let’s have a look at the code for hello_mom_psql.php.
Let’s update the incident reporting app we made last week to use a database instead of a file to store our data.
- Log into the TCNJ postgreSQL database and create a new schema called incidents.
- Now open up the incidents.sql file from the examples in a text editor and add in your own phone numbers.
- Click the SQL icon in the menu along the top of phpPgAdmin and let’s feed it your updated incidents.sql file.
- Now upload sms_map_psql.php, map_incidents.php, and postgresql_map.html onto your TCNJ web account, and update your Twilio phone number message url to point to it.
- Text your Twilio phone number from your or a friend’s cell phone, keying in a location name, and its latitude and longitude coordinates, in a comma-separated list like so: Trenton, 40.2162772, -74.7741221
- Now, in your web browser, navigate to your postgresql_map.html map that you uploaded; e.g http://www.tcnj.edu/~username/imm470-03/databases/postgresql_map.html
- What happened?
Let’s have a look at the code for sms_map_psql.php, map_incidents.php, and postgresql_map.html
API stands for Application Programming Interface and refers to hooks some applications have that allow other applications to connect to them.
For example, Twitter is an application that allows users to share short status updates through a web or mobile interface. But what if you wanted to show your latest tweets on your blog? You’d need to have some way to allow your blog to communicate with Twitter, application to application, to filter, collect, and present just the appropriate tweets on your blog. Since Twitter has an API, this is a fairly straight-forward thing to do.
Let’s work through a couple of examples:
We can use Yummly’s API to search for recipes.
- Set your Twilio Messaging Request URL to http://www.mediamesis.net/twilio/yummly.php
- Using your cellphone, text your Twilio phone number with an ingredient of some kind
- What happened?
Let’s have a look at the code for yummly.php.
GEOCODING FOR FEATURE PHONES
For our geocoding API needs today, we’ll use the Google GeoCoder.
- Set your Twilio Messaging Request URL to http://www.mediamesis.net/twilio/geocoder.php
- Using your cellphone, text your Twilio phone number with address information of some sort; a zip code, a city name, a street address, etc.
- What happened?
Let’s have a look at the code for geocoder.php.
GEOCODING FOR SMARTPHONES
Smartphones come with GPS capabilities built in. The trick is to integrate those capabilities into a sensible user interface that suits your application.
For SMS-based incident reporting, an elegant solution would be to allow users to geocode SMS messages using their phone’s GPS feature:
Cordova SMS plugin + Cordova GPS plugin = Smartphone GPS-enabled SMS client
Alternatively, you could develop a native app that posts directly to an incident database though the internet protocol (wifi or 3g /4g).
A Weather App
Let’s create an SMS app that let’s the user send an SMS with their Zip Code, City, or other address info and receive back the current weather conditions for that location.
- Set your Twilio Messaging Request URL to http://www.mediamesis.net/twilio/current_weather.php
- Text your Twilio number an address of some sort, a zip Code, a city name, a street address, etc.
- What happened?
To accomplish this, we needed a couple of things:
- First we needed to implement a geocoder pattern to convert the address info into latitude & longitude.
- Then, we needed to find an API we can use to get the current weather conditions for our location.
Since we’ve got a working geocoder pattern, we went ahead and reused that to geocode user input. And since we were looking for a solution that will work reasonably well internationally, we used Forecast.io for our weather data.
Let’s have a look at the code for current_weather.php.
- Break up into your teams
- You’ll need a hosting environment other than your TCNJ web accounts for the geocoding and weather APIs to function correctly
- Using sms_map_psql.php, map_incidents.php, postgresql_map.html and current_weather.php as your starting place, recreate the incident mapping app to include geocoding and the weather for the location input data.
- Initially, you had to look up the lat, lon info and input it in along with a name in a comma separated line, now you should only have to type in a zip code, city name or address for the incident to appear on the map, and for the weather report to appear in the marker window.
Cordova (Phonegap) + Yummly tutorial
Continue working in the Amazon Alexa Skills Development Kit & the Amazon AWS Lambda Management Console to refine your trivia game.
- Based on the feedback from your partners, work through any remaining user flows and post them to your team page
- These flows are the conversational paths your systems persona is capable of following.
- Include them in your Vision Document as well
- Get together with your group and formalize your Vision Documents based on this template
- Add a link to your team’s vision document to your team page on the class blog
- Create a new slide in your Design Notebooks and title it “System Persona”
- Write a brief bullet-pointed list of personality attributes your project’s persona needs to have to be an effective interface.
- Include a link to your team page
*Submit the link to your Design Notebook to Canvas before we meet again next week