Sierra Club North County Group Redesign
Website Redesign | UX & Web Design
.png)
Tools
Figjam | Figma | Wix Studio & CMS | Google Docs & Slides & Form | Zoom
Team
4 UI/UX Designers
Timeline
6 months 4 days
Overview
Sierra Club North County Group (NCG) is a local chapter of the Sierra Club San Diego. Run by volunteers, NCG focuses on inland North County communities by organizing outdoor outings, wilderness education programs, and local conservation advocacy. They aim to make environmental action accessible through hiking events, the Wilderness Basics Course, and community-based efforts around climate and land use issues.
They came to us frustrated with WordPress, it was hard to edit, didn’t support collaboration, and lacked analytics.
Problem
Disorienting Structure and Navigation
The site’s structure is messy: menus send users to the wrong pages, content is repeated across sections, there’s no clear priority for what matters most, and many links dead-end that confusion overwhelmed visitors and made it hard to take action.
This lack of clarity overwhelmed users and made it difficult to take action, even for engaged visitors. It became clear: before improving the visuals, we had to fix the foundation
How might we help first-time visitors quickly understand what the organization does and how they can get involved, without feeling overwhelmed?
How might we support board members in organizing content, understanding user behavior, and improving outreach effectiveness through streamlined digital tools?
NCG Solution Highlights
The Core Features of The Final Solutions
-
Home: Clear landing with a short mission line and CTA on how to get involved.
-
About: Brief pages for History, Members, Grants, Contact Us that explain who we are.
-
Get Involved: Direct paths to Events, Volunteer, Political Actions so people can act fast.
-
Get Outdoors: Program pages for WBC Course and Hiking Trails with more information on the outing.
-
Resources: Practical content for Blogs, Climate Actions, Partnerships for tips and collaboration highlights.
Deliverables & Expectations
Defining the Problem and Our Plan to Solve It
In our first meeting with stakeholders, we clarified expectations and defined the project scope. NCG wanted a redesigned website that would be easier to manage and maintain.
Our main deliverables included:
-
Migrate from WordPress to a more user-friendly CMS with analytics.
-
Enhance engagement by improving site structure and navigation.
-
Calendar visibility for events and meetings
-
Highlighted committees and climate action efforts
-
A style guide and content structure aligned with Sierra Club branding
We also learned there were a few key constraints:
-
We were initially tasked with delivering a Figma redesign template. While a Wix Studio implementation was considered, it depended on whether the timeline allowed. Content updates and long-term maintenance would be managed by the NCG team after launch.
User Research
How We Connected With the NCG Community
While the user flow audit helped us identify structural issues, we also wanted to understand how real users were experiencing the site. To do that, we conducted surveys and interviews with both NCG members and new visitors.
We shared an online survey with help from NCG members, we distributed it through their social media to reach a broader audience.
At the end of the survey, we invited participants to opt in for a follow-up interview. From those who expressed interest, we reached out to schedule 1:1 conversations.
These conversations revealed a clear disconnect between what users were looking for and how the site presented that information.
Insights & Lo-fi Prototype
Participants were overwhelmed and unsure where to start
We analyzed responses from both surveys and interviews to identify common user challenges and behaviors. Quantitative responses helped surface the most frequent pain points, while open-ended feedback gave us deeper insight into users’ expectations and frustrations.
1. Based on User Insights:
→ 7 participants mentioned how navigation should be simplified
-
Simplified navigation bar from 9 to 5 drop downs while the logo on the left serves as the home button
-
Search bar moved to the top nav for easier discovery
-
A clear mission statement to orient new visitors
→ Majority of the participants mentioned to declutter and organize information in a better way
-
Brief page summaries for quick previews
-
Card layouts to break up dense text
-
Embedded PDFs for cleaner, in-page access to resources (for at-home-climate actions)
2. Based on Stakeholder Feedback:
To reflect NCG’s goals and feedback, we adjusted key terms and structure they asked for:
-
Renamed “Get Involved” → “Get Outdoors”
-
Changed “Scholarships” → “Nonprofit Partnerships”
→ The top 3 engagements were signing petitions, donation and volunteering
-
Added a “Political Action” page under the calendar for petitions and rallies
-
Made the “Donate” button more prominent in the nav bar
-
Summary of the volunteer opportunities on the homepage to be more visible
Lo-fi User Flow
Simplify Navigation Starting With The Navbar
The site is failing visitors and volunteers because the navigation and content structure are broken menus lead to the wrong places, pages are duplicated, links dead-end, and editors waste time.
Fix the foundation first: simplify the nav, consolidate pages into a minimal sitemap, and give editors a single, safe CMS workflow so first-time visitors can find and act quickly and board members can access packs without help.
User Personas
Understanding Two Perspectives: First Time Visitors & Board Members
These two personas summarize who we’re designing for: Jordan, a board member who needs one-click access to meeting materials and simple CMS tools; and Emily, a new visitor who needs a clear mission line and an obvious path to sign up for events.
User Testing
Figma Prototype vs. Simplified Wix Version
Given our limited timeline, developing both versions allowed us to explore different formats, gather feedback on what users preferred, and make more informed final design decisions.
After finalizing our high-fidelity prototype, we tested the design using two formats:
-
A Figma version that followed the full visual style guide with slight changes based on feedback in meetings
-
A Wix Studio version with a simplified implementation of the same layout
Version 1: Figma High-Fidelity Prototype
Changes from lo-fi:
-
Get Involved → Get Outdoors (suggested by stakeholders)
-
Map in Contact Us to encompass where NCG
-
Changed bold green/blue background so a lighter blue
Version 2: Wix Studio Prototype
Changes from hi-fi:
-
Redesigned the navigation bar to be more simplified and user-friendly
-
Removed summary sections under dropdown menus for a cleaner interface
-
Adjusted the style guide to incorporate more background imagery instead of relying on bold colors
User Tasks:
All were conducted remotely via Zoom
-
We conducted our user testing on the hi-fi prototype (navigation-driven + follow-ups), then a 3–5 minute open review of the live Wix build with follow-up preference questions to compare findability and clarity.
-
We observed their initial impressions, navigation instincts, and moments of confusion or hesitation to better understand usability challenges
User Testing Insights & Second Iterations
How users navigated the site and where they got lost
After we conducted our interviews, we analyzed how users interacted with both websites and their preferences:
-
10 total users:
-
-
3 North County Group Members
-
7 New Visitors
-
After seeing everyone's strong user preference for the Wix Studio version, particularly in terms of navigation clarity and visual design, we moved forward with it and polished the final layout for handoff. Key improvements included:
1. Majority of participants were confused on Get Outdoors they expected hikes and wilderness programs, not the content currently under that label.
→ Users expected Get Outdoors to mean hiking and wilderness programs, while Get Involved meant finding ways to support NCG. Because both expectations were valid, removing one would still cause confusion.
Action Taken: We kept both Get Outdoors and Get Involved in the nav and added clarifying subtext for Get Outdoors which are hiking trails and wilderness course.
2. 40% of participants felt “Rallies,” “Events,” and “Volunteering” should be grouped under Get Involved
→ Participants see rallies, events, and volunteering as the same type of action: ways to show up and help. Grouping them under Get Involved matches how users think.
Action Taken: We grouped Political Action, Events, and Volunteering under one Get Involved tab and added the nav dropdown “Events, Volunteer, Political Action.
3. 50% of participants scrolled all the way down to find Contact Us while 20% looked in the About
→ Participants expected a clear contact entry but the footer-only email felt hidden or unclear, so some checked About for an obvious place to reach the team.
Action Taken: Added a visible Contact Us entry on the About page (with email + contact form), since the footer only had an email; this gives users a clear, on-page place to get in touch without hunting.
4. All board members wanted to include trails for hiking under Get Outdoors
→ Board members flagged that hiking trails are an important resource. We checked with the stakeholder, who agreed it should be surfaced.
Action Taken: Added an alphabetical Hiking Trails list under Get Outdoors. Each trail links to Apple/Google Maps.
5. All board members wanted to include Spanish translations for climate-action-at-home
→ North County Group serves communities that need Spanish content, translations were an accessibility requirement and there were existing Spanish documents that needed to be surfaced.
Action Taken: Added Spanish versions of the Climate Action pages, uploaded the official translated documents as downloadable PDFs, and added a language toggle in the CMS so editors can publish and maintain bilingual content.
Final User Flow
Simplifying Navigation Based on The User Testing Insights
We added an explicit Home button because people instinctively click “Home” instead of the logo. The About stayed familiar to users, so we simply combined History and Members into one About area. We kept Get Involved and Get Outdoors as separate top-level items testing showed they serve different intents (Get Involved = volunteering, events, rallies; Get Outdoors = hiking trails, WBC course). Resources is now clear: Blogs (board writing), At-Home Climate (practical guides), and Partnerships. All changes reflect observed user behavior and were validated in user testing.
North County Group Final Solutions
Finding Ways To Be Involved & Support NCG Are Now Clear
Participants were getting lost. So we rebuilt the site around the actions people want most: learn who we are, sign up for events, volunteer, and find outdoor programs. The section below highlights the specific updates from one-click RSVP cards to an organized resources hub that make taking action obvious and fast.
The site is built on a Wix Studio template with CMS-driven components, so members simply add content in the CMS and the layout and components render correctly without extra design work.
Get Familiar Fast!
See our mission at a glance, watch a short intro video, read recent blogs, and jump straight to volunteering or events to understand NCG and act in seconds.
Who We Are, History, Members & Grants
Read our story, meet key members, and view recent conservation grants. Build trust and see who we support.
Ways To Show Up & Support
Find events, sign up to volunteer, or join political actions with one-click RSVPs make a real impact without the hassle.
Trails & Programs
Browse hikes, register for the WBC course, and open maps instantly, plan outdoor experiences fast and confidently.
Learn & Act
Read practical blogs, download the English and/or Spanish step-by-step climate guides, and explore partner resources, get tools and next steps you can use today.
Impact & Results
-
91 site sessions since publishing, with 6 unique visitors
-
Most users located in San Diego
-
Bounce rate: 21.6%
-
Top-clicked page: At-Home-Climate-Action (images) with 28 visits
-
Average session duration: 15 minutes 40 seconds
-
Pages per session: 4.5
Members now actively monitor traffic metrics to inform content updates and identify which areas of the site need attention
Lessons & Reflections
User preferences aren't always predictable: testing is essential.
-
Building both a Figma prototype and a Wix Studio version helped reveal which direction users and stakeholders actually preferred, even when the designs were visually similar.
Content placement matters just as much as design.
-
Insights from surveys and interviews shaped how we structured content, helping ensure users could find the information they cared about without frustration.
Clarity and simplicity are more important than features.
-
Users consistently preferred cleaner navigation and more direct content over information-heavy pages. This emphasized the importance of prioritizing content hierarchy and intuitive design.
If we had more time, we would:
-
Improve mobile and tablet responsiveness
-
Test the live Wix version more thoroughly
-
Continue simplifying content for key user groups
Check out my other projects!
Website Maintenance
%201.png)
User Diagnosis MVP
.png)