A language-aware, intelligent Slack app to allow teams to order Dominos pizza via a multi-step, natural conversation flow from directly within Slack.
We came up with the idea after having experience using Slack amongst ourselves and wanting to develop something interesting on top of it that hadn't already been built. Naturally, we ended up at pizza. While you would think that every kind of application has already been developed for Slack, it turns out that a pizza delivery integration was not yet one of them. We were up to the challenge. While it was a casual idea, the implementation was technically very challenging for a variety of reasons. We had to essentially code a multi-step workflow with multiple users using multiple APIs -- not the simplest task ever.
For starters, we desired to go the whole nine yards and used just about every API we thought would be relevant. We trained an entity on api.ai for natural language processing capabilities, used the Google Maps Geocode API to validate and format delivery addresses, the Dominos API to place orders and match user order input to actual menu items, and the Slack Real Time Messaging API to actually interface with Slack and send messages to and from channels. To top it all off, we used MongoDB as our backend to persist user order information in the event they returned.
If you're keeping score at home, that's a grand total of four APIs and one database we needed to mold seamlessly together. The major issue here? Asynchronous functions. There's not much worse than having to debug race conditions through all of those technologies. As a solution, we wrapped a bunch of the async callbacks in Javascript Promises to keep ourselves sane and not have our code skew so far to the right that we'd be in the conversation for a world record of widest program ever written. It was a super fun challenge to have, and something that we got in a flow with once we got comfortable dealing with it.
Additionally, we had an added of challenge of having to run an Express.js server to process and pass payment information directly to Dominos, while the Slack bot was simultaneously running the listening for user messages in a seperate process. The problem is that those two parts of our application needed to communicate with each other in order for a seamless user experience and in order for us to pass the order information that was obtained in Slack to the point of payment, which was server side. We considered passing this information as parameters in the url, but this was unfeasible for a variety of reasons (not least of which being most users don't want to be redirected via a 500 character url). We ultimately reconciled this issue by passing information into MongoDB from the Slack side, then reading it in MongoDB on the server side once it was ready.
Let's say I'm the project lead on a team, and I want to reward my coworkers for workind hard the past couple weeks with a Friday afternoon pizza party. I can make the Dominator application listen to me from anywhere inside my Slack channel by typing an order, which it will interpret and ask me for information that I did not provide. It is possible to provide more than just order information when I invoke the bot -- I could also give it my phone number, email, and home address if I wanted to knock it out in one fell swoop. We've illustrated the step-by-step process here for clarity.
Note a couple of things: for starters, I say I want a pepperoni pizza. The api.ai entity picks keywords out of my request -- most likely "pepperoni" and "pizza" -- and runs those keywords through an algorithm that matches to Dominos menu items behind the scenes. In this instance, it matched my request for pepperoni pizza with Dominos' Ultimate Pepperoni pizza. Not bad! The application was also able to pick my phone number and email out of otherwise perfectly normal English sentences. Lastly, I gave it a really poorly formatted address, and the application was able to churn out a gorgeous, nicely formatted address that will ultimately be passed on to Dominos (1412 Market san fran was converted to 1412 Market St., San Francisco, CA 94102).
I am then forwarded to a link that contains a page where I can enter my credit card information. Slack does not support sending forms through direct messages, nor would it be ideal to put credit card info in-line as a regular message, so the most secure option is to link to an external form:
Each of the fields that I fill out are validated to ensure that they are non-empty and contain the correct type. The UI automatically changes color and autofills your credit card company if it is a common provider.
Lastly, the most enjoyable step: my order is complete! I can see how much I spent, and how long I can expect to wait until Dominos is able to deliver to my apartment.
If you have any doubts as to whether this actually works, it does! I suppose you'll have to take my word for it. Unless, of course, your stomach starts to grumble, and you can't help but be a little bit curious if the code we wrote actually runs, and you fork it and place an order.
Interested in contributing to this project? Feel free! Create a branch, add commits, and open a pull request.