The goal of Serve GR is to make it easier for people to find and sign up for volunteer opportunities in Grand Rapids that they are passionate about, that use their skills, and fit their schedule.
The Serve GR team came to Mighty with an idea, but had no visuals or brand. We don’t do brand work very often, if at all, but I got to create a word mark and started to develop a brand identity with fonts & colors.
What are the deets?
We knew we wanted to showcase volunteer opportunities, but what details should we show? We worked with the Serve GR team to figure out the specific details they had for each opportunity, and started to sketch a template where that information would fill in for each opportunity.
Sketch before sketch (or after, or during)
Even once I start creating wireframes or sometimes even hi-fidelity mockups on the computer, I always turn back to my sketchbook for quick idea exploration.
I created a wireframe prototype in InVision to present to the Serve GR team. The prototype helped them start to see the interactions we had talked about, like how the filters would expand down to reveal specific options.
I used bright colors that represent the vibrancy and energy of the city of Grand Rapids and all the opportunities that are available. We wanted to make the site feel enticing and exciting, to urge people to sign up to volunteer.
The details page was the most challenging, but fun page to design. This page needs to accommodate a wide variety of content, since some opportunities have more information than others.