This year our university held its 6th biannual hackathon, M Hacks 6, at the University of Michigan in Ann Arbor. For those who are unfamiliar with hackathons I would recommend reading this Business Insider article here. This wasn’t my first hackathon project that I worked on, but it was the first that I had a teammate who worked with me to help design the Front End UI, something that I have never been able to do on my own. This allowed us to focus a lot on the application and come up with a finished product to demo after the 36 hours had completed.
The application that we created was called FastTrack. The purpose of this “hack” was to create a platform to track traffic through our on-campus gyms in realtime. The application was built on top of Facebook’s Graph API and Facebook’s Parse Database Framework. This allowed users to login to our application with their Facebook profile, thus saving them the hassle of signing up for yet another inbox filling account. Implementing the Facebook login also allowed user’s to see their friends’ activity and even what gym they were currently at. The following images will contain screen shots of the app running on an iOS device.
The above image is a screenshot from the home landing page. It contains custom MKAnnotation pins that represent the current volume at each on-campus gym. This is a map of the university gyms on the Ann Arbor campus. During our demo, one of the gyms was under construction and closed for the year (this is represented by the “X” pin). The other three gyms also show how open each gym is in realtime. The volume of the gyms is pulled from the database and then the correct pin is drawn onto the map. You can also see my Facebook profile is loaded into the application.
The above image contains the data that shows the average volume of people that attend the NCRB gym on certain days at certain times. This data is pulled from our Parse Database and all data is stored in JSON format. This data is stored for all 3 gyms on our demo database. We designed this UI to be as easy to use as possible. Both graphs can be interacted with very easily. You can pan across the time graph and change the days by tapping on the day you wish to see more information about.
These two screenshots above were designed to keep our users coming back. The Recent Activity page shows your Facebook friends that are registered with out application and how many points they’ve earned this week (points are gained by spending more time at the gym). You can even see which gym your friend is currently at, if they are at one. The Tab on the right, shows ways that you might be able to redeem points earned. This was designed to allow gym users to earn rewards for going to the gym more. It also allowed companies to more accurately market to their customer base.
We really enjoyed working on this project and while we were developing it we always kept in mind ways this could scale up. We were thinking this could be used for school libraries or dining halls. If we had more time to spend working on this project we may have implemented a system that supported those places as well.
Thank you for spending the time to read about the project we spent a sleepless 36 hours developing!