Heuristic Evaluation
Heading
Key Insights
Heading
Competitive Analysis
Heading
User Journey Map
Heading
Empathy Map
Heading
Wireframes
Heading
Style Guides
Heading
Desktop Home Page
Heading
Desktop Housing Page
Heading
Desktop Donate Page
Heading
I had the pleasure to collaborate with a team on a redesign project for the nonprofit Opening New Doors Foundation (ONDF), which supports women who have experienced domestic abuse. Through rigorous user testing, our team identified a number of critical issues with the current website, including challenging navigation, dead end links, unappealing aesthetics, and an unsuitable data structure. Our primary purpose was to improve the user experience by making it easier for users to discover the information they need on the website, and to ensure that the site complies with the requirements established by Section 508 of the Rehabilitation Act.
My Roles
As a key member of the team, I was tasked with doing UX exploration, definition, design, development, and delivery.
Deliverables
HeuristicEvaluations, Proto-persona, Survey, Usability Testing Plan and Testing Data,Affinity Diagram, User Persona and Key Insights, Empathy Map, Card Sorting,User Journey Map, Competitor Analysis, Site Map, Style Guide, Lo-fi & Hi-fi prototypes, Prototype Testing
Tools
To create these deliverables, we used a number of design tools such as Miro, Figma, Adobe XD, Photoshop, Acrobat, Google Sheets, Google Forms, MS Word, and Zoom
Discover
We began our design process by conducting a heuristic analysis of the existing website, which was followed by user interviews to identify its issues and pain areas. As a consequence, we deduced that the site's navigation was disorganized, the data layout was poorly ordered, the aesthetics were dated, the white space was ambiguous, and the site was in general excessively complicated.
Define
To address these problems, we performed in-depth user research. The deliverables we created included user journey maps, empathy maps, and user personas. Based on what we learned, we collaborated to develop style guides and wireframes for the desktop and mobile versions of the site. We restructured the navigation data, reduced the number of links, and used color and iconography to highlight the most crucial information in order to make the navigation easier to use. We also confirmed that the new site conformed with 508 requirements through Web AIM testing.
"If the site is meant to help women find transitional housing, why is it buried in their navigation bar? Even the headings of the navigation don't make sense to me"
— Austin
"There is no obvious contact phone number or any contact information. ...Really, for a site like this, a phone number or a chat feature should be very prominent."
— Susan
Design
To improve the information architecture, simplify navigation, and make it easier for users to find what they need, we then developed and periodically updated a site map. We examined and improved color contrast to improve readability and reduce visual clutter. We implemented deft spacing strategies, utilized Web AIM to test the color contrast, and utilized carefully chosen fonts.
User testing revealed that, as a direct result of our team's work and commitment, our redesign exceeded expectations. The new site has superior architecture and data organization than the old one, which makes it both more practical and aesthetically pleasing. Our team's strong cooperation and unwavering commitment to building a user-friendly and easily accessible website are main reasons for our success.
