Title

Role

Ux / Ui designer

Tools

Invision; Adobe Illustrator; Adobe Photoshop; Figma; Microsoft office; Adobe premiere

 

Teammates

Francisco Cunha Henrique Timóteo

Year / Duration

2018 / 1,5 month

Context

Din Tai Fung is a Taiwan brand with international projection, recognized for xiaolongbao. The gastronomy has won several awards throughout its existence, highlighting the recommendations in the Michelin Guide in 2010. Din Tai Fung has gained prominence across Asia, E.U.A, E.A.U. and Australia. However, this franchising it’s new in Europe, and Lisbon was selected to spread its unique gastronomy. 

How can we integrate a brand in our culture with their values? 

We can say that Din Tai Fung pretends to offer a healthy  and efficient environment to her clients through their connection to the staff.   Can we create a connection with the clients through quality services (food and treatment)? Every detail is important. Only this way we can guarantee the clients appreciate and understand our main points, humility and respect as a brand.  To respond to the client we analyzed company digital platforms. His presence is different for each country (social media and mobile app). The different websites have features with some pain points which are so important to us to decide our strategy. 

 Strong points: “Peace of mind Guarantee” in the taiwan  website when the customers could know information about the products quality and reports and certification about each product.

Brand: Sinergy - Modesty - Integrity - Learning - Excellence

Map of restaurants

Challenge

We need to integrate this brand in the market showing their values and their food. For the cliente the online presence is the first step to develop the project. However we need to understand what the people who enjoy this type of food need. What is important to my customers? When are they going to use my product? Talking directly with those who experience this problem. 

Research is the most important part of this process, only with the responses to the right answers could we create the best results for customers and business.

Strategy

It was important to us to develop the solution based on an iterative process to guarantee the product efficiency. 

1. Empathize and Research
Awareness of who my user is?  

3. Create and Brainstorm
Create different solutions with information and draw the solution with all relevant information.

2. Define Problem / strategy
Understand and identify the real needs.

4. Test
Usability tests to understand the viability of our idea.

Research

What do users want?   

To answer the main points we decided to study our users to understand which is the best option to give them the confidence  to believe in our services. 

For this research we define strategic points to realize 16 inquiries, as is, the main point, the typology, the target, the platform and how we can use the data to improve our options. The most part of the answer was close, however we had an answer with multiple choices. It's important the user understands the goal of the project to give us the truest possible answers. For that we used clear and simple language.

Graphics of results
 

In the first phase  we needed accurate answers and quantitative data. This method gave us quantitative data to show the stakeholders the process and the preliminary ideas. We define diferente KPI to the questions, related to the importance of each. Our users had ages between 23-45 years old, however the highest percentage was the 27 years old with 47%. The results show that 43% don't order food; 37,5% make an order 2x a month and only 18% make one order a month. We check if our users prefer take away or book online and 68,6% prefer the second option. However this type of service has the same average (68,6%) that people enjoy eating the meal in the restaurant. We can say that  47% don't use the take away service  

With these answers we asked other questions, for example “why do they buy ready-made food”? 75% don’t have time to cook; 56,3% want to enjoy the meal in the restaurant; 12,5% don’t know how to cook; 37,5% only eat out to celebrate special occasions;6,3%  order food you can't cook. 

It's important to collect the most information to give our users the best experience possible. Ask how they decide where to eat? 75% use online reviews; 6,3% social media; 9% restaurant website, familiar tradiction or friends recommendation. When we specify the main point in meals, 75% enjoy food with quality; 43,8% space hygiene; 30,8% easily booking; 18% the restaurant environment; 18,8% the service (these options had multiple choices). With this research we understand that 81,3% don't repeat the restaurant if the quality of food was weak and 68,8% consider the hygiene weak the most important point. Another points are treatment with quality  (37,5%); the high waiting time (18,9%); high prices (18,8%) and the uncomfortable environment (12,5%) 

After the first round we made the second with the same users to understand the connection with the asiatic food. We understand that Chinese food  has a considerable weight in the option of choice (62.5%). We can tell that 63% prefer to go to the restaurant enjoy the meal because of the specific food (81,3%)and the environment (18,7%) 

 
Graphics of results
 

