Health & Nutrition Calculator Web App by Berikan Protein Initiative
Role:
UI Designer & UX Writer
Industry:
Health, Food & Beverage
Duration:
8 weeks
Background & Purpose
Berikan Protein Initiative is a non-profit movement focusing on improving nutrition and eradicating fish-based malnutrition in Indonesia. The movement's most important product is Protein Meter, a web app that measures daily consumption adequacy.
This is one of the projects I worked on during my UI/UX Designer internship at Berikan Protein. The project produced fantastic results, reaching 22,000+ users in 34 provinces and 348 cities/regions in Indonesia from February to April 2022.
Problem
The Protein Meter was one of Berikan Protein's most important products because it provides the basic data for other steps, such as compiling malnutrition solutions and exploring collaborations.
However, its old version was considered less than satisfactory; the calculation needs to be fixed, and much information needs to be added or updated.
User Research
I conducted direct interviews and focus group discussions with Berikan Protein's owners and management for this redesign project to understand the client's needs.
The user research results produced several essential points for redesigning this web app, such as the fact that users can download the result card after completing the assessment.
Sitemap
From the insights gained in the User Research, I created a Sitemap that explained that this website needed 12 pages in two main categories: Protein Minimum Map & Calculate Daily Protein Needs.
From the 12 pages, it was again pioneered into dozens of sections and subsections presenting detailed information such as Personal Data Forms and Protein Consumption Card.
The Sitemap can be seen HERE.
I skipped the wireframing stage based on time considerations and client approval and directly went to the Hi-Fi Design & Prototype stage, which created 26 responsive UI Design pages in desktop and mobile views results.
I chose the blue color palette, sans serif font, and flat illustrations to represent the Berikan Protein logo and the energy of the fresh & trusted movement, which promotes the empowerment of rich protein from fish.
