Built 6 Core Pages and Shipped Key Trust Flows for a Web Platform
Designing a coherent, accessible site for an LGBTQIA+ nonprofit, from sitemap through a 32-component design system to a responsive build with working donation and authentication flows.
A coherent digital home for Pride Family
Pride Family helps LGBTQIA+ adults find chosen family through a matching program, while offering resources and a clear way to support the mission through donations. The site needed consistency, clearer pathways, and working fundamentals so visitors could understand the program quickly, take action with confidence, and get help without hunting. I served as lead designer, built a 32-component design system to standardize the experience, and collaborated closely with the PM and TPM on scope and priorities.
Two distinct users with very different needs
What shaped the decisions
Every design decision ran through these four constraints. They weren't blockers, they were the brief.
Tight timeline with a cross-functional volunteer team
WordPress constraints, so patterns needed to be maintainable by non-technical staff post-launch
Sensitive domain where clarity and safety matter more than novelty
No analytics at launch, so usability testing was the only signal
A site that needed to earn trust fast
The org needed a complete, coherent website that could explain the mission, guide visitors into matching and resources, and support donations without confusion. The TPM initially scoped out the design system as non-essential. I mapped the implementation risk: without a shared component foundation, engineers would build divergent one-off implementations that couldn't be maintained post-launch. The TPM approved a leaner 32-component version (down from 50+ originally proposed) as a minimum viable foundation. Beyond the system, the highest-risk area was trust friction. If login feels unclear, if password recovery is messy, if donation confirmation is vague, users leave.
"What should a user do next, and can they do it without doubt?"
Clarity as a design principle, not just an aesthetic
Rather than optimizing for visual novelty, the entire strategy was oriented around reducing uncertainty at decision points. Every interaction decision was filtered through WCAG AA compliance, low cognitive load, and calm motion over animation.
Make navigation predictable. Clarity beats cleverness.
Consistency is a trust signal, especially for first-time visitors
Reduce decision load at high-intent moments: two primary CTAs maximum per page
Build patterns the team can maintain after the sprint ends
If we clearly explain matching and resources with consistent CTAs, more visitors will take an action instead of bouncing.
If the trust flows feel straightforward, users will finish login recovery and donation completion with less hesitation.
What we built, in what order, and why
A complete site creates comprehension. Trust flows protect conversion and credibility. So we standardized first, then shored up the moments where uncertainty causes drop-off.
From sitemap to shipped, in eight steps
A lean, structured process where each phase had a clear output so nothing drifted.
Remote usability testing with 6 participants
Testing focused on first-time comprehension. Could a new visitor understand the mission, navigate to key actions, and complete trust flows without hesitation? The study was exploratory, not statistically powered, and was used as launch-risk reduction rather than conversion optimization.
All 6 participants navigated key flows without hesitation after revisions were shipped
Users responded well to a clear mission and direct calls to action
Some users hesitated on the resources page when categories were not immediately obvious
Donation intent increased when Donate was consistently visible and not buried
Users trusted the site more when pages shared consistent structure and tone
Shipped scope, usability evidence, and accessibility compliance
Analytics were not yet available at launch, so results are framed as shipped scope plus usability evidence. The 6-participant study provided directional signal and drove 9 revisions, all implemented before launch.
See it in action
Website demonstration
If I kept going
These are the highest-leverage moves I'd pursue in the next sprint.
The work that mattered most was invisible
Building the full site forced a clear product question: what should a user do next, and can they do it without doubt? The work that mattered most was not visual polish. It was reducing uncertainty at decision points. The biggest wins came from removing friction, not adding features, and building a system the team could maintain after the sprint ended. The TPM redirect on design system scope was the right call in retrospect. Proposing a leaner 32-component version rather than the full 50+ taught me how to make a prioritization case that a resource-constrained team can actually act on. One gap: no post-launch analytics were instrumented, so I couldn't close the loop from usability signals to real conversion data. Next time I'd push for even lightweight event tracking before launch.
When your audience arrives with urgency, predictability becomes kindness, and kindness becomes conversion.
More Case Studies
Let's connect and build something together.
Open to product, GTM, operations, and design opportunities.