
The Challenge
How to provide healthy and quality-assured eating options for patients and people with special dietary needs?
Team
Design team of one; Non-profit Project for ChaiMiDuo Restaurant
My Role
Research, Concept development, UI/UX Design
Timeline
Oct 2019 - Dec 2019
Tools
Figma, Adobe Illustrator, Adobe Photoshop, MS Office
Project Overview
This is a website design project for BeGood, a farm-to-table restaurant catering to patients and people with special dietary needs in Shanghai, providing healthy and quality-assured eating options.
Motivation
Witnessing family member with chronic illness made me realize the significance of nutrition and supportive care. Holistic treatment for patients is essential, that patient support should not be restricted to medical processes within the hospital. To ensure a better recovery, aspects such as nutrition, physical exercise, social support should all be taken into consideration. With the opportunity of this project, I want to design a product that features on the patient community and provides quality-assured support to better facilitate their rehabilitation.
1. Problem Scope
While Shanghai is the cradle of both the middle class and foreign-educated returnees, Jing'an district is not only highly populated with large corporations and shopping malls but also high-end nursing homes and hospitals. Healthy meal options at the hospital are nutritious but oftentimes tasteless. How can we improve the taste of healthy eating options without sacrificing the overall quality of food sources and services for patients and people with special dietary needs?
Map of Jing'an District, Shanghai
-
Concentrated hospitals and private care centers
-
Gathering of middle-class, foreigners, and foreign-educated returnees
-
A large base of patients and the elder community

User Pain Points (patient community):
01.
Tasteless hospital
food catering
Hospital meal are quality assured, but oftentimes blend and tasteless.
02.
Unhealthy food delivery options
Ordering food delivery is an efficient option, but most are with superfluous sodium and fat.
03.
Food quality
not guaranteed
External restaurants are also less assured in food quality, which requires extra effort to examine.
From the Business Perspective:
01.
How to establish trust with the target users?
02.
How to cater to users who are less physically mobile?
03.
How to support
customization with diverse options?
Project Objective
Eat
Well
BeGood
Join Us
Design of a restaurant and its service platform which cater to the special-diet population and the patient community.
Potential Benefit
For Users:
For Business:
-
Quality-assured healthy eating solution
-
Provide convenience and minimize mental burden
-
All-in-one service platform
-
Improve customer retention rate
-
Branding which speaks of business value
Preliminary Research
In order to better understand the problem scope and current situation, I have conducted a survey, a semi-structured interview, ideation workshop and market research. These research inputs helped me to position my study through testifying my earlier assumptions and gain insights from real beneficiaries and stakeholders.
Market
Research
Semi-Structured Interview
Co-Design Workshop
1. Market Research
Most restaurants do not have individual delivery service options, but under the umbrella of two delivery tycoon playforms in China: Meituan and Ele.me. Delivery platforms have provide users with diverse options, but lack of quality-assurance as there have been a number of food-related issues over the past years. Element Fresh and Wagas, focus on western/fusion cuisine while patients, espcially the elderly, have a strong preference towards the traditional Chinese way of cooking.

2. Semi-Structured Interview
To better understand the perspective of patients and their care-givers, I created an online survey and received responds from to 58 people at Jing'an district, of which 67% identified the need for a better system platform for healthy food options.
After the survey, I talked to three participants who are willing to share their thoughts with a 30-minute semi-structured interview. Below are some of the quotes:
U1 (23), Grandmother in hospital with lung cancer:
“My grandma is the only one at our house who cooks. Since she’s sick, my grandpa tried to cook for her but she didn't like the taste at all. My parents and I are just too busy that it's difficult for us to take care of her.”
U3 (46), hospitalized for two months
“I feel like the available healthy eating options are very limited. Those are mainly western food - like salad, very cold, but I want some Chinese style hot meals most of the time. ”
3. Co-Design Workshop
A co-design and brainstorm session with two patients and two patient care-givers about their ideal food service platform. The responses are recorded in four dimensions: Functionalities, Problem it solves, Service it offers, and Platform Integration.

