Digital Influx - Product Design
Company Project (NDA) / Insights
Digital Influx is an international EdTech company specializing in Design and Product. The mission is to bridge education and employment through innovative e-learning methods, interactive activities, and engaging games.
Time 3 months
Tools Figma, Fig jam, Canva, Trello, Teams
Team 3
Challenge
Digital Influx, an EdTech company, aimed to launch a Foundation Website to attract donations and sponsorships for their initiative offering free UX design courses to underserved K-12 students. The existing website had challenges: the sponsorship section was hidden in a dropdown menu, making it hard for users to find, and it lacked emotional engagement, which hindered potential donors from connecting with the cause.
My Role
I worked as a Product Designer, collaborating with a team of designers and stakeholders to design the Foundation website. As part of a small startup team, I also played a role in UX Research and Learning Design, with responsibilities across several aspects of the project:
Product designer
End-to-end design of the foundation website.
UX Researcher
Enhanced the course's user experience by 25% by analyzing user pain points and implementing targeted strategies based on feedback.
Learning Designer
Designed a UX case study template for students in the UX Kids course.
Design Process
We followed the Double Diamond model to guide our design process, breaking the project into four phases: Discover, Define, Develop, and Deliver.
Discover: User Insights - Analytics and Survey
To gain a comprehensive understanding of the user experience, we analysed both quantitative data from website analytics and qualitative feedback from surveys.
Analytics Review
Our analytics review revealed several key issues that impacted user engagement:
Limited Visibility: The sponsorship page was buried under a “Get Involved” dropdown, resulting in only 5% of visitors engaging with the page. This contributed to low donor participation.
Navigational Challenges: Users struggled to find critical information, especially the donation form. On average, it took over 1 minute for users to locate the donation page, leading to a 50% task completion rate.
Survey Insights
In addition to the analytics, the survey provided valuable insights into user perceptions:
Confusion between "Get Sponsored" and "Become a Sponsor": 70% of participants were unable to differentiate between the two options on the sponsorship page. The overwhelming content made it difficult for users to understand the purpose of each section, leading to confusion.
Need for Emotional Engagement: 65% of users expressed a desire for success stories and emotional content to connect with the cause. Without these elements, users felt detached from the website’s mission, reducing engagement and donor interest.
User persona
We focused on better understanding the existing target audience to ensure the website met their needs effectively.
Tech & Design Professionals
Charity organisations
Educators
Non-profit groups
To better understand their needs, we surveyed 29 participants and conducted 5 in-depth interviews, gathering valuable feedback to refine the website's user experience.
Key Takeaways
Transparency in Donations: 78% of survey participants emphasised the importance of transparency in how funds are used.
Emotional Connection: Interviewees shared similar sentiments, with one participant mentioning, "I would feel more connected to the cause if I could read about real students and their stories."
Donation Preferences: 79.3% of survey participants preferred making one-time donations, while 13.8% leaned toward a monthly subscription model.
Social Media Engagement: 64.8% of users in the survey engaged with organisations through social media and expressed interest in more social sharing options. Interviewees also mentioned social media as an important touchpoint, indicating they would be more likely to share if the option were readily available.
Navigation and Usability: Interviewees highlighted challenges with the donation process. One participant stated, "It took me a minute to figure out where to click to donate. It could be more straightforward."
Based on the survey data and insights from the interviews, we developed user personas to guide the design process.
Competitor Analysis
To ensure our foundation website effectively engages donors, we conducted a SWOT analysis of 5 similar donation platforms. Here are some of the key insights we uncovered:
Clear Purpose Communication – The platforms immediately conveyed their mission and impact.
Trust-Building Elements – Showcasing success stories helped establish credibility.
Flexible Contribution Options – Providing different donation models catered to a wider audience.
Intuitive Navigation – Well-structured menus and prominent CTA’S.
While these insights were essential in shaping the core goals, we gathered a wealth of additional data that we decided to further explore and use during the ideation phase to refine features and optimise user experience.
Define: Goals
Based on insights gathered, we defined clear goals for the new foundation website.
Highlight Brand Identity
Communicate who we are through our story, mission, and values.
Simplify Navigation
Streamline the website's navigation to improve usability and provide a better user experience.
Increase Engagement
Add social links to connect with users where they are.
Facilitate Communication
Provide a simple contact form and clear details for outreach.
Enhance Trust & Transparency
Use student stories and partnerships to boost credibility.
Improve Donation Experience
Create a clear, flexible, and user-friendly donation flow.Create a clear, flexible, and user-friendly donation flow.
Develop: Design-Decisions
To prioritise features effectively, we used the MoSCoW Method (Must-Have, Should-Have, Could-Have, Won’t-Have) to align on the most critical components for the website:
User Flow & Information Architecture
Once the critical features were identified, we moved on to defining how users would interact with the website and how content would be structured. This process involved creating user flow and developing information architecture (IA).
High-Fidelity Wireframes
Home Page
The new homepage showcases student testimonials and highlights our partnered schools, enhancing trust and transparency. It provides clarity on our focus and communicates who we are as a company and what we do.
The navigation bar is streamlined for ease of use, enhancing the overall user experience. This change was well-received during user testing.
New navigation menu
Old navigation menu
Donation request form page
The donation page features a more organised and informative design, including a simplified donation form paired with an FAQ section for user assistance. It also provides flexible donation options, allowing for both one-time contributions and monthly subscriptions. To address our target user groups, the form allows users to indicate whether they are individual donors or company representatives.
New donation request form page
Old donation request form page
Contact Us Page
The Contact Us page is now more organised and offers an easier way to reach out. It includes a messaging form along with essential contact details for seamless communication. Additionally, social media links have been integrated to align with users’ preferred communication channels and enhance engagement.
New contact us
Old contact us
About Us Page
The About Us page includes our story, mission, global reach, vision, and team. The website adheres to brand guidelines, ensuring that key messages are prominently featured.
Deliver: Prototypes
To ensure the new website design was intuitive and user-friendly, we created interactive prototypes for the web version. These prototypes allowed us to simulate the user experience and gather valuable insights before the development phase.
Usability Testing & Results
We conducted usability tests with real users to validate our design choices and optimise user interaction. These tests yielded several key improvements:
30% Increase in Usability: The feedback from the usability tests helped refine key elements of the interface, resulting in a 30% improvement in overall usability.
Reduced Donation Form Discovery Time: By redesigning the navigation structure and simplifying the path to critical content, we reduced the time it took users to find the donation form to under 20 seconds, a significant improvement over the previous version of the website.
60% Increase in Task Completion Rate: With clearer navigation and a more streamlined donation process, the task completion rate for donations increased by 60%, showcasing the effectiveness of the design adjustments.
Responsive Design Development
Following the success of the web prototype, we created responsive designs for the mobile and tablet versions of the website. This ensured that the website would deliver a seamless experience across different devices, catering to the growing number of users accessing websites from their smartphones and tablets.
