Final Report (Team Cacti)

Last modified by Zachary Clark on 2010/12/10 18:10

Title

Footprint

Authors

Zac Clark, Thomas Cavalier, Aaron Stockton, Jacob Burton, Luke Mattingly

Abstract

As portable devices become more powerful and ubiquitous, businesses will need to leverage these devices in order to stand out from their competitors. Any service that utilizes the location of a person's device is referred to as a Location-Based Service, or LBS. One such LBS is Foursquare, a location-based social networking application that allows its users to "check-in" to the locations they visit. While Foursquare is mainly used for social networking purposes, can it be used for other purposes, such as to help people become more aware of their energy usage when traveling?
The goal of this project is to extend Footprint by exploring human-centered computing concepts such as user interface design and system usability. There are a wide range of possible areas of work, such as concepting/prototyping, front-end programming, and back-end programming. 

Keywords

Energy, Foursquare, Web2.0, Mapping, Anti-consumption

Problem / Goal

The idea that cars are bad for the environment is not new or unusual, but its specific applicability to individuals is hard to see and quantify easily. By hooking into an already existing system that tracks a user's travel (Foursquare), Footprint can show the user statistics about their travel with relatively minimal investment. One does not need to be vigilant about tracking their gas expenditure, average travel distance, etc. As long as the user frequently checks in to venues when arriving, all they need to do extra is to tag these trips with some meta-data about their travel (ie: by car, by bike, etc). This is an important problem because raising awareness of carbon emissions is important to help reduce our footprint and lead to more sustainable lifestyles. Also, the project is interesting because it allows us to actually work with data and visual representation, rather than abstract concepts and reasoning.

Initially, our role in the project was to refine the interface to make the application as easy to use as possible. The rational behind that decision is that by lowering the amount of work required to use the system, the barrier of entry is reduced, making it more likely to be used by more people. We were to improve visual design, as well as the logical flow between pieces of the application. As part of the visual design piece, we need to figure out how best to show the statistics we are collecting in a way that will motivate the user to make changes.

After some work on the project we realized that some "invisible" changes had to be made before we could start, such as cleaning up the existing codebase and integrating it into a version control system such that multiple developers can work together on changes to the product. This took more time than we had anticipated, and became a large part of our initial work.

Methodologies

Wireframing, Sketching, Product Flows, Software Development, Distributed Version Control

Relationship of your Project to the Themes discussed in the Course

Energy (the core of the project)

Motivation (how to encourage users to change their habits)

In the area of motivation, we did a little bit of research into various graphing and charting methods, and ended up deciding a bar chart was a good way to present that data collected from a user's foursquare. This was related to some work by Edward Tufte around avoiding "chart junk" and making sure to not obscure actual information through overly complicated graphs. Given more time, we would have put more effort into molding our data into a more visualizable form, and performing more complicated analysis on it (such as trends across time, comparison of different time frames, etc).

How to use computers to help promote better habits

Design (visual and interface)

Meta-Design (designing the development eco-system to promote application design)

While it wasn't specifically talked about in class, we saw much of the code we were writing as meta-design. On its basic level, meta-design is design to help facilitate further design by other users. In the early stages of working on Footprint, many changes had to be made to the code base to facilitate team collaboration. To to this, the code was modularized dramatically, to allow parallel editing of various features. By splitting code organization out between the backend-heavy tasks (like interfacing with 4square and handling data) and front-end design we allowed various team members to focus on specific sections of the code. Another meta-design related coding task was the creation of a set of helper function used elsewhere in the program. Zac had more experience dealing with session handling than other members of the team, so he wrote a piece of code that allowed everyone else to easily check if a user is logged in or not. This directly related to meta-design because the work of the designer (Zac) allowed users of the system (the rest of the team) to more easily use the system to create features.

Characterization of the Individual Contributions

Team Leader: Zac Clark

