Case Study: Burrito Brigade Website Redesign

Burrito Brigade’s website was struggling to clearly communicate its mission, impact, and opportunities for involvement. Visitors faced accessibility barriers, hidden information, and unclear calls to action—making it harder for potential donors and volunteers to take the next step. This case study outlines how I restructured the site’s content, improved WCAG 2.1 accessibility compliance, and redesigned the user experience using semantic HTML, responsive design principles, and measurable UX improvements.

About Burrito Brigade

Burrito Brigade is a community-focused nonprofit providing free meals while supporting local food systems. Their work depends heavily on volunteers, donations, and clear public communication. As the organization grew, their website became harder to maintain and increasingly difficult for users to navigate—especially for people using assistive technologies or mobile devices.

The redesign needed to balance warmth and approachability with clarity, accessibility, and scalability, ensuring the site could support future growth without sacrificing usability.

Challenges & Goals

Key Challenges

Project Goals

Burrito Brigade Case Study

Redesigning a nonprofit website for clarity, accessibility, and engagement.

1. Discovery

Identify goals, audience, and challenges.

2. Design

Information architecture, and visual branding.

3. Development

Build an accessible, responsive site.

4. Testing

Check accessibility and functionality.

5. Launch

Go live and track results.

Workflow Breakdown

1. Discovery

The project began with a comprehensive audit of the existing website’s information architecture, content hierarchy, accessibility compliance, and on-page UX patterns. This included reviewing heading structure, link clarity, keyboard navigation behavior, and content discoverability for primary user paths such as donations and volunteer sign-ups.

2. Design

Based on discovery findings, I redesigned the site’s information architecture and page layouts to reduce cognitive load and improve content scannability. Design decisions emphasized accessible color contrast, consistent typographic hierarchy, and clear call-to-action placement aligned with nonprofit conversion goals.

3. Development

Development focused on clean, semantic HTML5 markup, responsive layouts, and accessibility-first interaction patterns. This included proper heading levels, ARIA-friendly navigation where appropriate, visible focus states, and full keyboard operability across interactive elements.

4. Testing

Testing included cross-browser and cross-device validation, keyboard-only navigation testing, contrast validation, and accessibility checks aligned with WCAG 2.1 success criteria. Identified issues were resolved through iterative layout and content refinements.

5. Launch & Measurement

Following launch, Google Site Tag was implemented to track key engagement metrics, including donation interactions, volunteer sign-ups, and page-level behavior. This provided actionable data to support ongoing optimization and content decisions.

Problem → Solution

Problem: Outdated Design
Redesigned with a clean, modern look and WCAG-aligned accessibility, improving readability and making the site more welcoming to first-time visitors.
Problem: Information hidden in accordions
Moved critical content into visible, scannable sections, reducing cognitive load and helping users find what they need without extra clicks.
Problem: No events page
Solution: Added a dedicated events page to showcase volunteer opportunities and community events.
Problem: Accessibility gaps
Applied WCAG 2.1 standards including proper color contrast, semantic markup, and full keyboard navigation to ensure equitable access for all users.
Problem: Duplicate donation pages
Solution: Consolidated monetary and in-kind donations into a single, streamlined donation flow, reducing user confusion and improving conversion clarity.
Problem: Overly verbose
Solution: Simplified body copy, used concise language and clear headings
Problem: Donation Impact Unclear
Solution: Provided meaningful, clear examples of how donations are utilized and the benefit to the community.
Problem: No metrics tracking installed
Implemented Google Site Tag to track donations, volunteer sign-ups, and key interactions, giving the organization visibility into what content drives engagement.

Results & Impact

What This Project Demonstrates

This redesign highlights the impact of accessibility-first thinking and intentional content strategy. By focusing on clarity, structure, and user needs rather than visual trends alone, the website became a more effective tool for community engagement and growth.