Open Oakland
Simplifying onboarding to welcome more volunteers
What is OpenOakland?
OpenOakland is a nonprofit civic organization that brings together people of all backgrounds to use technology for local impact. It hosts weekly civic hack nights where the community collaborates on diverse civic tech projects.
My Impact:
Worked with two UX designers to conduct and synthesize user research, shaping the strategy and design direction for OpenOakland’s website redesign.
New Onboarding Flow
Designed a new onboarding process to streamline intake, clarify expectations, and boost volunteer retention.
Led UI Design
Owned UI design from low- to high-fidelity wireframes, defining the structure and flow of the new onboarding experience.
The Challenge
OpenOakland aims to attract a more diverse range of volunteers and increase community awareness. While most current volunteers have technical skills, the organization needs more non-technical contributors to support its projects and growth.
Goal: How might we redesign OpenOakland’s website to attract diverse types of new members, particularly those with a nontechnical background, to help them complete projects?
The Solution
New to OpenOakland?
We improved OpenOakland’s site by simplifying onboarding and redesigning the projects page, helping prospective volunteers quickly find initiatives that match their skills.”
Home Page
As the first page a prospective volunteer might encounter, we surfaced key information such as communication channels, current projects, and upcoming meetings, along with clear calls to action to spark interest and encourage engagement.
Projects Page
Restructured Projects page to allow current and new members to easily access relevant information
Understanding the current website
Evaluated OpenOakland’s website to reveal gaps in attracting new volunteers, driving improvements to the onboarding experience.
FIELD RESEARCH
Attending an OpenOakland Meeting
We attended one of OO’s weekly meetings to interview current members and the leadership team. We also underwent their onboarding process and surveyed current members to better understand OO as an organization.
Findings/Observations:
Designated space/time for members to work together on their active projects
Current Onboarding
not required, essentially an FAQ, designed to get new members acquainted with Slack
OO's main form of communication, several members had no experience with Slack prior to joining OO
Leaders of the OO are facing struggles with limited marketing and an inability to attract diverse talent
SURVEY
Understanding users, needs, and motivations
29 Respondents
Attending community event motivators: relevant issues, stimulating discussions, civic duty, a space to be heard
Attending community event deterrents: scheduling conflict, irrelevant issues, apprehensiveness to share
MODERATED USER TESTING
How are prospective members experiencing the current OpenOakland website?
We asked 5 people to navigate through OpenOakland’s website to confirm our assumptions about the problem of hidden information on OO’s website.
Results
User’s perceived definition of “Civic Hack” night” was inaccurate- thought the event was a hackathon
User registered for an event, but toggled between OO website and Meetup.com
User could not figure out exact event expectations for new members
COMPETITIVE/COMPARATIVE ANALYSES
What are competitors/comparators doing well and how can those strengths be adopted?
To explore inspiration and see how similar organizations attract new members, we evaluated local brigades and comparable community groups.
Who is our target audience?
We identified one target archetype and created a for better visualization on their needs, frustrations, and motivations
The Oakland Local
Intimidated by new technology
Excited to be more involved with the local community
Seeking a collaborative environment
Feels antsy when they don’t utilize disposable time
Likes to be prepared and know event details prior to arriving
Setting Design Priorities
Through our research and data, we now have a strong understanding of our users’ needs and how to prioritize them when strategizing for solutions.
Users benefit from guided experiences
Research shows our audience wants clear expectations before committing. OpenOakland can better engage its audience by clearly communicating time, effort, and convenience through simple, accessible design.
Users want to make informed decisions
Users want to quickly gather enough information to make informed commitments before volunteering their time.
Sketches
I sketched out some basic design ideas of potential website improvements—taking into account key insights from the research before developing higher fidelity wireframes in Sketch.
Final Deliverables
Given the timeline, my team and I were able to produce and deliver a few high-fidelity designs to the OpenOakland organization. We redesigned the website to cater to prospective members by surfacing important information, adding clear call to actions, and streamlining the process of onboarding.
Homepage
Revamped the homepage to streamline onboarding, promote Slack, and encourage engagement with current projects.
New to OpenOakland?
Transformed OpenOakland’s onboarding by setting expectations, outlining preparation steps, and guiding users to join their Slack communication channel.
Projects
Revised the Projects page to showcase active initiatives, team contacts, and desired skills.
Outcomes
Improved information architecture of website
Set event and organization expectations for users by through an online onboarding process (“New to OpenOakland?”)
Surfaced communication channels and answers to users’ frequently asked questions
Projects detail specific needs to help new members find their place as they’re exploring the website
As a conceptual project, our designs weren’t implemented, but we delivered a presentation that OpenOakland’s leaders valued for future website enhancements.
My team and I are grateful to OpenOakland for welcoming us to one of their meetings, allowing us to gather valuable data and insights for our project!
Next Steps
Moving forward, we recommend:
Testing OpenOakland’s website re-design solutions
Applying a similar approach to updating organization’s Meetup.com event pages
Further iterations/refinements after feedback and research
Reflections
Challenges
Timeline: This project was part of my UX design bootcamp, and we had just under two weeks to complete the assignment. While the team had many ideas for the website redesign, we had to prioritize certain pages that would have the greatest impact within our timeframe. Additionally, limited time and resources for user research meant we had a smaller pool of users to gather insights from.
Sketch: I took the lead on wireframing due to my experience with design tools, but since Sketch was new to me, I had to dedicate extra time to learning its shortcuts, refining my workflow, and practicing to efficiently bring my teams’ ideas to life.
Achievements
Field Research: We were fortunate enough to be working on a project that involved a local organization. We had the unique opportunity to perform some field research by attending one of OpenOakland’s meetings. Being able to converse with leaders and survey current members was a valuable experience for gathering insights that shaped our design strategy.
Received positive feedback from the instructors on our growth and learning as designers and teamwork, especially considering we were only 2-3 weeks into the program.