"Since starting the project I have taken the leadership role and worked on getting the team set up to easily share code and work together. I took the base application code provided by our sponsor and wrote up a series of detailed instructions on how to get it running on each of our machines so we can work on it. This involved minor re-writes to the application as well as adding some new functionality for setting up the database. Then I put the code in version control on Github, with a setup to allow easy collaboration between team members. After that I refactored the codebase to logically separate different pieces on functionality for easier updates.

For the second half of the project I focused on delegating work and helping out when people had issues. This included fixing issues with broken deployments, handling task delegation, providing helpful insight into various problems, and generally holding the team together and on task."

Back End Development: Jacob Burton, Aaron Stockton

For the back end, we had to design a database to manage and store all the information we needed to pull from foursquare. Most of our data is pulled at login and that is the only time that we actually communicate with foursquare. Once the data is stored, we created functionality to measure, track, and display different user activities. The primary function of FootPrint is that now users can see all of their different destination checkins from foursquare and then choose their mode of transportation from a dropdown. We then take that mode of transportation and update the page to show their total distance per method of travel.

The primary benefit of this project is that it is a way for people to understand and record their specific travel habits. We gear it toward their "carbon footprint". So we have happy notes that are displayed when a user travels more on foot for a couple of weeks. Hopefully, by creating an easy way for people to see their carbon footprint, we will be able to encourage them to travel using more environmentally friendly ways.

UI: Thomas Cavalier, Luke Mattingly

Since starting the project we have drawn up wireframes and mock-ups for the site layout. We also settled on the a very earth/green color scheme that really shows a FootPrint kinda attitude. In addition, we have finalized the layout the we feel is easy to use and navigate. We have also implemented adding foursquare badges to the page as a driving tool so that users will want to check in with foursquare and track their carbon footprint. Also, we implement a graphing system that takes the users modes of transportation and displays it in a graph for comparison. It is a way for users to track how they are leaving their carbon footprint like the leaf in a electric car. Also, we able to get the login bar up at the top of the page to only display when your logged in which we felt was a plus because there is no need for it if you are not logged in. Also, with the help of Zac we were able to utilize the header file as a template for other pages such as the help and feedback pages.

Findings and Results so far

We have a working application that we will demo during the class presentation. As the semester progressed, the work done on facilitating design within the code base paid off as everyone got used to the project and the helpful functions added early on. Our development pace and team solidarity increased as we went, and it is unfortunate that the class is over, since we've just begun to function like a real software development group.

If you want to try out our application, the source is available on Github. The README contains information on how to get the application running. Also, you can use Github to browse our commit history, which shows the various messages we've entered along side code as we developed.

Next Steps

As we were working on this project, we realized that some ideas we had were beyond the scope of this class. We liked some of these ideas, so we thought we would document them as if we might work on them later.

Fancier mapping integrated with Google Maps. At some point later it would be useful to use Google Maps to provide better (and more visual) path estimation between check ins.

Adding more complicated data visualisation. We only scratched the surface of displaying interesting visualizations based on the data Footprint collects. We had ideas around visualizing trends across time, providing more fine grained detail, and allowing more complicated comparison.

Custom badges. Foursquare supposedly supports adding "badges" or accomplishments, to their system. This would be interesting to leverage in helping motivate users, as certain sustainable achievements could net them badges, supporting motivation through game mechanics.

Final Presentation

Here are our slides for the final presentation. We're meeting as a team before the final time slot to go over exactly who will say what, so the slides may change a bit, but they'll stay mostly the same (if viewed Friday evening).

References

http://foursquare.com/

http://groups.google.com/group/foursquare-api/web/api-documentation?pli=1

https://github.com/

http://www.joesiewert.com/2010/04/how-to-use-the-foursquare-api-with-oauth-and-php/ 

http://xwiki.cs.colorado.edu/bin/view/HCCF2010/Project-5

http://xwiki.cs.colorado.edu/bin/view/HCCF2010/Footprint

Tags:
Created by Zachary Clark on 2010/12/08 16:48

This wiki is licensed under a Creative Commons 2.0 license
XWiki Enterprise 2.7.1.${buildNumber} - Documentation