Interaction Design / Product Design
Make Chicago's bikesharing project more convenient and more social, therefore increasing their value for both commuters and tourists.
Integrate Divvy kiosk functions into existing CTA Ventra infrastructure and design Divvy mobile app which includes functionality such as finding stations to check bikes in and out, fostering social- and self-motivated competition, and account management.
Divvy bikes were introduced in 2013 as a supplement to Chicago's public transit system. Although a great concept, their kiosks were found to have a multitude of usability and technical issues and also failed to have a useful accompanying mobile app. This project began with an embodied design and proceeded on to an interaction design of the proposed mobile app. The UI design of the Divvy bikes app began with observation and interviews, continued on to interface design and user interaction research, and concluded with a design for a mobile application. Our target audience included both users who had previously used bike share programs as well as users that had only used Divvy's existing system. Following the analysis of our results, we created a mobile product that enhanced the biking experience from beginning to end. Our application allows the user to engage in all three phases of the activity curve:
1 To begin designing the interface of the app, we wrote a system concept statement in order to focus our team during a great span of activities. Our concept statement sought to answer the following questions:
2 We carried out a contextual inquiry to observe potential users of the product as they perform tasks relevant to Divvy bikes. Our findings included:
3 To specify what the app should do we established a baseline set of requirements for Divvy bikes.
4 We created a flow diagram to illustrate the flow of information between user and artifacts of the Divvy app.
5 We created a concept map to represent the concepts and relationships between them.
6 We created personas and conceptual task scenarios for distinct classes of users.
7 Our team identified interaction types for the app to model how the user interacts with the interface metaphors.
8 An open card sort was performed on the application content to group and categorize the contents. Based on the result of the card sort, we created a site map to clarify the information hierarchy and prepare to design the wireframes.
9 We designed low-fi wireframes using MyBalsamiq and tested them in order to make changes and improve the design.