Fooder

Food sustainability app and responsive website that helps people to reduce food waste.

The problemΒ 

In the United Kingdom, it is estimated that nearly one-third of purchased food items are discarded.


The goal

Our primary objective is to promote sustainable lifestyles by educating users on reducing food waste, thereby minimising landfill contributions and enabling cost savings for individuals.


The solution

A food sustainability app and responsive website (compatible with mobile, desktop, and tablet) designed to assist individuals in minimizing waste.

Method βš™οΈ

My method is based on the Design Thinking framework and include all the stages that ideally should be followed, depending on each project.πŸ”„Β It is an iterative process, which means that some phases will be repeated as the design is refining with more research and more implementations.

User research πŸ‘₯

UK households discards 4.5 million tonnes of food every year.

Millennials and Gen Z are more sensitive on this matter and were the main focus on the user research.

In the user research phase, I created a persona to deeply understand the needs and pain points of our users.Β 

User journey map has been essential to discover the point of view of the user, digging more into his pain points and finding new features that will be required by product.

Competitors
audit πŸ”

There are mainly two direct competitors and one indirect competitor in the market, all of which contribute to reducing food waste, albeit through distinct approaches.

Ideation phase πŸ’‘

The ideation phase facilitated a creative breakthrough and generated innovative ideas for the features.

Information architecture πŸ›οΈ

The website features a streamlined set of functionalities, including a user profile page, a favourites section, a recipe search feature, and an informative blog.

Low fidelity
prototypes πŸ“Β 

The primary emphasis was placed on establishing a cohesive flow that seamlessly connects the majority of features. This begins with the central feature, the recipe search, while also integrating it with the Food Supply page and the Shopping List feature for enhanced user convenience and engagement.

Testing πŸ§ͺ

Low fidelity prototypes were tested with users.

The results brought the attention to navigation issues while also uncovering exciting possibilities for enhancing other features.

High fidelity prototype πŸ€–

The prototype successfully addressed the identified issues based on a second round of user testing, resulting in improved overall usability and the incorporation of additional gamification elements.

Responsive website 🌍

The design approach followed a bottom-up methodology, starting from the development of the app and extending to the mobile web version, followed by adaptations for iPad and finally the desktop version.

Accessibility

1. High contrast and big copy helps readability

2. Clear labels for interactive elements that can be read by screen readers.

3. Main functionality in home screen with easy input of the ingredients

Style guide πŸ“˜

Challenges πŸ‹οΈβ€β™‚οΈ

1 Information architecture and user testing helped a lot in the process to solve some of the issues with the different functionalities.


2 Following testing, a complete redesign was implemented, leading to a substantial overhaul of the overall appearance compared to the original version.


The use of components and the tidyness of the artboard have been crucial aspects throughout the restyling process.

Learnings 🌱

Be ready to expand features and functionalities based on feedbacks, but always keeping in mind to make it as simple as possible to use.

Always be tidy and plan well, it will save time in future versions.

Next steps πŸ› οΈ

Develop PRO feature and set up payment plans

Translate in more languages

"I love how it shows the data of the food I saved. It makes trying new recipes and reducing food waste easy and enjoyable!"