top of page
fribo inside cover 2-01.png


FriBo is created for the future of refrigerators that will work in tandem with users in storing and organizing one's food in the refrigerator, as well as providing informational updates on expiration dates and grocery quantities.


10/2020 - 12/2020



Adobe Illustrator

Google Forms

Individual Project

My Role

UX Designer

UX Researcher


Doing refrigerator inventory can be troublesome to households.


Common problems in organizing refrigerator:


(1) Large number of food items make inventory difficult

low quantity.png

(2) Not knowing food items expiration dates or when one is running low in quantity

Where's my milk???


(3) Having troubles locating items


How might we effectively document food in the refrigerator to help people achieve a more organized refrigerator?



How about a mobile app working with the smart refrigerator?



螢幕快照 2020-12-08 上午2.17.27.png


new user - guide 拷貝.png
new user - categories.png
new user - scan refrigerator.png

New User Tasks & Guides

FriBo begins your journey by introducing itself to you and help you use your refrigerator to the best potential.


- Graphical display on inside view of the refrigerator

- Zoom in and out to view each food category for detailed information

food - orange.png
new user - guide.png
food 拷貝.png
food 拷貝.png


- Allows users to view food information as a list

- FriBo will receive updated information on food going into the refrigerator 


- Reminders on foods about to expired and low in quantity 

- Calendar and settings can be easily accessed on all feature pages

settings 拷貝.png
calendar 9.png
plan-eating plan.png
plan-grocery list.png


- FriBo can suggest grocery lists, eating plans, and recipes depending on your preferences and groceries available

- Plans can be created or edited

Check-in drawer

FirBo offers automatic information documentation for foods enter the refrigerator. This concept was inspired by how vending machines; instead retrieving products, the refrigerator helps record and correctly store your groceries. 

The option for text entry or to scan barcodes to record food item information is also available.

Auto Check-in

checkin auto (1).gif

Manual Check-in

checkin manual (1).gif


Existing Solutions


Fresh Box


Best Before


Smart Refrigerator


Smart control panel

Record food information manually:

- upload pictures

- enter name, expiration date etc.

- set expiration alarms

Barcode scanner detects food items and records information

Devices (digital camera etc.) are embedded for obtaining status inside fridge.

- Smart control panel

Identify User Needs

To better understand different user scenarios using a refrigerator inventory, a two-staged study was conducted with semi-structured interviews (n=6), and online surveys (n=62).


Participants were categorized into two groups based on different behaviors: people singularly using one refrigerator and people sharing the use of one refrigerator.


The participants have discussed their grocery organization and shopping habits. Most importantly, they identified shared issues and proposed potential solutions.


Survey questions were developed based on the findings from interviews.

interview + survey.png


Potential Solutions

Interviewees identified

•    Foods spoilage (ex. grow mold, bad smell)

•    Problem locating food easily

•    Unaware of the quantity of foods

•    Two or more people in the household buy the same product together not knowing if someone else in the group had already bought it (sharing refrigerator).

Interviewees identified

•    Reminders on foods expiring or running low

•    Record food item's information (name, quantity, potential expiration date, location in refrigerator...)

•    Suggest suitable refrigerator organizational plan 

•    Suggest grocery lists based on foods in your refrigerator


Survey takers selected (TOP 3)

1.   Forgeting about food at the back

2.   Unaware of the quantity of foods and food spoilages

3.   Problem locating food easily (sharing refrigerator)


      Some foods' smell mixed with others due to

      improper placing (use alone)

Survey takers selected (TOP 3)

1.   Reminders on foods expiring or running low

2.   Record food item's information

3.   Suggest grocery lists (sharing refrigerator)


      Suggest eating plan based on food shelf life

      (use alone)



Name: Isaac

Age: 20


Second-year college student

Current Situations:

Recently he has learned about healthy eating and now likes to buy more fresh vegetables and fruits instead of microwavable foods.



- Grocery shopping every 2 weeks

- Not cooking regularly



- Finishing fresh foods before they spoil

- More and more grocery items are forgotten and piled up in his refrigerator

- He is finding his new healthy diet difficult to manage without wasting foods


Name: Emma

Age: 35



Mom of 2 kids

Current Situations:

She often needs to work outside of normal hours due to job in the hospital.



- Grocery shopping once a week

- Cooks regrularly



- Her children are often not aware of the contents of the refrigerator and how to prepare them

- Husband needs specific grocery list in order to do shopping

- Controlling the smells of differing foods in the refrigerator




Design Principles/Guidelines

-   Consistent designs

-   Match system to the real world

-   Consider issues for users: technology literacy, ease of use, clear and responsive to differing situations.

-   To always suggest positive choices rather than dictating them.

-   User can modify any errors

-   Customizable and adjustable settings

-   Document information obtained


Card Sorting

Three potential users did a card sorting activity to help me understand the overall navigation hierarchy and logical locations of features. User input was implemented into the later development of the system.

Information Architecture

This presents the workflow of FriBo and its contents under four main features: Fridge, Food, Remind, and Plan.

fribo new.png

Wireframes to High-fidelity Prototype

螢幕快照 2020-11-17 上午3.06.57.png
螢幕快照 2020-11-17 上午3.09.51.png
螢幕快照 2020-11-17 上午3.08.02.png
螢幕快照 2020-12-08 上午4.13.04.png
螢幕快照 2020-12-08 上午4.05.51.png
螢幕快照 2020-12-08 上午4.04.22.png
螢幕快照 2020-12-08 上午4.06.52.png
螢幕快照 2020-12-08 上午4.07.09.png
螢幕快照 2020-12-08 上午4.07.09.png


Early Evaluation

Wireframes are presented and clicked through by three participants (potential users). Feedback was taken into account for future development and improvement of the system.


Feedback from participants:
•    The layout is simple, clear, and easy to view
•    Eating plan and recipe in ‘Plan’ was hard to find
•    Label unnamed icon button
•    Icons need to be consistant for navigation
•    Settings icon was difficult to locate
•    Like the encouraging phrase use in tasks for new users


Summative Evaluation

Tasks-based usability tests were conducted to evaluate the usability of the application's main features. Three potential users participated in the test.


Changes were made according to users' feedback.

remind menu.png
remind menu (1).png
nav bar.png
nav bar (1).png
Group 5 (1).png
Group 5.png

•    “Edit” button is carried out from hamburger menu 

•    Order of tabs in navigation bar is rearranged based on priorities of main features

•    Important buttons like “check in” “log out” are changed to dark blue color

plan-grocery list.png
new user - survey 1.png
new user - survey 0.png
new user - shopping.png

•   A short survey for obtaining users’ preferences for system suggestion was moved to the “plan” tab, and it becomes an optional request for users.

Future Improvement & Expansion

-    More features in the system can be developed to customize specific household use; such as when people share a refrigerator and may want to share their groceries in differing ways. 
-    Add
accessibility options
-    Find  ways to
gain a larger audience 



Things found to be important in design process

•    Allow users to have voice and input during the entire design process
•    Always
ask for users’ thoughts, because it is possible to be different from developers’
•    The primary purpose of system is to
satisfy user’s needs; therefore, all features should be developed based on user’s needs.
  Reflect users’ priorities
•    Designs should be consistent for systems



Interactive Prototype

This is a high fidelity prototype for users to interact with FriBo. One can click through the prototype to experience all the different features of the FriBo app.

bottom of page