Design Sprint
Young Roots: website redesign and flow optimisation
Using an agile design sprint framework to analyse and encourage participation in the London based charity's 'be 1 in 100' campaign.
Role
UX Research, UX Design, and Lead UI Designer
Research Methods
Desk Research, User Interviews, Usability Testing, Design Prioritisation Matrix
Tools
Figma, FigJam, Zoom, Otta
Timeframe
1 week
Objective
To increase awareness of Young Roots' goal to secure 100 consistent monthly donors by year's end, we will design a more appealing and accessible donation process to help reach and exceed this target.
The Challenge
The charity's website currently presents a significant barrier to achieving this objective due to insufficient information and a confusing user journey.
Key Goals
-
Clearly communicate Young Roots' mission and the value of monthly giving.
-
Create an easy and engaging donation process.
-
Boost website traffic and engagement for the "Be 1 in 100" campaign.
About Young Roots
"Young Roots is a London-based charity dedicated to supporting young refugees and asylum seekers. In 2022, they provided vital services to over 873 young people from 45 countries, including casework, legal aid, therapeutic support, and English language mentorship. To sustain these crucial programs, Young Roots launched the "Be 1 in 100" campaign in 2023. This initiative aims to build a community of 100 monthly donors who will provide consistent and reliable support, empowering the charity to continue its vital work in helping young refugees rebuild their lives and thrive in their new communities."
The Process
Design Sprint Framework
Our design team were asked to use this framework that spans over 5 days. The fifth day consisting of presentations.
Map & Research
Sketch & Decide
Build
Test & Iterate
Audit
Competitor Analysis
Interview Insights
How Might We?
User Persona
Crazy 8's
Storyboard
Wireframes
Initial Hi-fi Prototype
UI Library
User Testing Findings
Final Hi-fi Prototype
Map & Research
Auditing the current website
Click here for Young Roots' website
Clarity
The website's primary purpose and the charity's core mission are not immediately apparent to visitors. Users may need to navigate through substantial amounts of content to understand the full scope of Young Roots' work.
Information Architecture
Key information, such as impactful stories, program highlights, and impact metrics, are not prominently displayed, making it difficult for visitors to quickly grasp the charity's mission and achievements.
User Experience
Understanding the full breadth of Young Roots' work requires navigating through numerous pages, potentially creating a disjointed user experience.
Donation Flow
While visually appealing, the donation page prioritizes one-time gifts, inadvertently de-emphasizing the importance of recurring monthly donations.
Payment Page
The payment page lacks the necessary attention to detail and professional design, potentially creating a less than ideal user experience during this critical stage of the donation process.
Competitor Analysis
This analysis examines the strengths and weaknesses of both direct and indirect competitors within the non-profit sector. By analysing their websites and donation processes, we identified key areas of success, such as clear messaging, streamlined donation flows, and user-friendly payment options. These insights will inform the design and development of a more effective and engaging online fundraising strategy for Young Roots.
Direct Competitors
Key Strengths:
-
Employ impactful and concise messaging upfront, effectively communicating their mission, impact, and call to action.
-
Clearly prioritise monthly giving with streamlined pathways for potential donors to learn more and contribute.
​
Key Takeaways:
-
Focus on a clear and compelling initial message that resonates with potential supporters.
-
Prioritise monthly giving options and create a seamless user journey for recurring donations.
Indirect Competitors
Key Strengths:
-
Offer user-friendly payment options, such as fast payment gateways and autofill features, minimising user friction.
-
Simplify the donation process by incorporating multiple-choice options and minimising required user input.
-
Leverage visually engaging and interactive elements to create a more intuitive and enjoyable donation experience.
​
Key Takeaways:
-
Streamline the donation process by incorporating user-friendly payment options and minimising data entry.
-
Enhance the user experience with visually appealing and interactive design elements.
Interview Insights
Our research focused on understanding the motivations and barriers to giving among young people. We recognised the existing donor base primarily consists of older individuals and aimed to engage a younger demographic.
Through interviews, we sought to understand young people's values, philanthropic interests, and the factors that influence their giving decisions.
Key Findings
Based on our interviews, three key themes emerged. These findings provide valuable insights into the motivations and preferences of young donors, informing our strategy to engage this critical demographic.
Simplified Donation Process
Young people expressed a strong preference for user-friendly and streamlined donation processes. Simplifying the giving experience is crucial for increasing engagement and reducing friction.
Enhanced Transparency
Transparency is paramount. Young donors desire clear information about how their contributions are used and the specific impact they are having on the beneficiaries.
Shifting the Focus to Proactive Giving
Our research revealed that young people rarely actively seek out charities to donate to. Their giving behaviour is often triggered by external factors, such as peer-to-peer fundraising or encountering a specific cause that resonates with them.
How Might We increase awareness of Young Roots’ current goal of creating a community of 100 monthly donors in 2023 and make the donation process more engaging for potential donors to achieve (and surpass) their target?
User Persona
By synthesising the identified pain points, goals, and user behaviours, we developed a user persona that embodies the core characteristics of our target audience in a more relatable and tangible way.
Sketch & Define
Developing Solutions
Sketching - Crazy 8s
To kickstart the design process, we utilised the Crazy 8s method to accelerate this phase of the design process and encourage exploration.
Crazy 8s proved to be a valuable tool, prompting us to think beyond initial assumptions and uncover a broader spectrum of potential solutions.
This collaborative exercise not only stimulated creative thinking but also fostered a positive team dynamic as we shared and discussed the diverse range of ideas generated.
Story Board
By visualising the user's interactions and emotions at each step, I created UX storyboard to facilitate a shared understanding within the team, leading to more effective and user-centred design decisions.
This visual narrative helped us understand the user’s (aka. Mark’s) perspective, anticipate potential challenges, and identify areas for improvement before investing significant time and resources in development.
Build
Wireframing
These skeletal representations prioritise the placement of essential elements like buttons, text fields, and navigation, and the website’s flow ensuring a shared understanding of the product's structure and functionality among the prototyping/development team.
Example of our landing page wireframe
Example of our landing page wireframe
UI Library
To enhance efficiency and maintain design consistency, we created a library of reusable design elements such as icons, buttons, and cards. This library empowers both developers and designers by providing readily available components that adhere to the established design system.
Initial Prototype
We conducted a pilot test of our solution with a select group of users.
Test & Iterate
User Testing
We conducted user testing with 5 participants, revealing the following key findings:
Iterate
Final Prototype
An accessible and intuitive platform that provides donors with a seamless experience, enabling them to easily understand the impact of their donations, contribute effortlessly, and customise their level of engagement with the charity.
Mission Driven Focus
Clearly and immediately communicate the charity's mission, goals, and impact to potential donors.
Enhanced Transparency
Provide readily accessible information about the charity's work, ensuring donors can easily learn more about their impact and how their contributions are used.
Streamlined Donation Experience
Clearly demonstrate the impact of donations and how they will be used.
Simplify the donation process by incorporating multiple-choice options to minimise input.
Personalised Donor Flow
Offer donors the flexibility to choose how and how often they receive updates on their donations and other charity activities.
Future Developments
Next Steps...
Refine User Interface (UI) Design
Enhance the platform's usability and visual appeal through meticulous refinement of the UI design, creating a more intuitive and engaging user experience.
Optimise Donation System and Interactions
Focus on further developing and optimising the donation system, ensuring a seamless and user-friendly experience for donors throughout the entire process.
Develop and Strengthen Website Branding
Implement a robust branding strategy to enhance user trust and engagement by creating a strong and consistent visual identity across the website.
Key Learnings
1. Effective Communication and Collaboration
Fostering strong communication and collaboration among team members ensured alignment of goals and a shared understanding throughout the project.
2. Agile Development
Embracing an agile approach allowed for flexibility and adaptability, enabling us to respond effectively to emerging challenges and make necessary adjustments throughout the sprint.
3. Value of Early Prototyping
The creation of early sketches proved invaluable in visualising design concepts and identifying potential issues early in the process, minimising the need for costly redesigns later.
4. Invaluable User Feedback
Observing user interactions with the initial prototype provided crucial insights and informed design decisions, ensuring the final product better met user needs and expectations.