Key Insights
From the above research, three of the mostly picked functionalities are listed:
Delivery & Scheduling
A web-based platform with delivery option and enables ahead-of-time scheduling.
Quality Assurance
Credentials with food quality assurance, either by providing source information or testimonials.
Ease of Use
Since most patients have low technological literacy, making it easy to navigate is essential. Functionalities like order-tracking should be included.
Solution Space
Identify Target Audience
Emma

Persona Profile

Lee
-
56, male, college professor
-
Recently retired, lives alone, not good at cooking;
-
High blood pressure and requires low-salt diet;
-
Mid tech-literacy, browse news online;
-
Would love to have a convenient weekly set menu provided which fits his needs.
Emma
-
36, female, work in Finance
-
Emma’s mom is hospitalized, while she does not like patient meal provided;
-
Busy working in another district, so Emma don't have enough time and energy to take care of her mom by herself;
-
High tech-literacy;
-
Keen on healthy lifestyle and effective work-life balance.

Strategy & Outline of Scope




Information Architecture
Sitemap

Wireframes
The page-level wireframes follow the site map which breaks down the website to basic components and main functionalities. The interaction flow of user on each page was carefully considered and mapped.
User can make order without registering an account, following the steps of:
[location - plan - menu - schedule - confirmation - sign up - checkout].

User Interface Design
Visual Research


Style Guide

Design States - Button States

Iterations & User Testing
The low-fidelity prototype was presented to three target audience who have participated in the previous survey and semi-structured interview. They were introduced to the above wireframe and observed when they were asked to perform different tasks including making an order, access personal account and check order information.
From observation notes and participants' feedback, several issues/obstacles during the interaction process were further addressed as part of the iteration cycle. Two main design challenges are listed below:
Design Decisions
-
Visualize complex nutritional information
Initial mockup put side menu on the side of nutritional chart, which users find difficult to read during testing. In final prototype the information are separated into tag - nutritional chart - ingredients with different visual cues to indicate information more clearly.


Nutrition Card Visualization
When user click on the thumbnail view on website, a nutrition card will pop up.
Green labels categorize meals with tags like “soy-free” ,“low salt” ,“low cholesterol” for users with special needs to easily search and identify.
-
Easier representation of food cost per week and per meal


Initial Mockup
The first iteration allows tapping on the button to select number of meals users would like for a week. The estimated total price and price per meal is shown below.
Second Iteration
Buttons were changed into a slide-bar which users can toggle to compare price/meal differences. This saves unnecessary actions of multiple clicking and minimize user effort.
High-Fidelity Prototype




Making the Order


2.

4.

7.

3.


6.
1.
5.
Mobile Prototype


Evaluation - OKRs Framework
Objective
Design of a restaurant and its service platform catering to people in Jing'an, Shanghai with special dietary needs
Objective Description
This project aims to support target users by providing healthy, tasty and quality-assured eating options which satisfy individualized demand of target audience.
Key Result 1
A service platform for healthy and quality-assured eating options
Key Result 2
Delivery and scheduling functions covering target location
Key Result 3
Categorized meal type and visualized nutritional information
Key Result 3
Supports local farm and sustainable farming
Reflection & Takeaways
Challenges
Carrying out user interview and seeking feedback from the target audience was not easy, as it entails the vulnerable community. How to work with them and their family/care-givers was a tricky question, as well as how to conduct research in an objective and non-biased manner. One healthcare expert has suggested me to conduct a co-design workshop, however with limited access to number of participants, the workshop was a smaller scale comparing to earlier expectation.
Future Development
Reflecting back it would be beneficial to secure a team for the full-cycle iteration and testing including technical developers. As BeGood was an individual project, I wasn't able to evaluate and test from the perspective of real-time website deployment. Having different voices on the team would largely contribute to the comprehensive design thinking of the envisioned product. A proper working prototype also allows more in-depth user feedback from iteration testings.
Key Takeaways
The first and foremost takeaway from BeGood project is understanding the cruciality of Co-design Process and including participants' voice. Co-design workshops helps to discover unique perspectives through such collaboration and further alters the traditional power dynamic between designer and user as a one-way channel. Co-design larges facilitates design equality and realizes user demand in a much more accurate way.