Northside Residents Redevelopment Council Site Redesign

Redesigning a nonprofit website with the user in mind

Summary:

NRRC is a non profit with a confusing website that fails to inspire trust with its intended users. My team worked closely with the organization and conducted extensive user experience research before completing a site audit, information architecture overhaul and visual redesign.

Role
User Research, Visual Design, User flow

Tools Used
Figma, Miro, Google Suite

Client
Northside Residents Redevelopment Council

Timeline

2023, 2 weeks

Northside Residents Redevelopment Council (NRRC) is a Minneapolis non-profit neighborhood organization which has served the Near North and Willard-Hay neighborhoods since 1969. 

Organization goals:

NRRC's primary goal is to bring about positive social changes, empower residents, and improve the quality of life in North Minneapolis through an active and informed citizenry.

Problem and Solution

To address the usability and accessibility issues of NRRC's website, we adopted a user-centric approach that involved conducting user interviews and communicating with the nonprofit to gain a deep understanding of their unique needs and website goals. We analyzed the feedback from our interviews and survey results to paint a picture of our potential user. We stripped the website down to its content and reorganized the site to be more intuitive for users. Finally, we redesigned the desktop and mobile versions of the website to focus on accessibility and user trust.

NRRC Website Before Redesign

  • Hard to read script font family

  • Inconsistent color scheme

  • Menu displaces images; no overlay

  • Elements run off page; side scrolling

  • Images with no captions or alt-text

  • Redundant buttons on hero carousel

  • URLs are displayed on page, not linked

Research Phase

If we provide an easy-to-use and responsive website that offers comprehensive housing resources, and promotes community events… 

Then Users will be more likely to engage with our platform and feel empowered to make informed decisions, feel more connected to and become active members of the community.

Definition Phase

User Persona

Goals:

  • Homeownership — but needs help finding down payment assistance

  • Build relationships in her community

Concerns:

  • Who can she trust to provide accurate information and advice

  • How to get involved in community activities?

Ideation Phase

User Scenario REMAKE THIS

User Tasks and Flows

Task 1: Access home down-payment assistance resources

Task 2: Apply for a block grant to start a neighborhood watch program

Task 3: Subscribe to the NRRC newsletter

Prototyping

wireframe progression

mid fidelity wireframes

  • Clear, modern font families

  • Consistent color scheme + style guide

  • Improved information architecture

  • Hamburger navigation with overlay

  • All page elements aligned to grid

  • Replaced carousel buttons with org name

  • URLs linked and in contrasting color

User Testing

Our initial user tests were received generally positively. All users were able to complete the tasks in under 2 minutes and 30 seconds total. We received crucial feedback about parts of the prototype that were confusing. Prominently- one user was unwilling to select homeowner resources when attempting to find down payment assistance due to the assumption that those looking for guidance in making a downpayment were likely first time homeowners and wouldn’t select resources that imply they are for someone already owning a home. We drastically increased the size of our hot spots for easy clickability and removed small details that we took from the original website that didn’t carry over well. 

Style Guide

Next Steps

  • Mid/High-fidelity usability testing

  • Feedback from NRRC on our redesign

  • Alt-text on images for low-vision users

  • Add search field+button to nav menu

  • A/B testing of back buttons vs. breadcrumbs