Good 4 the Hood
A mobile app that strengthens communities by helping neighbors meet, communicate, and build relationships.
The Design Process:
First, I designed a survey instrument to understand how people think about their neighbors, and to learn more about different interaction styles and needs. Then neighborhood residents were surveyed.
The survey results identified behaviors the app would need to support. I brainstormed activities which could facilitate those behaviors. These activities became app features:
- Communication between neighbors
- Helping each other
- Calendar of events
- Learning names and faces
- Family profiles
Use cases/ story boards
After identifying the features, I defined primary use cases, and then storyboarded those to frame the context of the app, and to provide test cases against which to validate usability.
Workflows and navigation maps
I designed tasks and work flows, breaking down high-level tasks into lower level ones. Then I explored two different navigation patterns.
Sketching and wireframing
Sketched out design ideas, and wireframed both navigation options.
Navigation option 1
Separate navigation buttons for all five functions.
Alerts & Messages
Send and receive messages without having to share or keep track of neighbors’ contact details. Share interpersonal or group communication, including quick announcements, reminders, and alerts.
Compose a message
Touch ‘+’ in ‘To’ field to add recipients. The ‘Who’s Who’ screen opens, where user can select a photo, search, or ‘All’ to share with everyone. Touch camera icon to upload or take photos.
Suggests random acts of kindness, like raking leaves or delivering donuts. People can also enter tasks they need assistance with, and neighbors can volunteer to help.
Read or post events to the community calendar. Add events by clicking ‘+’ at the top. Touch events for more detail.
Learn neighbors’ faces and names with the Who’s Who feature. Touch a photo to see names and other information about a person or family.
Navigation option 2
All primary actions are on a single screen. Secondary actions, like looking up neighbors and updating profiles, are accessed via navigation buttons. The three nav buttons are: Home, Who’s Who, and Profile.
Designed high-fidelity mocks to flesh out and polish the look and feel of the app, as well as to communicate the visual language for production designers, developers, and stakeholders.