Imagine this:

  • You are a Chicago based consultant, working at your client’s office in Washington, D.C.
  • Every Monday morning, you take the same 7am flight from Chicago's Midway to DC's Ronald Reagan airport
  • Every Thursday evening, you take the same 6pm flight back to Chicago
  • You always stay at the same hotel, and rent the same type of car at the same rental company
  • You have been doing this for months. The project end date is July, 2017 and, like you, there are other 25 consultants and contractors commuting into DC from other states
  • The corporate booking site (name your favorite), is not the most beautiful app in the world, and let you book weeks in advance. However, you can only do it one trip at a time (you have to go back and forth to select the same settings and changing the dates, increasing the possibility of mistakes) and still depend on the hotels and airlines for your actual check ins.
  • By the end of the project, you and your twenty five colleagues have probably spend hundreds of hours just going through the booking process, affecting your client's timeline and your frustration levels, specially since half-way down the delivery, it is very likely your manager will give you a different charge code and you'll have to update all your bookings again.

What if...

  • ...there was a way to reduce the countless hours spend on booking for your project to less than a 5 minute process?
  • ...you can easily track all your bookings from your phone, tablet or computer without having to jump between your hotels and flight sites?
  • ...you could share your trip results to your fellow colleagues so they can book all their trips with just one click?

How I built it

Since this was a 1 day hackathon, I focused on the user experience and the integration with the Expedia's APIs. The heavy lifting was already made by the APIs, so I just had to focus on the client side. The project was hosted on Codepen, and was built on top of:

  • Google's QPX express, for the Flight Search
  • Expedia Natural Language Search API, for the Hotel Search
  • HTML
  • SCSS with Bootstrap.css and IonicIcons.css
  • Javascript with jQuery, Bootstrap.js, Bootstrap's datepicker and jQuery's DateFormat

Challenges I ran into

  • Consultants love their perks: travel miles, hotel points, etc. As a result, they tend to be very loyal to a particular brand (e.g. people who only fly with AA vs people who always fly with UA). Expedia's API for flight search doesn't have this as an attribute, which forced me to look into others (in this case, the Google's QPX one)
  • The Expedia API's don't have booking. A better API for this would probably have been Skyscanner's API, BUT they are mostly deeplinking, not booking themselves. Booking in batches may not have worked out of the box.
  • In a full implementation, all of this could have been done with a headless server (e.g. phantom or similar) to mimic the different openings and closings of the links to complete the booking. Or wait until one of the big travel partners realize the potential on this and implement it themselves :)
  • The other main functionality that was missing was a User profile API. The final product should have also a company profile, and within it a project profile. This, to allow not only a better expense manager, but to also include some rules regarding the booking or promotional codes.

Accomplishments that I'm proud of

  • I was eyeing using the Expedia APIs for a while, but this was the first opportunity to actually use it. I went through the whole list to see if there were any solution to the challenges above, and raised many suggestions to the Expedia team. Hopefully some made to a future version of it :)
  • The hackathon also gave me the chance to check my Front-End and JS Integration chops against others, and come up with a simple way to solve the road warrior dilemma. I honestly hope someone in the hackathon steals my idea (it would be better if they let me know though :))

What I learned

  • RoadWarrior concept was tested with my consultant friends on Saturday night. They work for different companies, including the Big 4s. All of them have very unfriendly travel portals (not the fault of the booking tools per se, but they don't give enough priority to improve the UX since travel portals are not revenue generating apps). They all feel the same pain. What is worse: the smaller consulting firms/independent workers don't have anything. They use the regular travel sites (e.g. Expedia, Kayak, Orbitz) to book their trips, and is not uncommon to have a lot of trouble when they have to split the hotel tax from the airfare one (because they booked vacation packages instead)
  • Sometimes you won't have all the tools you need to implement your idea. When that happens, you have three options: mock it, implement it yourself, or look for alternative tools. The last one is the one that I prefer (e.g. using Google's QPX and the Hotel NLP instead of the Hotel Search for example), but it's better to due diligence and come prepared (or come with a simpler idea that uses the APIs like normal people, and do something around it, like voice search or IoT stuff for impact points)

What's next for RoadWarrior

  • The selling point for Roadwarrior is the batch booking. I'll be looking for alternatives in the market. If needed, I can build a screen scrapper using nodejs and hit all the booking links behind the scenes, but this will reduce the number of requests/second that the app can take, and a lot more waiting time, email notifications, etc. which may not be ideal.

PS. The demo in Codepen will require that you get your own QPX and Expedia API keys. Just in case, the JavaScript contains some sample json so you can see what is the idea.

Built With

Share this project:
×

Updates