Case Study
Designing a Non-Profit Website to Increase Credibility and Fundraising Opportunities
My Role - Independent UX consultant with full responsibility for:
UX research & design
Website build & testing
Social Media Marketing
Content Creation
Data & Analytics
Client - PRHeSS, a nonprofit organization based in the USA running healthcare & community development projects in Sierra Leone
Project Goal - Redesign the existing charity website to be more user-friendly, to promote brand credibility and encourage donations from users
Time frame - Part time for 3 months
Project Summary
Pan African Health & Social Service (PRHeSS) is a non-profit organisation based in the USA and operates healthcare & community development projects in Sierra Leone. The existing website was neglected, outdated and in need of a complete redesign. Google Analytics showed a high exit rate and lack of engagement with the site, and board members were embarrassed to share the site when applying for grants or asking for donations.
This project presented many challenges due to a lack of financial and human resource. PRHeSS is run by volunteers and all resources are focused on the day to day running of a hospital and fundraising activities. There was no dedicated person to direct questions to and no defined goals or scope for the project.
These challenges were an opportunity for me to make a meaningful impact at PRHeSS. I was able to define my own role and project scope, apply multiple cross-disciplinary skill sets and advance my personal development by learning to build a website in Squarespace.
Over the course of three months, I conducted research interviews to understand the needs of the charity, made presentations to the board on social media strategy, designed and built a new website, rebranded the website and social media pages, and created content for the website and social media campaigns.
The outcome was an objective success with large reductions in bounce and exit rates and a significant increase in both the number of donations and donation amounts. The board members at PRHeSS confirmed that they were excited to share the website on future grant applications.
“Our website looks terrible. We really need something better.”
Project Brief
Challenges
This project came with multiple challenges, all of which influenced my
approach and planning:
Learning Squarespace from scratch
Limitations of Squarespace
High ambiguity
No financial resource
Limited availability of client
Time zone differences
Lack of content
No technical / marketing literacy at the client end
Client emotional attachment to non user-friendly elements
Approach
Because the project brief was broad and ambiguous I decided to start with a UX audit of the existing site, a competitor analysis to understand NGO industry standards and to interview some key volunteers to understand the goals of the organisation and what kinds of people donate or support PRHeSS today.
I only had 12 weeks to work part time on this project and so my plan was to use the discovery to quickly design and build an MVP website that could be tested with users later down the line. In the meantime, I could use Google Analytics to objectively measure the impact of the new site and view patterns in user behaviour over time.
I broke the project out into five stages:
UX Audit
Competitor Analysis
Define website goals
Design and build the site
Measure the impact of the changes
UX Audit
I conducted a UX audit based around Jacob Nielsen’s usability heuristics.
The existing website was built using Squarespace so UX heuristics such as system status or user control are standardised or limited in terms of changes that can be made.
However, significant improvements were possible and necessary for aesthetics, consistency & standards, and error prevention. Additionally, the mobile experience required a lot of attention.
I discovered a critical issue across all devices; the donation process involved a lot of friction which at best, disincentivised users from donating and at worst, meant that some users were unable to complete the donation process at all.
Screenshot of the landing page on a desktop device
Donation Journey
There were a number of barriers to making a donation via the website. All fields were set to required and it was impossible to donate unless the user had a USA phone number and zip code.
Google Analytics showed more than 20% of site visitors come from outside the US so this was a significant missed opportunity for PRHeSS.
Users were forced to hand over personal information and were not allowed to donate anonymously. There were no legal or practical reasons for this friction and nothing was being done with the information.
Screenshots of the donation journey on a mobile device
Information Architecture
The site map structure was confusing and did not meet good UX standards. Around half of the top-level pages could be considered blog posts and the donate button led the user through multiple pages before they could actually donate. Google Analytics showed high bounce and exit rates on all pages and I considered site navigation as a possible cause.
Site map of the existing website
Total online presence
During the UX audit, it was impossible to ignore PRHeSS’ online presence beyond the website. Social media is an essential tool for non-profit organisations. Charities are highly discoverable when existing supporters share information and fundraisers on Facebook and Instagram.
There was a surprisingly low volume of visits to the website from a search engine and this was because Google returned zero results when searching for PRHeSS. Users needed to Google the full organisation name (Pan-African Rural Health & Social Services) to find the PRHeSS website.
Once on the website, the URL did not match the organisation's name leading to doubt about being in the right place. Furthermore, neither the Facebook or Instagram page names matched the organisation name. This made it very difficult to find the PRHeSS social media accounts or be sure that they were the right ones when managing to find them.
Screenshots showing how PRHeSS appears in Google search & social media pages
Branding & SEO
Overall, PRHeSS was lacking a cohesive brand identity. Not only was the organisation name different across the website and social media, but the imagery, colours and fonts were all different. On the existing site, the text appeared in a variety of sizes and cases, and much of the text was misaligned. The website didn’t have any links to social media which made it harder for users to share content or to find the correct accounts.
This lack of consistent brand identity and formatting created an unprofessional impression and was potentially doing damage to PRHeSS’ image as a trustworthy and reputable organisation.
Screenshots of different pages in the existing website on a desktop device
Quotes by PRHeSS board members about the existing landing page
The Five Second Test
After completing a UX audit, I conducted a 5 second test with volunteers working at PRHeSS. The purpose was to determine how well the current website reflected the core purpose and vision of the organisation.
Asking volunteers to look at the website landing page for 5 seconds and then tell me what they recall allowed me to:
Help educate the client about how users experience the website and brand
Quickly assess the extent of change that would be needed on the landing page
I conducted the test with board members at their bi-weekly meeting and was able to generate productive discussions about the logo, tagline, brand identity and purpose of the website and the charity itself.
These discussions helped to reduce some of the blue-sky ambiguity I was starting with and validated my hypothesis that the existing site does not quickly convey the purpose of PRHeSS and is not visually appealing.
Competitor Analysis
I assessed three leading NGOs working in Africa with a similar purpose to PRHeSS.
Key elements that these websites have in common:
A large welcoming image at the top of the landing page which is relevant to their cause and gives an idea of the people they are helping. The images immediately build an emotional connection.
A bold, relatable statement that quickly communicates what the charity is about.
Maximum of five site pages
A single page to find out the latest news (Blog / Journal / News)
A subtle/unobtrusive logo in the top left corner. The focus is on the purpose, not the charity name.
All of these sites enable to user to:
Quickly understand what the charity does within the first five seconds
Quickly see how to donate
Quickly see where to go for the latest news
None of these sites
Have links to social media
A clear way of getting in contact / asking a question
Screenshots from competitor websites
Defining the users
I attended three board meetings and had one to one video calls with four board members to find out how they raise funds and what kinds of people support PRHeSS. I also looked at their Facebook and Instagram followers to understand the age range, locations and behaviour of their supporters on social media. Finally, I used Google Analytics to establish the location and devices of visitors to their website.
Most users come to the website via a desktop device and are located in the United States. However, over 20% of visitors come from outside the US.
I used these data points to create four user personas to keep in mind during the project.
Squarespace analytics showing which devices site visitors use
Squarespace analytics showing where site visitors come from
User personas for the PRHeSS website and social media
Defining the problem to be solved
I formulated two problem statements to reflect the balance of the organisation’s needs and the needs of the users:
Problem Statement - PRHeSS
PRHeSS needs a way to promote their work and increase donations and support for their organisation.
Without a credible website or social media presence, it is difficult to compete with other non-profit organisations for donations or successfully apply for grants
We will know this to be true when we see an increase in website visits, social media engagement and donations to PRHeSS.
Problem Statement - Users
PRHeSS supporters want to easily find the PRHeSS website and follow social media pages, they want to easily donate to campaigns they are inspired by and get news about how their support has had an impact.
Without a credible website or consistent naming and branding across platforms, or the removal of USA specific fields at the point of making a donation, it is difficult for users to navigate to the website or social media pages, it is difficult to trust PRHeSS and it is impossible for non-USA supporters to make donations online.
We will know this to be true when we see an increase in website visits, social media engagement and donations to PRHeSS.
Quantitative Insights
I gained insight into user behaviour by reviewing the website analytics. These stats formed a baseline measurement for evaluating success later on.
Donations
48 donations were made through the website in the 3 years before I began this project. The average donation amount was quite high at $100 and the number of donations peaked twice a year in June and December. I anticipated that a more aesthetically pleasing user-friendly website would encourage a higher number of donations.
Squarespace data showing total donations via the website by month in 2019 - 2021
Engagement
As the bounce rate was high and the time spent on page fairly low, I inferred that the content was not engaging visitors. Most visitors viewed the home page but less than half explored other pages. Most visitors who explored beyond the home page went to the about page and then exited from there.
Squarespace analytics showing user behaviour over the previous three years
Traffic
Although unique visitors increased by 2% in 2021 the total number of visitors was quite low. Increasing traffic by just 1% would demonstrate increased awareness.
Squarespace analytics showing user behaviour over the previous three years
Recommendations
Based on the findings of the UX audit, the 5 second test, Web Analytics and the interviews with charity volunteers I compiled a list of recommendations to be reviewed by the board.
| Recommendations |
|---|
| Review the required field settings in the donation form and remove phone and zip as essential fields so that non US users can donate |
| Add social media icons on the website so that users have a choice of places to follow or donate |
| Review the organisation name across all platforms and make consistent. Optimise SEO so that googling PRHeSS brings users to the website or correct social media pages |
| Decide on a style guide that represents the brand. Apply this to the website and social media. This should include a colour scheme, fonts and font size. |
| Agree on a unique selling point (USP) that positions why PRHeSS is worth supporting compared to so many other charities doing similar things. |
| Decide on a single tagline that succinctly communicates PRHeSS’s USP to someone as soon as they read it. |
| Review the page structure and condense into fewer pages with more meaningful labels. Design the site around the key actions users want to take when they come to the website |
| Align text and images to the left so that it is easier for users to read and is tidy, creating a more professional and pleasing impression. |
| Place a clear USP on the landing page so that it is easy for users to understand what value PRHeSS brings to them (Eg “We are transforming health care in West Africa”) |
| Add ‘Social Proof’ eg testimonials, success stories, press releases so that users feel safe, secure and inspired |
| Show greater male / female diversity in the imagery as most current images show only men |
| Create a visually appealing logo and use it consistently across the site and on any public communications materials. The logo should be able to clearly communicate the purpose of the charity through a clean and memorable image. |
Decisions
I attended 3 board meetings where I was able to present to members the importance of sharing on social media and talk through the recommendations I arrived at after doing the UX audit and competitor analysis.
It was agreed not to implement: Create a visually appealing logo and use it consistently across the site and on any public communications materials. The logo should be able to clearly communicate the purpose of the charity through a clean and memorable image.
It was agreed to partially implement: Make the organisation name across all platforms consistent & Review the required field settings in the donation form and remove phone and zip as essential fields so that non US users can donate
I was free to run with everything else as I saw fit.
A new challenge emerged here regarding content. There was no resource to produce new content and so we agreed that I would edit and refine the existing content and make it simple for future content providers to post in a blog on the site.
Information Architecture
I created a new site map that combined the extraneous pages into a blog. It was important to the founder that there was a dedicated space to honour people and organisations who have made significant contributions to the charity. I combined these into a page called ‘Our People’. This opened up the opportunity to make additional revenue by selling advertising space to sponsors.
I added social media links in the website header so it is easy for users to follow PRHeSS. While many other established charities offer a newsletter sign up there is no resource to manage that. Therefore, it is better to acquire a social media following as it is easy to add events and news there.
Also, with the improved page structure and updated UI, it is much easier to navigate and donate on mobile devices.
Before and after sitemaps for the original and new websites
Screenshots of the site menu on the original website compared to the new website on mobile device
Donation Journey
It was important for users to be able to easily donate so I created prominent call-to-action buttons on the front page. Clicking on the donate button takes users directly to the donate page without asking for additional information and anyone from around the world can donate.
I also wanted to help users visualize the impact of their financial support so added tangible examples of how specific amounts would be used. I set up three specific options to minimise choice paralysis and offered the option of a repeat donation.
Only 3 clicks are needed before entering credit card details.
The new donation journey
Branding and SEO
One of the volunteers at PRHeSS is a photographer. He had a beautiful portfolio of images from Sierra Leone so I used these to create a brand. I developed a colour palette using colours that commonly appear in his photos to create a brand identity across the website and social media. I updated the social media pages and SEO to all contain the name PRHeSS. This meant that anyone searching for PRHeSS on social media or Google would easily be able to find the NGO and feel confident they are in the correct place.
I deliberately used photos with people looking into the camera to give a sense of emotional connection with the viewer. And as a core value of PRHeSS is to provide hope and dignity to the people of Sierra Leone, I wanted to reflect a dignified image and not perpetuate stereotypes of African poverty.
Examples of new brand colours based on existing photographs
Results of the first 30 days
Engagement
Within the first 30 days, the bounce rate had reduced from 77% to 48% and the exit rate had decreased from 52% to 31%. This suggests an increase in engagement with the website content. The time spent on each page has reduced too but this is likely to be because there is not much content on the site yet.
Donations
In the first 30 days, there were 7 donations made through the website, two of which were from outside the USA. This is a higher number of donations than had been made through the rest of the year. So the donation frequency more than doubled and the average donation increased by 10% from $100 to $110.
New bounce rate shown in Squarespace analytics
Squarespace data showing donations made in the first week after the new website went live
Agusta Olafsdottir, PRHeSS Board Member
“PRHeSS is forever grateful to Mel for helping us promote our work. Pan-African Rural Health and Social Services (PRHeSS) is a non-profit humanitarian organisation running a hospital and supporting local agriculture in rural Sierra Leone.
In 2021 we hired Mel based on a referral to completely redesign our website and social media platform as we felt it had not reached its full potential. As PRHeSS are dependent on donations and public support, having a good social media presence is of the utmost importance.
Mel completely changed our presence on social media, making it much more user-friendly and accessible; thereby making our fundraising efforts more successful.
She also met with individual board members to advise them on how they could make an impact through their own social media. Her skill and knowledge in this area is impressive. Her positivity, focus and wonderful personality made working with her a highly enjoyable experience. When her temporary assignment was completed, she left us with a blueprint on how to move forward and has been available for support. We are forever grateful for her help and are happy to give her our highest recommendations.”