"Mock-up of the migrant voice charity mobile site using Figma and Google material design system" migrantvoice.org
Time to complete: 48 hours
I wanted to redesign the UI of the charity website: migrant voice. I conducted a whiteboard exercise using fictional personas and business goals, to achieve a figma mock-up deliverable.
- Charity: Migrant Voice
- Interface: Mobile UI (Android)
- Methodology: Mobile first, progressive enhancement, content first
- Goal: To rework the IA and visual look/feel of the existing site
- Good typographical layout
- Visual balance
- Good colour theory
- bring up to web standards
- Make accessible meeting minimum AA standards
- Represent brand
- Staff: researchers, content creators, admin, volunteers
- Review existing web product: pros & cons
- Produce sitemap
- Conduct competitor analysis of successful charity sites
1) HMW brainstorming
- How might we…get new visitors to the site, emotionally connected to the MV stories?
- How might we…get more volunteers into the service and retain them?
- How might we…go about answering volunteers questions?
- How might we…outline the benefits/challenges of migrants telling their stories?
- How might we...increase our donations?
I wanted to get to the root cause of the problem, here I used the 5W1H technique
The current website has a low number of regular donations
- Why are the donations low? Because nobody has heard of MV
- Why haven’t they heard of MV? Because it isn't advertised.
- Why is it not advertised? They may not have the funds
- Why don’t they funds? Their digital donation funnel is not effective.
- Why is the funnel so ineffective? Users may not know the reason for donating to this cause. The donation button is positioned poorly. The donate button does not have a hierarchy against other buttons. The external go fund me page shows donations so far - causing a possible negative effect due to low donations so far - anchoring bias (first impression bias).
The charity needs an increase in volunteers
- Why don’t more people volunteer with the service? Maybe they gave up on the process.
- Why did they give up on the process? They failed to complete their signing up task.
- Why couldn’t they complete their task? They couldn’t locate where to start the journey.
- Why couldn’t they locate where to start their journey? Because it wasn’t intuitive enough to find information on how to volunteer.
- Why wasn't it intuitive? Because the sales funnel did not appear to match up with the user journey and the timing of the CTA buttons were hidden from the users.
What problems are we trying to solve?
- Innefective sales flow
- Not enough volunteers to drive content
- Why exactly is the product important?
- What impact does it have on society? (emotional)
- How does the product benefit users?
- How will the improvement support their vision? (How can we also measure it)
I then conducted an accessibility audit on the existing site
- TCT - Time it takes for migrant users to complete their task of making contact with an MV staff member
- Engagement - Time on page reading/watching content. Shares through social media. Quantity of comments
- Error rates - Sought help via search/contact/FAQ methods. Went the wrong direction
- TCR - Task completion rate for registering as a volunteer
- Conversion - % who register
- NPS - Recommendations to other students/friends/colleagues
IF the solutions are successful, we'll see:
- An increase in volunteers
- Improved NPS scores for migrant user group