Drinkr - a #FridayProject on British Soil

Posted on | September 29, 2009

HTML, CSS and JavaScript
Image by Patrick Haney via Flickr

As you might have read I attended Over the Air with Anze. In this post I want to share some insights from the hack competition that took place on the night form Friday to Saturday.

The Idea (16:30 - 16:45)

The idea was developed during a talk about computer vision, face recognition and augmented reality. The talk was interesting, but I’ve seen most of those things before - while I was researching AR about a year and a half ago. I was thinking about an application that might come handy during the conference. Since free beer and wine were on the menu later on, it was easy to come to the conclusion - a drink counter! But a drink counter is not really useful, except for preventing headaches. It needed an intelligent function that would really solve a common problem or prevent unwanted behavior. We decided that adding the function of calling a local taxi company would be great - we would nudge drunk people to leave their car and call a cab with a single tap.

The Design (16:45 - 17:30)

Since we were very tight on time we skipped the paper sketches and went straight to Fireworks for a high fidelity mockup and functionality test. Fireworks is a great tool for quick prototyping because of its Pages, States and Events. The final design was created in about 30 minutes - during those 30 minutes we went through about 4 versions and improved the usability and positioning of elements. The final design looked like this:

Drinkr - Application Flow

Drinkr - Application Flow

As you might have noticed we had the user in mind while designing this application. The dot to increase the counter keeps on growing for each drink the user has. Furthermore the text gets blurred in order to work as a “drunkenness meter”. At any stage the user can exit the counter and call a taxi nearby, but after 10 drinks the game is over, as the app asks the user if she is still standing - we though it was a good joke :)

The Development (22:00 - 03:20)

After dinner, a few beers and some jelly with vodka with a bunch of really cool people we went on to code the application. While sitting on beanbags, Anze decided we would use PhoneGap (we never used it before) as the basic framework for the application. PhoneGap was a smart decision because it allows you to develop and deploy a native application by using web technologies - HTML, CSS, JavaScript. We developed a basic web application first and compiled it for the HTC Hero, Android device we had with us.  The development proceeded quite smoothly, except for some GUI glitches that we needed to fix. We finished at around 3:20 AM and left with a taxi, to catch some sleep at the hotel.

The Presentation (14:30 - 14:35)

Apparently we were the first to fill out the application form, so we were the first on stage. The event organization was flawless - we were able to use a camera to show the application running straight on the device and show it on the big screen. I had a great time presenting as the crowd laughed at the ergonomic growing dot, blurry help text and funny prompt at the final stage.

Other teams at OTA presented some really stunning hacks - I loved the BlueBell hack from Future platforms - an audible and visible display of bluetooth signals in the room.

The Awards (16:00)

Drinkr was selected as one of the winners, even if we were not aiming for a prize. Our primary goal was to have fun, create a functional application and make the audience laugh. We would like to thank the organizers and Vodafone for the cute netbook, we nicknamed Victoria.

We are planning to finish and polish the application this week and release it to the Android market as an experiment.

Enhanced by Zemanta
Filed Under Design, Funky Places, Mobile |

Comments

  • Good to see useful software being made :)
blog comments powered by Disqus

  • Connect

    Twitter  LinkedIn  Facebook  Flickr  Last.fm  

  • Twitter Funk

    Posting tweet...

  • Catch Me Up