In the second phase we did some entreviews. In this type of answer the interaction was more dynamic with open answers. We can earn valuable data when we talk directly with people. The emotional side in connection with rational decisions was important to give the users the free way to express their opinions and not add to the research.

We talked with 9 users who eat chinese food. The lack of confidence in eating chinese food cooked out of home was 90% of the cases. The reviews were used for 60% of the users. How do they choose the place to eat? 90% of the users want to feel secure about the quality  and 22% enjoy the restaurant environment and 20% the price.  

In conclusion with this research we understand the quality of the food and know how it is cooked is so important for the users. The agile payment process and the reviews could determine the choice for the place to eat.

 

Insight and concept

With these concerns we brainstormed to define our best strategy to solve these problems. We started for the insight - “Peace of Mind”.  The oriental culture is based in serenity, tradiction, discipline and respect our ecosystem. In February of this year, when the app goes to the market, begins the Pig year with an earth element. So it made sense to feel the generosity, kindness and fulfillment of duty related to the pig element to understand the oriental culture and their values and use them to connect with our customers. As a visual guide line we used warm colors related to the earth element.

 
Insight

Strategy

With the research we understand so many things about the customers:

- Lack of time 

- Didn't know how the food was made as is the quality of the products

 Society doesn't have time to waste, so stress is a big part of our body and soul. Finding a solution to help people to slow down at the same time as efficiently in the meal process was our goal. Easier and interactive were the present words for the customer’s  journeys in the Ding Tai Fung restaurant.  We will start this experience since the book table until the payment (mobile, desktop and interactive table at the restaurant)

 

Persona

Persona
 
Persona

User stories

User stories

Benchmark

Benchmark app
 
Benchmark site

What do users feel?

To create a very strong and dynamic brand as a Din Tai Fung were created three platforms assigning different functions. The main point is to chain them in order to give the best user experience. 

The site has been given an informative function, where it can be consulted with useful information  and quality certificates, which is one of the strengths of the Din Tai Fung. The app has become essential thanks to the speed and efficiency of the product selection process  (booking and ordering).  The apps interaction with the digital table, agiles the user process, since the ordering food, waiting time until payment. These options make the experience quick and easy to use.

The process and tests

To materialize our research about our user and their needs we started for define a value board and the architecture of the 3 platforms.

It was important to us to understand how these points could help us to draw the solution. The client journey and how our feature could guarantee the user satisfaction, was our goal. So the solution started to assign different features to each platform.

However, these features should be complementary to each other in order to create a dynamic app.

Website is an informative platform with research and the users could verify the ingredients and the brand philosophy.

The app has an easy process to choose the menu and make the reservation. The user could connect the personal information with the other devices, such as a digital table and website. The login process, exchange points, live cam (to see the cooking) and games were some of the features which made this app a great value to the user.

In the Digital table the user could check the order, make new requests and quickly / easily pay the bill. This “table” has direct interaction on bluetooth with a smartphone.

 

After understand the dynamic of this devices we draw in paper some wireframes based on user tasks. It was so important to validate our options and features. For that we divided our validation in the iterative way with  this steps: 

Prototype - Test - Redraw prototype - Test (when was necessary evaluate requirements)

We started for the wireframes (prototypes tested them with the user), workflows, feature definition, site maps, storyboard, user journeys, consumer journey map.

 

We have 3 developed moments:

Phase 1 - improve the innovative way the client experiences the restaurant, such as, don't waste time waiting for a table; improve the order way. Could we be part of food degustation?

Phase 2 - online presence based on engagement 

Phase 3 - improve the payment process. Different ways to pay and incorporate new interactions, to make this process less stressful and painful.

 

Visual Design

After the usability tests with wireframes low fidelity,  we started the prototype high fidelity, to test and understand how our graphic solution could help the connection between the user and the selected features. 

We started to implement the “peace of mind” in the design. The visual language could be a powerful ally. The colors, typography, iconography, botons, logo, motions, illustrations and others will help us to create the best experience for the user.

 

The future

It’s so important when we started a project like this, thinking how could improve this experience. Could the clients see the chef cooking in live through a hologram?


 

 
 
Hologram image
Anterior
Anterior

Challenge - Daimler

Próximo
Próximo

S'witch