view case study ↓
· client project ·
project overview
role
project timeline
tools
deliverables
Free Our Vote, a tech nonprofit, develops innovative solutions to restore voting rights for individuals with past convictions. To further their mission, we redesigned their website to make the donation process faster and more accessible, ensuring greater support for those impacted.
May ‘24 to Sept ‘24
UX Designer
S.W.O.T. Analysis
Site Map
High & Low Fidelity Wireframes
Usability Testing
UX Research
Figma
Framer
The Challenge ✨
this led our four designers…
How might we design an intuitive, streamlined website experience that engages potential donors, simplifies the donation process, and clearly conveys the impact of their contributions toward restoring voting rights?
Free Our Vote aims to attract donors to support the restoration of voting rights for individuals with past convictions. However, the current website experience presents challenges: the site has an overwhelming amount of information and involves too many steps, making it difficult for potential donors to understand both the donation process and the impact of their contributions.
Connecting with our Client
Research 🔍
We had a kick-off session with our client to understand their wants and needs, based on previous research they've done. They specifically requested a cohesive and impactful website to inspire potention partners to support their cause and donate to their initiative, as well as communicates their mission effectively.
S.W.O.T. Analysis
Top Strengths
Top Weaknesses
We completed a SWOT analysis of Free Our Vote's website to pinpoint key areas for redesign.
Competitive Analysis
We conducted a competitive analysis of similar nonprofits to gain insights into what current websites are doing effectively and where they fall short. This helped us identify best practices and areas for improvement to enhance our client’s site and better engage their audience.
Clear Information and CTAs: The home page effectively presents essential information with clear CTAs and concise messaging that reflects the organization’s mission.
Immediate Clarity of Mission: The organization’s purpose and goals are immediately clear on the home page.
Creative Use of Branding: The color palette is applied creatively, making visuals eye-catching.
Impact Emphasis: Impact metrics are highlighted on the home page, with additional details available on the “Our Work” page.
Overwhelming and Unclear Navigation: The main navigation is cluttered with long dropdown menus. Additionally, several navigation links are not descriptive, and redundant elements like floating social media icons add to the clutter.
Confusing Visual Hierarchy and Layout: Inconsistent alignment, margin, and element sizing disrupt visual harmony. A lack of clear visual hierarchy makes it difficult for users to distinguish the importance of different elements, causing confusion.
Unclear and Misleading Content: Some Calls-to-action are unclear or misleading, which can negatively impact user engagement.
Limited User Control: Automated banners without options for users to navigate forward or backward reduces interactivity and control manually.
Here are our goals for the updated site based on our research:
Clear CTAs
Increase Session Duration
Reasearch Goals
By accomplishing our research goals, we aim to create a more seamless and intuitive experience for donors, enabling them to easily access information and confidently contribute to the cause.
Site Map and Information Architecture
Our site map development process focused on optimizing the user journey and information architecture. Our initial assessment revealed a lot of information was spread across multiple pages. The client wanted to streamline this content, prioritizing key information to facilitate informed decision-making for users.
Define💡
Old Sitemap
To address this, we:
Collaborated with the client to identify critical information for users.
Drastically reduced the number of main navigation tabs from 8 to 4, enhancing overall site coherence.
Consolidated and refined content to improve clarity and user comprehension.
Final Sitemap
After a few iterations, the final site map reflects a 50% reduction in main navigation items (from 8 to 4), presents information more concisely, and offers a more intuitive user experience. This restructuring minimizes information overload while maintaining comprehensive content access, ultimately creating a more navigable and user-friendly site architecture.
Design 🎨
Time to Design!
Wireframes and Low-Fi Designs
Design System
Client's Thoughts
Client's Goals
Design Recommendations
We defined the direction for the design by combining our research with challenges our clients noticed on the site.
My primary responsibility was to redesign the homepage, the first point of contact for donors. The goal was to create a compelling and intuitive experience that addressed these key objectives:
Our Mission: Users can easily see our mission.
Clear Calls-to-Action: Guiding users to the most important next steps.
Highlighting Our Process: Demonstrating how we achieve our mission.
Showcasing Impact: Illustrating the tangible results of donor contributions.
Featuring Real Partners: Building trust by showcasing our partnerships.
Provided by client. We took accessibility into consideration when using colors on the webpage.
Typeface: Rubik Bold, Rubik Regular, Rubik Semibold, Rubik Light
Originally, we had an FAQ section section as well, but we received feedback and thought it would be more relevant to move it under "About Us" since users may questions as they explore the site beyond the homepage.
Before
After
Hi-Fi Design
Mission-Driven Design: Created a prominent header featuring a clear mission statement and a call-to-action button linking directly to the donation page. This effectively communicates the organization’s purpose while addressing the client’s goal of simplifying the donation process.
Showcasing Partnerships: Highlighted the client’s partners to build credibility and encourage potential collaborations, aligning with the client’s request to emphasize partnership opportunities.
Transparency Through Process: Designed an "Our Approach" section to clearly explain the organization’s methods, enhancing user understanding and trust.
Building Trust with Success Stories: Introduced a success stories section, sharing real-world testimonials that showcase Free Our Vote’s impact and inspire user confidence.
Test 📝
What do the users think?
Results 💯
Our design team conducted a thorough 2.5-hour user testing interview, combining Zoom and in-person communication. We gathered detailed feedback on brand identity, user flow, language consistency, and content clarity. Here are some specific feedback we received:
Design Feedback
Add separate dropdown tabs for each section of the Homepage to make navigation easier without excessive scrolling.
Switch the automatic scroll on the blog and research carousels to a manual scroll, allowing viewers to read posts at their own pace.
Display the journal publication name instead of the authors in the featured research section, as it leaves a stronger impression on passive users.
Content Feedback
Update page titles, like changing 'About Us' to 'Our Impact,' to better align with the content.
Include brief bios for team members on the website instead of including external links to LinkedIn to reduce friction.
Add more testimonials to enhance FOV’s credibility.
Use clearer, more accessible language to better reach the intended audience, convicted felons, rather than focusing on academic readers.
Create a simple visual graphic to transparently show where donations go, ensuring accessibility for all backgrounds.
All navigation tasks completed within 20 seconds or less.
New navigation bar was easy and helpful to navigate through.
Favored the streamlined donation process and emphasized donation button.
Testimonial on homepage gave a positive impression that Free Our Vote truly cared about their cause.
Following the initial round of usability testing, we considered the user's feedback from the interview and shared it with the client and design team for future iterations.
"Intuitive and empathetic"
Although this project lasted just over three months, it was an incredibly eye-opening experience. It marked my first group project delivering work to a client, where I collaborated closely with multiple UX designers and stakeholders. One key constraint was the inability to test or gather feedback from previous donors due to privacy concerns. Given more time, I would have loved to conduct research with potential partners and further refine the site by adding updated success stories and a floating donate button for greater visibility. Overall, this project was a rewarding opportunity to contribute meaningfully to the community.
Reflections 💭