PROJECT
BRIDGING TECHNOLOGY AND COMMUNITY
SUMMARY
I led the improvement of OpenOakland's website to enhance its visibility and accessibility, driving greater engagement with its mission to empower and foster civic change.
RESPONSIBILITIES
UX Design
BACKGROUND
EMPOWERING CIVIC ENGAGEMENT
In the summer of 2020, OpenOakland, a vibrant hub of civic innovation, approached my team of UX designers comprising myself (Paul), Jessica, and Joshua to reimagine its digital presence. As passionate designers, we embarked on this jounrey to address the organization's pressing need for attracting, onboarding, and retaining diverse volunteers. Our mission was clear: enhance the UX to reflect OpenOakland's values of inclusivity, accessibility, and community engagement.
RESEARCH
UNDERSTANDING THE LANDSCAPE
To comprehend the challenges and opportunities surrounding OpenOakland's digital platform, we employed a multifaceted research approach. This included immersive methods such as contextual observations during their remote hack nights via Zoom, website audits, and survey's within our Bay Area network. Through these efforts we gained invaluable insights into the community's perceptions, desires, and pain points regarding the existing digital experience.
HACK NIGHT OBSERVATIONS VIA
"Maybe this has already been answered, but what is the problem that we're hoping to solve?"
"Hoped for project on-boarding vs just having to jump in"
"..we need more designers."
"Excited! Ready to learn and contribute!"
"A lot of participants and projects to choose from!"
"Scared to step on toes; what don't I know"
SURVEY RESULTS (50 TECHNICAL & NONTECHNICAL INDIVIDUALS)
AWARENESS
Have you heard of OpenOakland?
63.6%
36.4%
Yes
No
VALUE-BASED VOLUNTEERING
Time commitment required
Economic benefit
Social impact
Capacity to contribute
Which factor is the most important to you when choosing whether or not to volunteer your time?
54.5%
27.3%
18.2%
WEBSITE AUDIT & HEURISTIC EVALUATION
No onboarding/CTA
Unwelcoming homepage
No onboarding/CTA
Too much text
UX RESEARCH
UNVEILING INSIGHTS
Our UX research revealed critical gaps between OpenOakland's mission and its digital representation. These findings illuminated the urgent need for clearer messaging, streamlined onboarding processes, and enhanced user guidance to foster a more inclusive and engaging digital environment.
Hack Night X: During OpenOakland's hack night, we faced challenges in navigating projects efficiently and understanding their specific needs. Despite a bustling event, it was hard to find and join projects amidst using multiple platforms. Clarity on tasks and timelines was lacking, hindering effective contribution.
Survey Results: Our survey found that 63% of responsdents were unaware of OpenOakland, indicating a need for increased visibility. Time commitment emerged as the primary concern for potential volunteers, stressing the importance of clear communication in this regard.
Website Audit & Heuristic Evaluation: Our evaluation revealed user confusion about OpenOakland's purpose and participation expectations. Users expressed a desire for more visual content, immediate awareness of impact, and upfront clarity on time commitments. These insights guide our next steps in improving user experience.
DESIGN PROCESS
INITIAL SKETCHES
Given time constraints, we prioritized enhancing OpenOakland's homepage to spotlight both the organization and volunteer opportunities. The user flow demonstrates how potential participants navigate the site to find projects of interest. We introduced a filter feature for a customized experience. The project detail page emphasizes required skills, filled positions, project duration, and contact information for the project lead. Furthermore, feedback from our colleagues during paper prototype testing guided iterative improvements, ensuring a user-centric design approach.
HOMEPAGE
FILTER & SELECT PROJECT
PROJECT DETAILS
STORYTELLING
CRAFTING NARRATIVES
Recognizing the power of storytelling in driving engagement, we proposed a strategic shift towards better narrative communication on OpenOakland's digital platform. By leveraging storytelling elements, we aimed to captivate audiences, convey the organization's mission and impact, and inspire active participation. Through thoughtfully curated content and intuitive design, we sought to create an immersive storytelling experience that resonated with both existing supporters and potential volunteers.
CLEAR BRAND IDENTITY + HEADLINE
NARRATIVE FLOW + CTA's
PROJECT HIGHLIGHTS + SOCIAL PROOF
VOLUNTEERS PAGE
PROJECTS PAGE
MOBILE X
BUILT TO BE RESPONSIVE
Recognizing the prevalence of mobile usage in today's digital landscape, we prioritized optimizing OpenOakland's digital experience for mobile devices. Through meticulous attention to responsive design principles, we ensured that users could seamlessly access and engage with the platform across various screen sizes and devices. By prioritizing mobile responsiveness, we aimed to democratize access to OpenOakland's resources and opporunitities, empowering users to contribute to civic innovation anytime, anywhere.
WEBSITE
TRANSFORMING VISION INTO REALITY
Drawing upon our research insights and storytelling approach, we executed a comprehensive UX design solution aimed at enhancing OpenOakland's digital experience. This encompassed redesigning the homepage to highlight key information and incentives, refining call-to-actions for clarity and effectiveness, and implementing user-friendly onboarding processes. Through iterative designs and user testing, we ensured that our solution aligned seamlessly with OpenOakland's mission while delivering an intuitive and engaging experience for all users.
NEXT STEPS
SOCIAL MARKETING
Now that we've resolved site issues, our focus shifted to driving traffic and promoting OpenOakland effectively.
Upon reviewing OpenOakland's social media presence, it's evident that optimizing brand awareness is crucial. We concluded that in order to reach OpenOakland's target audience effectively, strategic communication is key.
We felt that utilizing Facebook to announce meetups and events would engage the community directly.
Instagram's broad demographic appeals makes it ideal for showcasing project updates and documenting work processes.
LinkedIn offers a platform to connect with professionals seeking opportunities in the industry allowing for targeted outreach.
Finally, X (formerly known as Twitter) provides a swift avenue to promote research, ability to share links to hack nights, articles, and engage with a wider audience through retweets.