DURATION  4 months

ROLE  Product designer 

SKILLS  Interaction design  Graphic design  User research 

Smilie Tech

Smilie is a WeChat Mini program built for Smilie Tech that provides dental scan service and invisible braces treatment online. Cooperated with the product manager, I designed the user interfaces and the flow. 

01 Problem 

Orthodontic treatment can be troublesome, even when it comes to the Invisalign. Patients have to wait several weeks for orthodontists to be available. After the treatment finally starts,  they need to visit the orthodontist at least every two months. Many people are intimidated by the tedious procedures and thus become reluctant to start the treatment. 

02 Solution 

Smilie allows the patients to have orthodontic treatment remotely. Patients can make an appointment for free 3D scan in the WeChat applet and the orthodontists will make a plan for orthodontic treatment. Then the products will be directly sent to the patients’ homes. Later diagnosis will be also conducted online, so patients don’t need to go to the clinic.

03 Our Approach 

02  Design
01   Research

Literature Review 



Competitive Analysis 

Brainstorm & ideation

information Architecture


Hi-fi prototype 

03   Evaluate

Usability testing 

User journey map 

04 My Role 

In the 7-person team, I was the only UX designer. During the research phase, I conducted a literature review on current orthodontic treatment situation cooperated with the product manager. I also did semi-structured interviews with the target users. Then, the product managers and I came up with the several ideas and narrowed them down to find the most feasible design idea. Moreover, I also created the wireframes with the product manager and then delivered an Hifi prototype. Later, we plan to dive into the usability testing sessions to improve the user flows and the interface design. 

05 Surveys & Interview


We first use survey to pinpoint our target user group and potential users’ attitudes toward orthodontic treatments as well as difficulties and challenges the patients had encountered before. We chose people aged between 15-45 as our target audience based on the results of our literature review and expert interviews. 


Then we conducted semi-structured interviews with the potential users and the people who had orthodontics treatments before to dive deeper into the problems patients might have during the orthodontics treatments. 


Based on the surveys and interviews, we learned that among those who had not  received orthodontic treatments before, people aged between 18-30 showed the strongest motivation to start their treatments. The major concerns for them were the lack of time, inconvenience and financial burdens. 


From our semi-structure interviews, we also found that many people over 25 are reluctant to do the orthodontics treatment because they did not know whether their dental health would allow them to endure it or not, and they were afraid of being too old for this kind of treatment. 

06 User Journey Map 

Based on our research, I created a user journey map to view the whole experience from the patients' perspective, which helped us to understand their challenges and demands. 

07 Ideation 

Based on the results from our user research, we had an brainstorming session. We collected the ideas from each member and then narrowed our ideas down to the three parts that tackle with different pain points. 

08 Wireframes

We then sketched out our ideas on paper and discussed the details and feasibility. Later, we created wireframes to deliver the user flows. 

​Design Alternatives 


09 Define Design Language

We wanted to build trust with our users through the colors, shapes and overall layouts. Sapphire and dark gray embody the cleanliness and profession. The use of parallel rectangle and cards made the interface more organized, thus delivering a sense of reliability.  

We also intended to make our product look more friendly by adding circles and curves, so the whole process of treatment could seem less intimidating.  

After conducting tests with the real users, I spotted several problems, such as the vague status of the stage and the inappropriate appearance of the clickable card. I made adjustments based on the feedbacks and aimed to help the users to fulfill the whole process swiftly and effortlessly. 

10 Next Steps

In the next step, I would like to conduct usability tests to get more feedback and to refine the user flows and interface design. Also, I would like to dive deeper into the overall user experience of this online treatment and to find a better solution for creating a seamless and streamlined experience. 


This project enables me to improve my ability to understand users and create empathy though communication. I also learnt to understand the business goal and the values of my client as well as deliver my understandings through my design.