My Role
Contributions
Tools
Team
Timeline
UX Researcher
UI/UX Designer
Stakeholder Interviews
User Research
Prototyping
Site Design
Rebranding/Style Tile
Usability Testing
Hi-Fidelity Prototype
Project Management
Figma
Miro
Google Slides
Google Docs
Excel
Zoom
Dennis
Miranda
Suchanya
Alice
2 Week Project
Introduction
1. Stakeholder Interview
In order to learn more about the organization, its goals, and the possible factors affecting the low donation rate, I interviewed the organization’s president and CEO Dan Davis.
Key points of the interview:
Davis told us that the main mission of CFJC is that it aims to encourage local giving, build mission-based partnerships, uphold trust and stewardship, and act as a catalyst for positive change in the community.
He also confirmed that 7-10% of donations are website based.
He told us that his goal for the redesign was to increase that number to 50% of donations to be website-based.
Key Takeaway:
The Stakeholder (CEO Dan Davis) has the goal of increasing website-based donations by 50%
What Are the Goals of CFJC?
Let's ask the CEO!
2. User Interviews
To understand what might prompt a user to donate to an organization’s website, I conducted 5 user interviews
Key Takeaways:
People tend to donate to organizations with a...
1. Clear mission statement
2. Demonstrated impact of donations
3. Trustworthy reputation
4. Interactive donation process
“I align donations with values and Interests.”
“I like success stories and testimonials showcasing impact.”
“I would like to know that my donation will be helpful in some way!”
“I prefer easy and secure online donation options.”
“I want to know where my money is going to. Who did I help?
“I donate if I believe I can make a difference.”
“I love seeing how close we are to achieving a donation goal.”
“I love to donate if the cause is noble.”
So, What Drives People to Donate?
3. Survey
What motivates you to donate through a website?
37.5% of respondents donate and think about donating a few times.
25% of respondents learn about donation campaigns through website updates.
56.3% of respondents visit a website for community information and engagement.
Why do you tend to donate?
“I tend to donate when I feel strongly about a cause and when I feel confident my donation will make an impact.”
“Because the organization is supporting a cause that I care about (would event, subject of donaiton, etc.”
Support a cause I am passionate about
81.3%/16 reps
50%/16 reps
6.3%/16 reps
6.3%/16 reps
6.3%/16 reps
25%/16 reps
Trust in an organization’s mission
Transparency in fund allocation
Tax Benefits
Trust in someone I know that vouches for it
Personal interest
Key Takeaways:
A significant number of respondents are driven to donate because of their passion for a cause and trust in the organization’s mission.
Reasons for donating to an organization’s website include:
1. Desire to make a difference
2. Feeling of satisfaction
3. Supporting causes they care about
In order to get an even better understanding of our users, my team created a survey. We got 16 respondents.
4. Preliminary Usability Testing on Original Website
Key Takeaways:
1. The website lacks purpose clarity, with only 1 in 5 users understanding its goal.
2. Both the homepage and donation page are cluttered and text-heavy, making information hard to find and understand.
3. Navigation to the "Donate Now" page works, but it fails to motivate donations.
We set out to determine if these factors were present on the original website and, if so, how effective they were. Additionally, we assessed the website's usability and overall user experience by testing 5 users.
My contribution included the following tasks:
1. Exploring the homepage to identify the website's main purpose and locate information about the foundation's mission and goals.
2. Locating the "Donate Now" page.
3. Reviewing the "Donate Now" page to assess its effectiveness in inspiring donations.
Results:
1/5 users identified the website's main purpose on the homepage.
5/5 users successfully located the "Donate Now" page.
0/5 users felt inspired to donate after visiting the "Donate Now" page.
CFJC Original “Donate Now” page
CFJC Original Homepage
Quotes from the Usability Test
“Every page is too long and text-heavy. I can’t find the information I need.”
"If I wanted to donate and saw this page, I'd reconsider! it's overwhelming."
“What does all this information on the “Donate Now” page mean?”
“Huh? What’s this website for? The homepage is just cluttered with articles and long text.”
How Well Does the Current Website Align with What Drives Users to Donate?
5. User Persona
I created a User Persona with common threads that were found between interviews, surveys, and further research.
After considering these insights,
What Defines a Typical CFJC Donor?
Design Question:
How might we redesign CFJC’s website to clearly communicate its mission, inspire trust, and streamline the donation process, so users like Ryan feel motivated to contribute and believe that their donations make a meaningful impact on the community?
6. Summarize findings
7. Problem statement
8. Reframing the design question
9. Hypothesized Solution
Homepage
1. Remove news articles
2. Highlight the organization's mission
3. Add a donation tracker to display impact
4. Place a prominent "Donate" button on the homepage
Donate Now page
1. An interactive donation impact calculator
2. Add a progress bar to show collective impact
Main navigation bar
1. Emphasize the "Donate Now" page
Key motivations for donations include a clear mission statement, a trustworthy reputation, and an impact-driven and inspiring donation process.
Donations are driven by passion for a cause and trust in the organization’s mission.
However, the current website faces several usability issues that prevent these expectations and needs from being met.
CFJC’s website captures only 7-10% of donations online.
Looking at the website, it seems to because of the website’s unclear mission statement, uninspiring donation page, and cluttered design. This hinders users from understanding the organization’s goals and mission, having trust in the organization, and making contributions easily.
The above findings helped us further narrow down our problem statement, so we came up with our final design question:
Identifying Issues and Solutions for the Donation Experience
We simplified the steps of the original site, made changes to the existing structure and created a new site map.
To simplify the steps needed for the user to understand the organization’s work and donate, we made the following changes to the site map:
1. We removed the news articles from the homepage and made it it’s own dedicated section. This was done to provide more space to convey the organization’s goals in the landing page.
2. Created a separate page for mission statement.
3. Created a “Get Involved” section to provide users answers to FAQs and inform them of the list of funds the Organization financially supports. This was done to help the user quickly see where the money will be going to.
10. Sitemap
Creating a New Sitemap to Fit the Goals of the Redesign
I visualized through a paper prototype:
1. New main navigation bar that emphasizes the “Donate Now” page
2. Decluttering the homepage to put emphasis on the important parts
3. A donation tracker right on the homepage to show impact
4. Having a “Donate” button right on the homepage
5. Having an interactive impact calculator on the “Donate Now” Page
6. A progress bar on the “Donate Now” page to further show impact
11. Paper sketches
Developing Initial Prototypes to Integrate Hypothesized Solutions into the Redesign
“Donate Now” page is emphasized by a dark circle to draw users to it.
The homepage was cluttered with articles on the organization's achievements. The redesign declutters the page while still highlighting these successes.
This donation tracker (progress bar) effectively shows impact right on the homepage
I designed a donation impact calculator to illustrate the tangible difference each contribution can make.
A prominently placed donation button on the homepage encourages quick and easy contributions.
12. Lo-fi Prototyping
Donate Now Page
Home Page
13. Taking feedback
14. New Challenge
15. Hypothesized solution
Image on the right will have a desk with school supplies that increase as the toggle on the right is adjusted.
This is the toggle that will adjust the amount of school supplies on the desk to the left.
New Donate Now Page
After creating the lo-fi prototype, I sought feedback from members of the design community.
They liked my designs but offered a key piece of feedback:
They pointed out that the impact calculator and progress bar on the "Donate Now" page might not be ideal. Specifically, a low donation of $5 wouldn’t significantly increase the number of kids funded or make a noticeable change in the progress bar.
I realized that I might have made the Donation parts of the website more prominent but I did not figure out how to make every donation seem impactful.
Challenge:
How can I design the impact calculator and progress bar on the 'Donate Now' page to effectively represent the contribution of small donations, ensuring that every donation feels impactful, regardless of size?
Create an impact tracker where an image on the left displays a school desk with supplies, and as the user increases a scroll toggle on the right, more school supplies are added to the desk.
Incorporating Feedback, Identifying New Issues, and Formulating Hypothesized Solutions
I opted for an earthy and fall-like color palette featuring colors like black, dark olive green, dark orange, light orange, and white. These colors match the agricultural land of Indiana and also the plant that symbolizes growth for the organization.
16. Logo Redesign
17. Style Tile
Before
The layout of the original logo is awkward and does not match the new branding I created
As such, I intended to design a more simplistic and monochromatic logo that still illustrated the organization's mission
In this new logo, the three-leafed plant design is preserved.
The dual meaning of the three-leaf plant depicts the organization's mission to "grow" and improve Jackson Country while also representing its largely agricultural land
After
Redesigning the Branding to Match the Goals and Mission of CFJC
18. Hi-fi Prototyping
The Final Redesign:
Screens, Success metrics, and Conclusion
19. Usability Test & Success Metrics
20. Final thoughts
This project aimed to increase the amount of donations made on the Community Foundation of Jackson County’s website. I tested the 5 people and graded their responses.
100% of users were able to find the “Donate Now” page
100% of users were able to find a place to donate
100% of users were able to see how the trackers could show the impact of their donations
This project deepened my understanding of the UI/UX redesign process and honed my design skills.
Throughout the project, I was able to:
1. Identify key issues in the existing design that could be improved.
2. Develop solutions grounded in stakeholder interviews, user research, and feedback.
3. Experience the design iteration process, learning that success often requires multiple attempts.
4. Create a valuable project to showcase in my portfolio!
Future Steps:
1. Refine the functionality of the "Donate Now" impact tracker.
2. Enhance the visual appeal of the school supplies, making them more dynamic and varied.
Disclaimer: This project was part of a student bootcamp focused on refining our website redesign skills. The concepts in this case study were conceptual exercises and were not implemented on the live website. However, they were shared with the stakeholder to offer inspiration and potential design directions.
The Community Foundation of
Jackson County Redesign
Creating a Web platform with an enhanced donation experience.
Overview
Key Questions & Goals
My Role
Jackson County is a community in Indiana and it faces a huge challenge:
A college degree attainment rate of just 1 in 4 adults.
The Community Foundation of Jackson County (CFJC) is determined to make a difference, distributing $1 million annually in grants and scholarships. Yet, despite their efforts, only 7-10% of donations make their way through their website
This led me to the question:
What are the key factors contributing to the low donation rate of 7-10% on the organization’s website?
and to define the primary goal of the redesign:
How can I revamp CFJC’s website to boost online donations?
My role involved leading user research, spearheading the rebranding of the organization's website, and redesigning key sections related to donations. This included the 'Donate Now' page and other various data visualizations. My team members concentrated on other areas of the website.
