Kidney Clinics and Research
Centers International (KCRCI)
Responsive Web Design -
Redesign and Rebranding for International Non-Profit Organization
Project Role: UX Designer - Team: Solo Project - Duration: 4 weeks, 80 hours - Tools: Figma, Adobe Illustrator
Background
Kidney Clinics and Research Centers International Inc. (KCRCI) is a non-profit organization whose purpose is to improve the quality of dialysis treatment and increase the availability of dialysis centers in third-world countries catering to an ever-increasing number of patients with Stage 5 Chronic Kidney Disease (CKD).
​
KCRCI offers multiple dialysis machines and dialysis equipment, such as water treatment, water storage, and reuse machines. Their services include dialysis machine installation and maintenance as well installation for water treatment systems.
​
KCRCI currently has partnered with clinics in India and Ghana. Their clinics have provided more than 80,000 treatments at a subsidized cost to patients. They hope to establish more clinics in these countries and other countries in the future.
Project Overview
KCRCI wants to increase the amount of donations they receive. As a non-profit organization, they rely heavily on donations to sustain their current projects and expand into new projects. The KCRCI founders have asked for a website re-design and new branding in hopes of attracting new donors.
​
The main objective of this project is to create a responsive website where KCRCI can inform the public about their efforts to create dialysis clinics to curb chronic kidney disease in third-world countries and entice people to donate to their cause better than their current non-responsive website does at present. This includes redeveloping their brand identity and updating the logo design to better portray modernity and professionalism. This project has a 1month timeline. I am the sole UX/UI designer for this project.
Research (1 week) - Primary/Secondary Research, Competitive Analysis & Persona Development
To develop a new site for KCRCI, we needed to define our research goal and determine questions that need to be answered.
​
Goal:
Gain insight on why the organization’s mission is so important and determine how to translate that information into good design that will inspire people to make donations to their cause.
​
Questions:
1. What is KCRCI’s mission? How does KCRCI operate?
2. Why should people care about their mission?
3. Who should the website’s target audience be to solicit donations?
4. Do the members of KCRCI have any thoughts about new branding/aesthetic?
​
​I began with secondary market research to better understand the charitable sector. I chose the following research methods they allow me to understand charitable giving in an efficient manner.
1. Market Research - to understand more about non-profits and how they inspire donations
2. Competitor Analysis – to analyze the strengths and weaknesses of direct competitors (other healthcare non- profits) and indirect competitors (non-profits in other industries)
​
Here are some trends regarding charitable giving:
1. Charitable giving continued its upward trend in 2017, as an estimated $410.02 billion was given to charitable causes.
2. In 2017, the majority of that giving came from individuals. Specifically, individuals gave $286.65 billion, accounting for 70% of all giving and representing a 3.0% increase over 2016.
3. Health charities experienced an increase of 15.5% to $38.27 billion (9% of all donations) - All data is the property of Giving USA 2018, the Annual Report on Philanthropy.
4. 69% of US population gives (64% of US donations are from women).
5. 30% annual giving occurs in December.
6. Greatest Gen give on average 25% more often than younger generations. Boomers are most likely to make recurring donations on a monthly, quarterly or yearly basis Gen Xers are most likely to fundraise on behalf of a cause, make a pledge, and volunteer their time to an organization. Millennials are most likely to contribute to work sponsored initiatives, donate via mobile and watch online videos before making a gift. Social Media is effective in gaining donors from Millennial, Gen X and Baby Boomers.
7. Motivators for donors: mission-driven, trust, get to see impact, have personal connection with cause, want to be a part of something, caught their attention, tax benefits, giving feels good, easier to give to one person than group, when impact of gift is described.
8. Major turn off for donors - they don’t know where their money is going. - https://nonprofitssource.com/online- giving-statistics/
​
Main takeaways:
1. Charitable giving is increasing every year.
2. Older generations tend to give more money whereas younger generations tend to volunteer time more.
3. Women tend to give more than men.
4. People tend to give more if they have a personal connection with cause.
5. People want a say in how their donated money is used.
​
​
My competitive analysis includes direct competitors (Kidney foundations and organizations that support kidney disease-related efforts) and indirect competitors (other healthcare organizations and other charitable organizations).
Competitor Analysis Key Takeaways: ​
1. Easy to navigate UI and clear CTA to donate is important.
2. Stories make cause more relatable
3. Donors like to choose which projects their money is going to.
​
My primary research involved conducting remote interviews with members of KCRCI as they will be the ones to best help me understand the organization's specific cause.
​
View Interview Analysis (Research Debrief)
​
Insights from the in-person interviews (research questions revisited):
1. What is KCRCI’s mission? How does KCRCI operate?
•KCRCI’s mission is to help vulnerable populations who are burdened by kidney disease by providing building clinics, providing equipment and logistical assistance to help meet treatment need.
•KCRCI saw an opportunity for humanitarian efforts by using its personnel for their expertise along with refurbished equipment to set up dialysis clinics with the highest standard of care in third world countries.
​
2. Why should people care about their mission?
•Although kidney disease is not as emotionally intriguing as other diseases, it is complex and devastating.
•The physical and financial burden of kidney disease is especially great for those vulnerable populations in countries without enough resources.
•Worthwhile supporting since donations can provide hope for so many affected individuals and families.
​
3. Who should the website’s target audience be to solicit donations?
•Those who have been impacted by kidney disease (patients, family members, family friends)
•People who want to support family communities from abroad
•Older populations or anyone who wants to donate excess money to worthy cause
​
4. Do the members of KCRCI have any thoughts about new branding/aesthetic?
•Cool color aesthetic perhaps blue
•Many Kidney Disease organizations use orange – perhaps have some orange in design
​
The persona (target customer) developed as a result of the research is charitable (wants to give back to home country/community), can afford to donate, and possibly someone who is knowledgeable about the cause or knows someone who can benefit.
​
From a design perspective, it is important to have a UI experience that is informative and easily able to accept donations.
Information Architecture (1 day) - Sitemap
Sitemap:
The following sitemap shows the content layout of the newly designed KCRCI website. The web pages to be included are based off of researching competitor websites and the current KCRCI website. The simplicity of the site structure I believe will make the site more approachable to visitors.
Interaction Design (1.5 weeks) - Wireframe development & UI Requirements Definition
With a sitemap solidified, I created a UI requirements document to highlight the different screens, features and interactions that need to exist on the website.
​
​
Based on the information thus far, I created wireframes of various screens that will be featured on the website. There were several iterations of these wireframes. The annotated wireframes you see below were updated based on three rounds of feedback.
Much of the design includes many great features that come from various competitor sites. Below are some notable features.
​
•A standard top navigation bar.
•A standard footer section that includes social media information.
•Clear CTAs on every page.
•A carousel feature on the Clinics Page to highlight each clinic.
•Donation page has familiar design elements to make it intuitive how to make donations.
•Contact page has a standard contact form design to make it easy for site visitors to contact the organization.
UI Design (1 week) - Branding/Logo Design, Style Tile & UI Kit
Running in tandem with wireframe development, I started to develop new branding. After going through several design and color combination ideas, I went with a simple design of an orange kidney and the organization's acronym. The logo design with the kidney indicates what KCRCI’s focus is. The orange color is very common among other kidney issue focused organizations and therefore decided to include it in the branding. The color blue was chosen since it is a color that conveys reputability and is very common among healthcare organizations. The simple design is meant to portray professionalism and to be memorable.
.png)
Once I created a the logo and decided on branding aesthetic, I developed a style tile to provide a sense of what the website will look like once the UI design is applied.
With the brand elements designed, I developed a UI Kit, pulling components from the wireframes and aligning them with the new KCRCI brand aesthetic.
Iteration and Implementation (1 week) - Prototyping, Usability Testing, Responsive Design
To make sure KCRCI's website was intuitive to use and made sense based on the project's goals, I created a mid-fidelity prototype in Figma and conducted 3 usability tests. With these tests (1in-preson, 2 remote), I was able to observe how participants navigated through the different pages, how they engaged (or didn't) with the web design, and whether they had any feedback on the design.
​
The results of the usability tests gave valuable insight into which features needed to be updated, re-organized and highlighted. I received feedback regarding the design layout, buttons and text features. After receiving feedback and with a couple more design iterations,
​
I updated the prototype with the UI components applied.
​
​
I also created responsive designs to showcase how the website's desktop design can be applied to the mobile screen (tablet design and desktop designs are identical so tablet size is not included here).
.png)
.png)
.png)
.png)
Next Steps
Now that the design has been through a few more iterations, I can conduct additional usability tests and make UI improvements where necessary before handing it off to a development team.
Finding and Reflections
Designing this website for a charity was challenging and rewarding. It was an honor to design a website for a worthy cause. Through this experience, I learned more about what motivate people to donate and how design can help compel people to do so.
​
My favorite aspect of this website creation was the application of the UI design. It was exciting for me to see the vision in my mind come to life.
​
The biggest challenge for me was getting the stories to make the cause sound more compelling to the public. I received a lot of information that I incorporated into the design which I believe to be clean, approachable and effective. If I had to do it again or had more time for this project, I would try to speak with more people from the organization to see if there are any patient stories that would be intriguing. This organization, I found, works more with the administrators and staff who develop and run clinics and works less with the actual patients; so there just may not be as many patient stories to share.
I hope to use this experience as a springboard for working on future projects either in the healthcare or the non-profit space.