Timeline
January 2016 - June 2016
Area of focus
UX Design · Graphic Design
Team: Ryan Pierson, Shripriya Sudhanshu
Description
How can skilled tech volunteers find meaningful projects to join? How can tech for good organizations find volunteers to move their projects forward?
Democracy Lab is a nonprofit organization that connects these two groups, creating a community of social impact technologists. Through in person hackathons and a platform that promotes collaboration, they make it easy for tech savvy volunteers to find projects worthy of their skills and their time. In order to grow their impact, DLAB asked us to redesign their home page layout.
I helped them create a new landing page that told their story effectively, engaging new projects and volunteers. I also helped them with banners and posters for their hackathon events which greatly increased turnout.
WHAT IS DEMOCRACY LAB?
DemocracyLab is a non-profit organization.
They seek to advance tech innovation in social, non-profit and civic sectors through the power of tech-for-good volunteerism.
SHARED
DIGITAL
PLATFORM
TECH
FOR GOOD HACKATHONS
SOCIAL IMPACT TECH PROJECTS
SKILLED
VOLUNTEERS
REDESIGNING THE LANDING PAGE
"DemocracyLab's landing page needs to be updated to provide clarity, improve trust and provide additional content that guides users."
Goals: Increase platform engagement, Reduce bounce rate, Improve SEO
Existing Home Page Issues
Hero image with different call to action buttons for volunteers and project leaders
Many found this confusing and weren't sure which they would be this early on the process, clicking neither.
Jumps right into projects
Left many with questions: Who is democracy lab? Are they running all of these projects? How do I know which ones to look at?
Project search page is easy to use
However most either scrolled through the projects or clicked on one or two without returning to the call to action button at the top of the page. Simply browsing the projects does not help DLAB get more people to sign up onto the platform.
Sponsors make what possible?
What do they do? How are they involved? Still unclear on what exactly DLAB does unless you go to About page.
Initial Redesign Sketch
Low-Fidelity Wireframes
2 out of the 5 rounds of rough wireframes with some updates and changes based on client feedback and user testing
Simplified CTA to one button for all
Abbreviated project highlight section
How it works sections clearly define the two different user's paths
Testimonials from project leaders and volunteers
Hackathon section describes events DLAB hosts and allows corporate partners to sponsor their own
CTA at end of page ensures each user has multiple easy opportunities to join
Updated menu bar and slogan
Led with brief "about us" section based on testing
Changed "how it works" section to include icons, reduced text and secondary CTAs
Shortened testimonials to one at a time to allow for length of quotes DLAB gathered
Simplified Hackathon section and moved sign up form to secondary page
Reordered page so sponsors and partners were grouped
Ended with smaller CTA - single button like at top of page
FINAL LAYOUT
HACKATHON BANNERS
Digital banners for DemocracyLab's quarterly events. Registration via Eventbrite was greatly increased with the improved graphics and posters.