CASE STUDY · BUTTON & ZIPPER

Button & Zipper Website Redesign

Rebuilding a non-profit coat drive’s site around mission clarity, trust and simpler ways to help.

Role
Lead UX Designer
Team
Founder, UX Designer
Timeline
6 months
Platform
Web
Tools
Sketch
Button & Zipper Website Redesign key screen

The challenge

Potential donors were disengaged. The site didn’t explain the mission or show the impact of a donation, and the path to donate or volunteer wasn’t clear.

Project outcomes

  • A redesigned homepage with a clear mission and a prominent Donate action
  • A shorter volunteer form with conditional logic and real-time validation
  • A revised site map and navigation built from an IA audit

Role and responsibilities

What I owned

Research & Strategy

  • Comparative analysis of peer non-profits
  • Defined requirements and principles with the founder
  • Audited the existing site map and navigation

Design Execution

  • Revised IA and site map
  • Wireframed key pages
  • Redesigned homepage, volunteer, about and donate pages

Content & Trust

  • Mission storytelling and impact messaging
  • Transparent About page with history and partners
  • Clear calls to action throughout

Design principles

Connect. Inspire. Demonstrate.

Defined with the founder, three principles framed every page of the redesign.

Connect emotionallyImagery and stories that inspire community support
Inspire actionClear calls to action and a simple way to contribute
Demonstrate impactTangible results that build transparency and trust
“A non-profit’s homepage is its principal means of communicating its mission, demonstrating transparency and establishing trust.”
— Design rationale

Architecture & wireframes

Fixing the structure first

Analyzing the existing site map exposed navigation and IA problems. A revised site map guided the wireframes and final designs.

Design decisions

How I drove it

KEY DECISION 01

Lead with the mission and one clear action

What I did. Redesigned the header and homepage with a prominent Donate button and content that answers what Button & Zipper does, who it serves and why it matters.

Why it mattered. Visitors judge a non-profit within seconds. The old homepage had ambiguous links and no clear call to action.

KEY DECISION 02

Make volunteering effortless

What I did. Top-aligned labels, removed unnecessary fields, swapped dropdowns for radio buttons, and added conditional logic and real-time validation.

Why it mattered. Long, confusing forms lose volunteers. Every removed field lowers the barrier to helping.

KEY DECISION 03

Build trust through transparency

What I did. Rebuilt About Us around the organization’s history, a video appeal and sponsors and partners.

Why it mattered. Supporters give when they trust where their help goes.

Reflection

Reflection

[Add a short reflection: what you learned, or how the redesign performed.]