Drunken Stumble, a Drupal 7 Web App Built in a Weekend

By mike@mike-miles.com

This past weekend I took part in the Boston Hack Day Challenge; a weekend long event where teams of developers, designers and programming geeks formed teams and competed to build the best app in a single weekend. To quote the event description:

It’s a weekend of hacking where you can think up ideas, pitch concepts to each other, join into teams to quickly build as much as you can, and present the results.
…
On Sunday everyone will demo to each other and will get feedback from an expert panel. After voting by the judges, and by all of you, we will celebrate with some fun prizes.

The finished projects – with your permission – will be showcased on Boston.com where millions of people will see what you can do.

I figured it would be a great event to not only test my skills as a developer, but to also reignite that spark for personal independent projects (Besides the event featured free food and beer all weekend, that’s all I needed).

Friday

Friday night I showed up among a crowd of 250+ people, not knowing anyone, ready to join a team and get to coding. As a full time web developer specializing in PHP and Drupal, I was on the lookout for a web based project. Something that I was confident I could complete in just 48hrs, so I grabbed a sharpie and made a few additions to my nametag. Web developers are a common site in the Boston area, I needed to stand out.

Ideas were pitched to the crowd, and then we were off to form teams. Initially I pitched an idea (not a very good one), but no one wanted to join my team. That was a stroke of luck for me thou, because as I went around looking for a team to join I saw a group of three people holding a sign that said “Pub Crawl”. so I approached them and inquired about their project. The project was was a web app that would help you plan and create pub crawls, which they were going to build in PHP. If there was not a more perfect project for me, then I don’t know what it is (besides the side project I’m currently working on with my buddy @propstm). @nikibrown (Niki) was the designer, @unruthless (Ruthie) was front end, and @bensheldon (Ben) was the other PHP backend developer.

The Drunken Stumble Team

Immediately I started pushing to build the web app in Drupal, for a few reasons. First, I can develop extremely fast in Drupal. Second, using Drupal as a platform would allow for future expansion of the app. Third, Drupal would take a lot of the work out of what we would have to code. This would be key since the clock was ticking.  At first the rest of the group was against going with Drupal (bad experiences). I backed off a bit but as we kept discussing the project, I felt more inclined to push that we do it in Drupal. By the time we were done planning, it was agreed we would build the site in Drupal 7. (Internally I was ecstatic, I had yet had a chance to build a Drupal 7 site).

In only about two hours not only had we formulated a concise plan about what we wanted to accomplish by the end of the weekend but we had come together as a team. We each seemed to complement each other strengths and were very confident in our app, which we named Drunken Stumble. We ended the night by purchasing the domain names drunkenstumble.com and drunkenstumble.in, securing hosting and the twitter account @drunkenstumble

Drunken Stumble

Saturday

Saturday morning we began development.  We started with some basic wire framing and a to-do list of what we wanted to accomplish. Niki and Ruthie then began working on a design, while Ben and I began working on the backend.

A basic todo list

Ben and I discussed the database schema, we knew that eventually we would want to add user accounts, and other data but focused on what we needed to complete for the core functionality.  We settled on the following:

• Users can create pub crawls
• Give pub crawls unique urls (to share with friends)
• Get user location and provide list of bars in the area

The fastest approach I was was to build a module that would handle all the site functionality, this way we wouldn’t have to worry about setting up content types, views or anything else that (while powerful) would add complexity to the project. With the site being a module, we could control the exact output of the data and use Drupal as the work horse for handling urls, forms and database abstraction.

As I began writing the module (install file, hooks, ect) Ben began looking into APIs.  Obviously for directions we would use Googles Maps API. Now I’ve run into issues with the Google Maps API in the past, because they only allow you 2500 api call in a 24 hour period. We would surly exhaust this, so we came up with a solution. When we reach the rate limit, we would switch from showing the walking directions to providing a link to them. It was an elegant approach, that actually works quite well (especially on a mobile browser since it triggers the google maps application to launch).

Second we needed an API to retrieve information about bars in a users area.  Our first thought was to use the Yelp API (which I’ve worked with in the past) but we quickly came across a major issue (Besides Yelps ridiculous use restrictions). Yelp (unless whitelisted) only allows you 100 API calls win a 24 hour period, and each API request can only return a maximum of 20 results. Thats only 200 bars a day. That would not cut it, there would be no way we could have any type of user base if only the first hundred received result.

On the Boston Hacck website, they had listed a bunch of companies who would be providing API access, one of which was a comapny called simpleGeo. We were not sure how great their data was, so we began doing some test. The results that simpleGeo returned to us were not only correct but were on par with that of Yelp (minus reviews, which we were ignoring anyways).  Even better, the whole weekend we never once hit a rate limit with the simpleGeo API (we hit Googles rate limit a few times). Still, we decided to cache the results we returned from simpleGeo (Bars are not going to move) that way we could hit our server before theirs.

As I worked on displaying the Bar listings, Ben worked on using modernizr to get a users geo location and  the Google API to get latitude an longitude, walking directions and image tiles that show the route.All the while Niki and Ruthie were working hard on design and copy (can read about the process on nikis blog).

By late afternoon the site was coming together, Ben and I had completed enough of the backend work, that we could begin templating the pages.

As a team we powered though it all, and reached everyone of our goals.  Before any of us realized it, it was 3am. Ruthie, Ben and Niki decided to head home to catch a few hours of sleep. I decided to stay the night and continue working/begin QA work. (Mostly because I was feeling to lazy to walk anywhere). This turned out to be a great thing, there is a time of night when you are not quite awake, not quite asleep but in the zone. I started plowing though small issues/tweaks and fixes.

Before I knew it, it was 6:30am, and I was talking with Jodi-Tatiana Charles, the photographer who was capturing the event (and who took all the great photos you see). It seems our team had generated a buzz, everyone was excited to see what we would demo.

Half awake explaining Drunken Stumble

Sunday

The rest of the team rolled back in at around 9, and (besides being surprised that I had been up all night) was excited to complete our app. With the site basically completed we began doing some serious QA. As with all Q.A work, we found bugs, we fixed bugs and we found more. But all in all it was complete. By early afternoon, we were ready to present.

So we began adding more functionality. We provided a page that shows listings of taxis for when you are done with your crawl, and other small touches. At 2:30, time was up. All development was stopped and we were sent to the main area to wait for our turn to pitch our app to the judges.

Drunken Stumble Watching Presentations

Honestly I was surprised by the different projects I saw. some were good, some not so, but each one was incredibly different. And There were a lot that were not completed. I was starting to feel good. Drunken Stumble was not a demo, not a ‘to be completed later’. It was a complete live project. And I think our hard work really showed when it was our turn. (At which time we began tweeting crazily about it)

This is Drunken Stumble

After all the pitches were done the judge went to deliberate. While the organizers had everyone vote for their favorite project via tweeting. After 20mins the judges returned with their verdicts.

The Results

In the end Drunken Stumble won 2 awards. Best Mobile app and Crowd Favorite (as voted on). We were proud, were were happy, we were tired but also ready to start a celebratory pub crawl.

In the end I think the success of Drunken Stumble came down to a few key factors.

• As a team, we all worked really well together.
• Each of us were exceptionally skilled in our area
• (in my opinion) Drupal saved us a whole lot of development time.

Drunken Stumble

I encourage you to take a look and use drunken stumble for your next pub crawl (of for an impromptu one). We are going to keep working on it and improving it, so it’ll only get better.

Boston Hack Day

Here is an article about the winners of Boston Hack Day

Here is a video recaping Boston Hack Day