UI/UX Case Study: How to increase seafood consumption in Indonesia as a problem of stunting nutrition and increase productivity and intelligence of the Indonesian?

Problem: The prevalence of stunting in Indonesia based on the results of the 2016 Nutritional Status Monitoring (PSG) reached 27.5 percent. According to WHO, public health problems can be considered chronic if the prevalence of stunting is more than 20 percent. This means that nationally the stunting problem in Indonesia is chronic, especially in 14 provinces where the prevalence exceeds the national figure.

In Indonesia, stunting nutrition is a serious problem. This can happen because access to balanced nutritious food is not evenly distributed in Indonesia. Whereas the main factor for stunting is the lack of nutritional intake of children in the First 1000 Days of Life (HPK).

Lack of protein consumption also contributes to stunting. Protein itself functions in the process of tissue growth and repair and can be used as an energy source. Protein also has a special special function that cannot be replaced by other substances, namely building and maintaining body tissue cells. Amino acid deficiency will affect the growth of tissues and organs, weight and height, and head circumference. Thus, protein deficiency is associated with stunting and wasting.

Then, how can we minimize stunting nutrition problems?

Consuming animal protein may help. Animal protein contains the goodness of essential amino acids that play an important role in human life. What kind of animal protein can be consumed? Essential amino acids can be found from animal protein sources such as freshwater fish and seafood. The increase in fish consumption is aimed at preventing stunting while at the same time maintaining the nation’s competitiveness in the future. The Ministry of Maritime Affairs and Fisheries (KKP) targets a fish consumption level of 62.05 kg/capita in 2024. The KKP report shows that the national fish consumption figure in 2020 is 56.39 kg/capita. This figure increased by 3.47% compared to the previous year which was 54.5 kg/capita.

Moreover, more efforts should be made to develop and properly distribute seafood ingredients. It also would be better if the distribution of seafood to those in need was managed properly and easily, so as to increase people’s desire to eat seafood to prevent stunting nutrition and it will reach those in need.

The idea we got: Why don’t we make an mobile based application that can make it easier for people to access and get seafood ingredients to help prevent stunting nutrition?

That’s how we discussed and got ideas to solve the problem. We chose a mobile based application because it is easier for potential users to access it anywhere and anytime.

Process and Timeline

Stage 1: Understand

At this stage, we try to understand potential users about user needs so that we can adapt them to the application we are designing. For the understanding stage, we did this by distributing questionnaires. After getting the responses from the questionnaire, we started to compose the Point of View and How Might We.


User: People who enjoy seafood-based food

Needs: A platform or place to buy seafood

Insight: Indonesian who are connoisseurs of seafood-based foods need a platform or place to buy fresh and easy seafood so that people don’t have to queue and can directly order the seafood they need.

Problem Statement

Users aged 18–45 years who have an interest in seafood-based foods need facilities or media that can provide a variety of fresh seafood so that users can easily buy/get the seafood they want. This is because often when users want seafood, they need to queue up to get the ingredients. Sometimes users also run out of items they are looking for. In addition, sometimes users also have to go to several restaurants or fish sales places to get fresh seafood ingredients.

How Might We

How can users buy seafood products?

How can we serve seafood products in one place?

How can users enjoy shopping for seafood?

How can we make it easier for users to shop for seafood?

How can we provide information about seafood products?

How can we make it easy for users to track purchased items?

p.s: We choose the users who enjoy seafood-based food so that the range of users of the application that we will design is wider.

Based on the Point of View and How Might We, the User Persona is obtained as:

Stage 2: Define

Defining the Problem:

  1. Uneven distribution of seafood.
  2. They don’t want to queue at the market.
  3. Dishonest seller (about prices).
  4. They get unfresh seafood.
  5. Most of them don’t want to shop in two places.
  6. Sometimes there are items that are not found in one store.
  7. The price of seafood is expensive and there is no access to affordable seafood.
  8. Shipping can’t be tracked if we buy online manually.

Based on the problems that have been mentioned, we designed a storyboard that can represent the problems.

Deciding the Solution:

  1. Provides e-commerce and delivery of seafood.
  2. Offers affordable seafood prices.
  3. Provide promotions for purchasing seafood.
  4. Delivery that can be reached to all areas.
  5. Can connect Sea and Freshwater Product Vendors and UMKMs with the wider community.
  6. The seafood offered is good quality and fresh.
  7. Users can easily track purchased items.
  8. Users can give reviews about the products they purchased.

Stage 3: Ideate

UI Design

Align with our simple yet specific user as a seafood lover, we came up with a genuine and clear message through our logo. We have set our goals to widen all-seafood-products so that more people can enjoy the daily fresh seafood with their single touch through our apps. The clam, the shrimp, and the fish represent our value in providing all-in-one seafood with our platform, called SeaU.

“Fresh food from the Sea on Ur doorstep!”, our bold message to convince everyone that they can have their fresh food, from the sea, all the way to their doorstep. By delivering to your doorstep, we also have the chance to say “SeaU”, which resonates to “See You”, giving a humble message to our user so we could deliver our products to the same doorstep again with better services in the future.


By mapping the flowchart, we visualize how users will navigate the product to reach their goals, so it doesn’t require much effort.


Simplifying the user flow was one of the hardest parts of the whole developing progress. We managed to give our best so users can navigate through our application with an ease.

To realize our ideas, we go to the next process, called wireframe process to establish the whole layout and user flow of SeaU.


We hold firmly our simplicity value to every single process, including the wireframe process. We believe that people can get their fresh seafood effortlessly by using SeaU.

Stage 4: Prototype

You can try our prototype with the link below:

Copy this link to your browser


Stage 5: Test (Usability Test)

Here, we perform two tests. First, we tested the user interface prototype using the Maze website. In the first test, we have 8 test scenarios according to the features to be tested. In the process, this test involves the user (tester) carrying out tasks based on the existing scenario. The scenarios that must be run starting from Sign Up to do Product Checkout and Product Tracking.

Based on the testing process, it is obtained as follows:

Access our Maze Report here.

Second, we validate the tests that have been done before. As for this second test, we evaluate using a survey made through Google Form. There are 10 questions included in the survey. The questions asked in the survey must have been adapted to the usability testing tool, namely the System Usability Scale (SUS). In this test, the user (the tester) is asked to fill out the survey after completing testing the user interface prototype using Maze. Later, the results of the survey will be calculated in such a way according to the SUS testing tool so that the final result is obtained.

Based on the previous survey, the final results are as follows:

That’s our process in designing the SeaU application. Last but not least, we also thank Mba Nyai as our facilitator for guiding us during the process of making this case study, Binar Academy for giving us the opportunity, and also our PM Wave 15 Team Mba Allilah and Mba Zachra for their cooperation in making this case study. We learned many things from here. We hope that this case study can be useful in the future.

Thank you for reading!

With love,

Mba Nyai’s Kelompok 1 UIX (Elsa, Keenan, and Sabrina) — Wave 20



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store