The Africa In Me

Website redesign that helps users to understand the mission of the organization effectively and attracts more users

Desktop - 1.png
 

Challenge

Role

Duration

Deliverable

The users could not find the information about the organization and its mission so they could not trust to donate. 
Interview, Survey, Heuristic evaluation, Competitive analysis, Usability test
Team leader,
User researcher, Interaction designer

 
Three weeks

Outcome

40% increase in the users' engagement

Note: This is a real project I did while working in the organization. However, I have omitted or blurred confidential information/ images in this case study to comply with my non-disclosure agreement. The information presented here is my own and does not necessarily reflect the views of the organization.

OVERVIEW

AFIM is a nonprofit organization established by an inspiring woman who is originally from Africa. The organization provides food and job security for the less privileged families in  4 counties in Africa. As one of the volunteer's family, my ambition was to help AFIM grow and raise more users.
Having the goal, I interviewed people who donate online and I discovered the current homepage was not effective and efficient enough in showing the mission and goals of the organization. So  I took a step and suggested redesigning the website for our first anniversary. This is where my team and I started the process.

 

As one of the volunteers' family, my ambition was to have an impact and better user experience of AFIM.

RESEARCH PROCESS

DISCOVER

DEFINE

IDEATION

DELIVER

Interview

Usability test

Competitive analysis

Problem & Solution 

Card sorting

Sitemap

Sketches

Wireframe

Iteration

Prototype 

Usability test

DISCOVER

Usability Test & Interview

To learn more about the users and uncover their pain points, we conducted a usability test with ten users on the current website. Observing the users during the test, and talking with them after finishing the requested task, we find:

  • The inconsistency and unprofessional design discourage the users

  • The homepage is lacking enough information about the organization and donation process

  • The unclear information confuses users where and how the money used

  • The confusion consequently stops them from trusting the organization

  • The users have to spend a long time applying for the volunteer opportunities

Simple Purple and White Instructional Keynote Presentation.png

What users revealed during the interview

Competitive Analysis

For the next step, doing a thorough observation of the 10 similar websites, we summarized the results:

  • The common humanized language used in the navbar

  • Using phrases "Who We Are" and "What We Do" to talk about the mission of the organization

  • The importance of having volunteer buttuns and on the homepage

  • The need for having a search bar on the global bar

DEFINE

Solution

The team analyzed the result of the two research and we made a list of goals that we decided to focus on: ​

  • Redesigning the homepage and giving more information about the organization to make it trustworthy

  • Improving information architecture to make the navigation smoother

  • Providing information about the founder (to encourage the users)

  • Designing a friendly way of joining as a volunteer 

  • Adding a blog to make the site discoverable

Card Sorting

To make navigation easier for the users, my team and I worked on architecture information and made the sitemap

ok 3.JPG

BEFORE CARD SORTING

AFTER CARD SORTING

Desktop - 2 (3).png

IDEATION

Sketch

Moving forward, we prepared different sketches and worked through them to reach the final version. During the process, we continued reviewing the users' paint points and the organization’s mission to make sure the final design is creating a better user experience.

Frame 4 (3).png

Sample of the first sketch our team made

DELIVER

Wireframe

Home Page: the sections that speaks about the AFIM mission

Homepage okk.jpg

Volunteer Page: The users can apply for volunteer opportunities with a short process on one page.

final get involved blured.png
The impact

Before and after the redesign, I conducted a usability test with ten users. As shown below, the time of applying as a volunteer significantly reduced. 10 out of the ten participants could find easily what they looking for and 8 of them indicated they are happy with the website's new appearance. 

As the result of the redesign, in about 4 months we had a 40% increase in the user's engagement. 

Simple Purple and White Instructional Keynote Presentation (2).png

BEFORE

Frame 7.png

AFTER

Frame 8 (1).png
What I Learned

Unlashing ideas for finding solutions

It was the first time in my work that I unlashed my imagination for finding a solution. Before jumping to the design part, I did immerse research about my users. It was important to learn what matters for them and what keeps them there. The result of the research the work showed how much it is important to put the users in the center. We always should make something that solves their real problem not what we assume about them.


Leadership opportunity

Working in a nonprofit team, gave me opportunities to work on the skills we need in design as a collaboration career.  I took one step further as a leader of a team of two people. It was challenging and I experienced hard moments at first but eventually, I learned how to find the capacity of every individual and focus on what we can do as a team rather than pointing our weaknesses.