PAWS CHICAGO REDESIGN
IMPROVING A RESPONSIVE NONPROFIT WEBSITE
MOBILE & DESKTOP PROTOTYPES
This redesign aims to enhance user navigation of the nonprofit's online resources, promoting pet adoptions, donations, and volunteer opportunities.
GOALS
Identify the needs of PAWS Chicago users (current or future pet owners) in relation to UI accessibility and usability
Design a responsive solution enabling them to navigate the website effectively.
TIMELINE
The project was to be completed in roughly 2 and a half weeks, with work spanning from January 23, 2023, to February 9, 2023.
TEAM SIZE
Our team of four divided roles for the nonprofit site’s redesign: two UX researchers, two UI designers. As a UI designer, I led IA restructuring and responsive prototyping, while also contributing to UX research.
TOOLS USED
WHAT I DID
During this project, I performed card sorting and produced 2 sitemap iterations redefining the site’s IA. I designed 3 prototypes (2 mobile, 1 desktop) and developed a style guide for UI branding. I also contributed to UX research by conducting 2 usability tests, identifying a user insight and reframing it into a problem statement, and constructing a value proposition highlighting our solution’s offerings.
THE PROCESS
Our team of four was tasked with auditing a nonprofit organization’s website via research, testing, and analysis, in order to create a responsive prototype of their site’s homepage and navigation, redesigned for usability and accessibility.
Our process followed the “Design Thinking” framework, including initial user research, UI definition, IA ideation, iterative prototyping, and testing.
USER RESEARCH & FINDINGS
Our team chose PAWS Chicago's website for a responsive redesign due to our mutual interest in pets and the nonprofit's no-kill practices, as well as evident usability issues. After identifying pet owners as our target users, we performed a heuristic evaluation identifying barriers to the site’s usability. We also conducted a competitive analysis of three no-kill shelter websites, discovering issues with animal imagery, text legibility, complex color palettes, and ineffective navigation.
To identify key user needs and pain points, we remotely conducted 8 initial user tests (4 desktop, 4 mobile) accompanied by interviews and synthesized our data into an affinity diagram.
Our findings revealed beliefs that a shelter’s animal-first practices should be visible, and that shelters focused on monetizing animals above keeping their online presence updated are harder to trust. From this data, we developed a persona named Kitty Owens, providing a clear and actionable understanding of our users.
DEFINITION & IDEATION
After leveraging our research data to define user needs, we conducted card sorting to optimize PAWS Chicago’s navigation. The site’s revised IA (hierarchy of web pages) sorted 92 tertiary pages into (13 of) 35 secondary pages, which were hosted by 6 primary pages of logical categories. Using this card sorting structure, we produced a sitemap dividing the site's navigation into three main sections: primary, utility (search bar), and footer.
Additionally, a mood board compiling UI pattern and branding inspirations was used to develop a UI Style Tile, later expanded into a responsive style guide providing a cohesive visual identity for the site's redesign.
INTERACTIVE PROTOTYPE
Using the sitemap, each team member independently sketched wireframes of the interface, which we voted upon and used to create a clickable mid-fidelity prototype of the homepage and primary navigation menu. After gathering user feedback, we incorporated changes into responsive UI components to create a high-fidelity responsive web solution, consisting of hi-fi mobile and desktop prototypes, composed of 8 wireframes each. Testing and iteration were crucial aspects of the prototyping process, enabling us to design a final product that effectively met the needs of our target users.
USABILITY TESTING & FINDINGS
Guerilla user testing was conducted remotely over Zoom or Google Meet, with participants matching the target users. Initial testing of PAWS’ during the research phase yielded a 77% average success rate, with users mostly struggling to follow adoption and donation processes. Our mid-fi prototype addressed these issues, with five mobile tests yielding a 70% average. Despite being informed of limited interactivity, most users struggled with the menu’s density and absence of links. Incorporating those fixes, our responsive hi-fi solution tested with three users resulted in 100% – a 23% improvement over the initial testing average. Thus, the redesign is an empirical improvement to the current interface.
INSIGHTS & OUTCOME
Our user-centered redesign of PAWS Chicago's website resulted in a responsive solution addressing the needs and pain points of our target users. While I made some contributions to research activities, acting primarily as one of two UI designers allowed me to make highly intentional design decisions, such as using symbolism in our interface’s style and color palette. If we could continue working on this project without time constraints, we would finish building out and testing a complete flow for pet adoption, explore ways to re-integrate utility nav options and subpages that were temporarily removed from the menu (in order to condense it), and conduct additional usability tests on desktop and mobile alike.
Copyright © 2015-2025