Twin Cities Pride Case Study
2025
A full website redesign to enhance accessibility, showcase events, and celebrate the LGBTQ+ community year-round.
Project Overview
My Role - Solo Designer
The Twin Cities Pride website redesign aimed to improve user experience, drive engagement, and better showcase the organization’s events and initiatives. Through a focus on accessibility, clear navigation, and vibrant visual storytelling, the new site strengthens community outreach and supports long-term growth.
As the lead designer, I was responsible for conducting research on users, visual design, and user testing.
Outcomes
✅ Enhanced Accessibility - Redesigned with WCAG compliance in mind, making the site more inclusive for all users.
✅ Modernized Visual Identity - Created a bold, vibrant design that better reflects the spirit and diversity of the Twin Cities LGBTQ+ community.
✅ Better Content Strategy - Refined page structure and messaging to guide users toward key actions like volunteering, donating, or attending events.
Problem
Goals
The previous Twin Cities Pride website lacked clear navigation and a cohesive visual identity, making it difficult for users to find event information and engage with the organization year-round. Accessibility issues and outdated content structures further limited community connection. A redesign was needed to modernize the platform, improve usability, and better reflect the vibrancy and diversity of the LGBTQ+ community it serves.
Enhance user accessibility, ensuring users can navigate, understand, and interact with the site without barrier
Improve user navigation and experience through a restructured site architecture to create a more intuitive and easier to experience.
Modernize the design language through a vibrant, cohesive visual system that reflects the energy and diversity of the LGBTQ+ community
Phase 1 - Research and Discovery
Competitive Benchmark
Identified and extracted information architecture of three human rights websites analyzing,
1. Structure
2. Layout
3. Design
Personas
Created 3 Personas to make user goals, motivations, needs and pain points a focus for the project.
Problem Definition
Users faced challenges with site navigation, event discovery, and accessibility, leading to lower engagement and a fragmented user experience. Visually, the site no longer reflected the energy, inclusivity, and growth of the organization.
Phase 2 - Ideation
Through the ideation process, I brainstormed user flows, and sketches to better understand how to approach the design process.
Early Sketches
User Flow
Phase 3 - Low-Fidelity Design
Created wireframe designs for multiple pages to represent navigation process, and allow prototyping for user testing.
Wireframes
User Test 1
Created a clickable prototype to be tested by 3 users in order to identify navigation and design issues.
Outcomes:
Larger Donation Button
Users struggled to find the donation button, so the button was made larger, and color was added to help it stand out
Increased Size of Navigation Bar Text
Users felt the navigation bar items were too small and hard to read, so it was scaled up to be more usable.
Added Footer
Users expected a footer at the end of the page, so a footer with
detail was added
Phase 4 - High-Fidelity Design
After developing a low-fidelity design, and identifiying user pain points, I developed a mood board and UI style guide before creating a high fidelity prototype for further user testing.
Mood Boards
Created two distinct mood boards in order to find what style of colors and text best represent the websites needs.
Style Guide
A style guide was created after deciding colors and typography, to create a cohesive design language for the site.
High-Fidelity Prototype
After deciding on the rules for buttons, color, and typography, a high fidelity prototype of the pages was created using Figma.
User Test 2
Further tested the design using the high fidelity prototype on 3 users to identify pain points and other areas of potential improvement.
Button Cohesion
Users were confused by the alternating colors of buttons, leading to users thinking the lighter colors were inactive.
Changed Navigation to Hover
Users felt that the navigation bar items should be toggled by a hover state rather than clicking.
Phase 5 - Final Deliverables
Takeaways
Through this project, I transformed the Twin Cities Pride website by creating a cohesive and consistent brand identity that is reflected throughout every page. The most important lessons learned from this project were the following:
- User testing is crucial for identifying paint points for users
- Creating a UI style guide helps create a unified design, increasing accessibility and usability for users.
Selected Works
