Existing Site Redesign
From ambiguous information.......
......To engaging volunteers and donors.
by, Dana Kohl, Asa Huber, Jenny Gibbs & Hussain Alyousif
Tools Used: Figma, Miro, Adobe Photoshop, Adobe XD, Google Drive, & Notion
​
​
The Challenge
This park enhancement non-profit lacked usability for both volunteers seeking program involvement and potential donors interested in donating money. Our team's objective was to enhance the website's usability and highlight the non-profit's mission in order to direct users more effectively to get them to volunteer or donate.
Problem:
The current website fails to meet the organization's needs for effectively guiding users to engage with their programs and enticing donors to make monetary contributions.
Solution/Value Proposition:
Redesign The Park People's website to increase user engagement with the organization's programs to empower users to improve their community and increase the number of trees in the Denver area.
Stakeholders
User Interviews
"To evaluate whether a nonprofits site is trustworthy or not I like to see photos that are not stock photos. It feels more genuine. I also want to be able to easily figure out their mission"
-41 yr old married mother of one
​
​
"I would prefer to support a nonprofit by being hands on and would get more fulfillment out of it than just donating”
-28 yr old single working professional
Heuristics Evaluation
Our team's evaluation noted the following:
Organization's primary goal or purpose is unclear
Very heavy copy, site not easy to scan
Major headings are difficult to identify
Some prioritization of content, but the volume weighs it down
Nav bar is confusing and has too many drop down tabs
Has a search bar but it goes almost unrecognized to the user
Links have no consistency and do not follow UX Conventions
Donate button is on the side; would any user see this?
Usability Testing of Existing Site
Testing results
8 of 10 users could not find the donate button
10 of 10 users could not find the donate linked within the programs page.
7 of 10 users were not sure what the programs were or what they meant.
5 of 10 users could not find the mission statement.
8 of 10 users could not easily understand what the mission statement was.
6 of 10 users have difficulty with drop-down navigation.
User Interviews
To evaluate whether a nonprofits site is trustworthy or not "I like to see photos that are not stock photos. It feels more genuine. I also want to be able to easily figure out their mission"
-41 yr old married mother of one
​
​
"I would prefer to support a nonprofit by being hands on and would get more fulfillment out of it than just donating”
-28 yr old single working professional
Proposed Solutions
Remove drop down menus and categories
Implement intuitive navigation
Highlight significance of programs
Change and move donate button
Less copy
More call to actions
Key Findings
Research indicated that the site map, layout, and user interface were too difficult to navigate and the organization's mission was not clearly defined. As a result, accessing volunteer or donation information on the existing site proved challenging for users.
User Persona
Utilizing the data gathered from user interviews, usability testing, and stakeholder goals the following user persona was created to empathize with users in finding the non-profit's mission, program details, and donation information on our redesigned site.
Jessica Mason
Jessica and her husband, Jacob, have one young child. They are recent homeowners in the Denver area who want to get involved in their neighborhood community. Jessica wants to plant trees in the neighborhood to improve quality of life and make a positive impact. She wants to teach and inspire their child to preserve green and natural spaces within an urban environment
Age: 35 | Occupation: Professor | Location: Denver, CO | Education: PHD| Status: Married
MOTIVATIONS
-
Impact climate change
-
Create Sustainable future
-
Set and example in her community
-
Model her values to her daughter
-
Bond with her family while giving back
NEEDS/GOALS
-
Find trees to plant
-
Learn to plant trees
-
Get involoved with organization that aligns with her values
-
Find way to contribute to a good cause
PAIN POINTS
-
Organization must be trustworthy
-
Difficulty finding information
-
Limited time
-
Feeling like she's not invested in her community
-
Not enough trees in her area
Mood Board
Style Guide
Wireframes
To highlight their purpose, the Park People's mission statement was prominently placed on the home page. The top navigation bar was condensed and drop down menus were removed​ for usability. The layout and design were simplified to make the site immediately easier to scan.
ABOUT US
PROGRAMS
HOME
Mid-Fidelity Prototype
The "Donate" button was moved to the navigation bar so it would be prominent on every page. Other buttons and calls to action were streamlined to make them more obvious and intuitive. The sitemap and content organization prioritized the programs' page and ease of online donations. Our team started to incorporate elements of UI design based on the proposed style guide to emphasize this important content.
HOME
PROGRAMS
ABOUT US
High-Fidelity Prototype
The navigation was simplified to help users find both the organization's mission and the featured programs. The copy was rewritten to cut out the excessive text that users were not spending the time reading and was inhibiting them from efficiently scanning the information. The brand and style were designed to attract the user emotionally to the outdoors and the need for nature in an urban setting.
​
HOME PAGE
ABOUT US PAGE
PROGRAMS PAGE
