top of page

Felix Project

felix.png

Type

Independent work

Lenght

2 weeks

Role

UX Research
UX Design

UI Design

Platform

Responsive website

Problem Space

 

Felix is the largest end-to-end food redistribution charity in Europe: they rescue good, surplus food from the food industry that cannot be sold and would otherwise go to waste, collect or receive food from over 539 suppliers and deliver food to almost 1000 front-line charities, primary schools and holiday programs in London.


They are particularly concerned with their online presence that doesn't seem to be effective when it comes to donations. 
 


Our evaluation pointed out the following problems:

  • The layout of their website is old and doesn't look good;

  • The user experience with their donation process is difficult;

  • Donating something different than money is hideous;

  • There's no information hierarchy;

  • They lack content organisation and their content is scattered;

  • Colour and design could be improved maintaining their brand identity


    Here's their current donation page:

Problem space
Group 13858.png
User Interviews

User Interviews
 

 

We conducted a round of user interviews with 5 participants.


At the end of each session, we asked the users to test the donation process on Felix's website in order to identify which problems they were experiencing, and understanding their behaviours and goals

Pain Point

“I’ve always wanted to donate
but I don’t trust charities”

Behaviour

“I don’t really donate to charities, I just donate to people on the streets when they ask”

Pain Point

“There’s no alternative to donating money, it’s always money or nothing”

Goal

“I want to help them, even if
its only impacts one of their days”

Recognising that trust was the primary concern, we understood that the key pain point in the website's was the user experience, and we needed to enhance its reliability.

Users also expressed a desire for diversified donation options beyond merely monetary contributions, including volunteering time or donating food.

 

 

By expanding the donation process to offer more choices, we anticipated an increase in user engagement and participation.

HMW
How might we provide users with
alternative ways of donating
 so that donations are accessible to anyone while improving the overall UX of the website?

Design Priority Matrix

 

To pinpoint areas requiring our attention, we created a Design Priority Matrix, enhancing our understanding of the intervention's crucial points.

Screenshot 2024-02-03 at 22.16.01.png
Priority matrix

Wireframes

Wireframes
wireframes-felix.png

Colours

Colour
Screenshot 2024-02-03 at 22.35.02.png

We created the colour palette by enhancing the existent colours and introducing additional shades of blue. The aim was to manipulate these colours later in a manner that exudes elegance and modernity, surpassing the current aesthetic on the website.

Typography

Typography
Screenshot 2024-02-03 at 22.56.59.png

Following the same principle, we revamped the aesthetic of the website through the typography with new font combinations. We used the bold Abril Fatface for the headings and Roboto in different weights for the body.

Hi-fidelity design

 

We developed an high-fidelity prototype in Figma and then tested the solution with our users for further improvement.

The content hierarchy has been meticulously restructured, ensuring a seamless and intuitive presentation.

The donation process is now divided into 6 distinct steps, displayed on the left side throughout the entire journey for an improved user experience.

Users are empowered with immediate choices, allowing them to opt for a food donation, a monetary contribution, or to volunteer their time.

 

And everything is now integrated into the revamped user interface that adopts colours from their brand identity in a more modern and delicate way.

Hi-fi design
Donate_Selected.png

Key takeaways & next steps

 

Improving the design and user experience of a website poses a unique challenge, especially when intertwining research and the introduction of new features. However, as designers, it's a challenge worth embracing to formulate new strategies of improvement.

In a landscape where the majority of companies has one or multiple digital products, our emphasis should shift towards helping them in refining their current websites or apps. This involves providing insightful consultancy and hands-on enhancements to their design and user experience. Additionally, extending our assistance in the integration of new features becomes a pivotal aspect of our work.

Key takeaways
bottom of page