Note Taking on the Go With Evernote and Twilio – Part 2

Note Taking on the Go With Evernote and Twilio – Part 2

In Part 1 of this series, we learned how to use an SMS sent to your Twilio number to create a note in Evernote. Text is great for most note taking use cases but sometimes you need to be more expressive. Some information is best captured visually so we will add support for MMS to add photos to notes.

I also thought it would be incredibly cool if people could leave me notes in my Evernote notebook simply by calling my Twilio number. To enable this scenario we’ll use Twilio’s voice recording and transcription capabilities. The end result is a Twilio+Evernote-powered voicemail system complete with original call audio and a transcription.

This post adds functionality on top of what was created in Part 1. You want to complete that tutorial before starting this one if you haven’t already. This will walk you through getting started with the Evernote API and teach you how to create a note in Evernote using SMS. I’ll wait here while you work on that and we’ll resume when you get back.

All done? Great, let’s get started with the MMS use case.

If you want to grab the code for this tutorial to follow along with, I created a Github repo for you.

Adding Pictures to Evernote Using Twilio MMS

They say a picture is worth a thousand words. Sometimes ideas need to be captured visually. In the context of note taking this can be especially powerful. Maybe you’re doing research at the local hardware store for some renovations you’re making on your home. The words “antique white ceiling tile” might mean something to you while you’re staring at it in the store. However, a picture will be much better in two weeks when you’re trying to make a decision. Let’s extend the /message route in the application to allow us to send a picture along with text when we create a note.

In the Evernote API there is a concept called Resources. You can think of a resource as very similar to an email attachment. To create a resource we will need the contents of the file the resource represents as well as the MIME type for the resource. From those we can create a resource which can then be embedded into the note we create in Evernote.

The first thing we’ll need to do to create a resource from our MMS message is download the image that was sent. We’ll create a method that opens the file at the URL given to us by Twilio and returns the contents as a string. Add the following code to app.rb:

Now in the /message route add a line to download the image using our new method:

Next we need to modify the make_note method we created in Part 1 such that it handles adding a picture to the note. We’ll pass in the image we just downloaded as well as the MIME type specified by Twilio for the image. Modify the call to make_note so that it looks like this:

Now we’ll modify make_note to handle these new parameters. Update it with the following:

Working with resources changes how we construct our note object. We need to create the note before specifying the content for the note since we will use the note object to create the resource for our image. The method add_resource is a convenience method in the evernote_oauth gem that handles embedding the resource into the note for us. It returns a hexdigest which is a pointer we can use to refer to our resource from the ENML that defines our note body. We pass this hexdigest along with the mime_type into generate_note_body which we will update shortly. Then we assign note_body to our note’s content property and create the note using the unchanged create_note method from Part 1.

Let’s update generate_note_body to add the image to our note:

The key piece here is the line that adds an tag to the note body referencing the resource_hexdigest that we passed in. This will embed the image after the text in the note.

That’s it, you can now create a note in Evernote that contains an image. Send an MMS to the Twilio number you set up in Part 1 and a note with a picture should be created in your Evernote Sandbox account.

Hopefully now I’ll make sure to get the right ceiling tiles.

Creating Evernote Voicemail

Text and pictures are great but the spoken word can be pretty powerful too. Complex ideas with complicated terminology might be too tedious to capture by typing on a phone keyboard. Also, there’s great value in giving someone a phone number that allows them to leave a note in my Evernote notebook in their own voice. I’ll get the convenience of a text transcription while also being able to listen to the tone in which they left the message. You can think of this as voicemail for Evernote, powered by Twilio voice recording and transcription.

The first thing we’ll need to do is create a /voice route in app.rb for Twilio to use as a webhook for incoming voice calls. This method will tell Twilio what to do when someone calls using TwiML generated by the twilio-ruby helper library:

The TwiML returned by this method looks like this:

When someone calls your Twilio number, they will be prompted to record a message followed by a beep. When the call is completed Twilio will transcribe the audio and make a POST request to http://your-host.com/transcription with the resulting text and a link to the audio. To handle this POST request let’s add a /transcription route to our Sinatra app:

This code should look fairly familiar since it’s the same structure as the /message code we wrote earlier. We first download the audio from the RecordingUrl Twilio provided us in the request parameters. Then we pass that audio to make_note along with the TranscriptionText (also from the request parameters) and the MIME type of audio/mpeg. That’s all there is to it, let’s test it out. Head to your Twilio number and change the Voice URL to point at our shiny new /voice endpoint:

Hit Save and then call your Twilio number and leave yourself a message. After the transcription is complete a new note should appear in your Evernote notebook. You can click on the audio file to hear yourself in case the text doesn’t quite match up with what you said. The result will look like this in your Evernote Sandbox notebook:

Guess I really need to make sure to get the right ceiling tiles. Thank goodness I have that picture I added via MMS earlier!

Next Steps

Evernote is a great system for taking notes and it opens up the door for some really interesting collaboration when combined with Twilio. In this post we took what we built in Part 1 and added the ability to attach an image to our note using MMS. Then we built an Evernote voicemail system in less than 15 lines of code! I’m really stoked to see what you can build with Twilio and the Evernote API. Try a few of these ideas to extend the system we have built:

• Support more than one image in the MMS workflow
• Create an IVR system for the voice workflow that provides the ability to pick a target notebook
• Add security (this thing is ripe for trolling)

Let me know when you build something awesome by hitting me up on Twitter @brentschooley or emailing me at brent@twilio.com.