A Crowdsourced Mobile App for Community Improvement
TIMELINE 3 weeks (November 2015), in collaboration with Andrew Novotny and Sonya Badigian
ROLE Product Design, UI Design, Research
TOOLS Sketch, After Effects, InVision
To design a mobile application that allows citizens to share measures of noise in order to monitor noise pollution, in lieu of installing an expensive network of sensors.
Secondary Research and Ideation: We conducted research on the problem of noise pollution and how other communities are handling it, examining different types, from rural to urban, even indoor and outdoor. We discussed how they affect people’s lives and their environment, and how we could motivate people to track noise levels. Early on, we discussed systems that would encourage citizens to take noise samples unmonitored parts of the city through gamification and competition. We also explored tracking noise levels in businesses like restaurants and bars and discussed noise data collection operating in the background of an application.
Scenarios and Storyboarding: Throughout this process, we wrote short use-case scenarios and created storyboards to make clear the value we were proposing. This led us to think critically about how users would discover the app and feel motivated to continue using it over time. We came to the conclusion that creating a noise-monitoring app was limited in reach to all stakeholders: the city government funding the app, the city IT department who desired a rich data set and citizens who wanted to see a quantifiable difference in the quality of their city.
Pivoting: From this we decided to expand the design to be a map-based interface, built on Google’s map API, that allowed citizens to report and upvote problems in their neighborhood and mark when they’re resolved. In addition to noise pollution, these included everyday issues like potholes, broken fire hydrants and unauthorized trash dumps. Not only does this provide a better way for citizens to report problems, it also creates a clear picture for the city of problems that need to resolved through upvoting, and provides data for council members about how many issues they’ve had a hand in resolving. With this outcome in mind, we set to create the structure for the application.
Sketching Flow: When designing the flow of the application, first called CityScope, we wanted to create the most streamlined path to reporting and resolving issues. Through whiteboarding and site mapping, we were able to come to consensus of how that could be achieved.
Wireframes: These first wireframes mapped out the screens needed to report an issue.
1st iteration of UI: This sketch of an interface established a palette and a vision for how popups could be used to view and send reports. Both experienced further refinement in the final iteration. At this stage, direct messaging between city hall and citizens was removed from the application, and was replaced with social media integration, making it easy for citizens to tweet problems they observed.
Final iteration of UI: Since this app was designed as Android-native and pulled through Google Maps APIs, I decided to align closely with Material Design guidelines for the final iteration. This led naturally to give more weight to the map, the central component to the map, freeing up real estate with Material's Floating Action Button and search box.
Our application Calvino is named after journalist and author Italo Calvino, who wrote “you take delight not in a city's seven or seventy wonders, but in the answer it gives to a question of yours.” We wanted to make the answering of these questions not only a simpler experience but to create a more unified vision of a community. This is reinforced by the ability to see resolved issue pins on the map through a simple filter. Animation provides a seamless navigation experience through the app and around its central hub: the map.
Please see an InVision clickthrough of Calvino below. If you have any trouble seeing this prototype, you can visit this link instead.