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 βοΈ
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 π
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 πΒ
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