OroCare — App for Oral Healthcare
A case study on mobile application to bridge the gap between the dentist and patients and help them maintain better oral hygiene.
Project by: Adesh Bhansali, Davis Chris, Hemantkumar Das, Savni Panandiker
Design Planning
This project on Oral Healthcare was mentored by Mr. Swapnil Ghodke, Art Director UX Design at Philips Design. To accomplish this design project, we had to set a timeline. Here is the methodology and framework our team pursued to perform the design process.
Topic Research
We analysed the oral health habits of Indians and found out that the rapid increase in urbanisation and changes in living conditions are an extensive cause of poor oral health due to excessive intake of alcohol & tobacco, limited knowledge and poor access to oral healthcare services and procrastination of dental checkups.
Subsequently, we divided the statistics into children and adults to understand the pattern better and it came to our understanding that adults are more affected, and they are also unaware of their children’s oral health issues.
Target user and market
We had to set a boundary to design a simple yet effective solution as it is supposed to target both urban as well as rural people of India.
Discover
Design solves a problem. In order to provide a solution, we first had to understand the problem. We further researched on how the health officials are trying to improve oral health across India as well as other parts of the world.
Empathise with Users
There were three major users. Those who gave the treatment, those who received the treatment and those who were learning how to give a treatment.
If a product is to be designed that will be used by other people, it’s essential to talk to them to discover their wants, needs and experiences. Interviews help us gain a deeper understanding of people’s behaviour and their reason why they do what they do.
- Online Surveys
- User Interviews
- Telephonic Interviews
- Market Study
An anonymous online survey was conducted to better recognize our audience and find out the root of oral health issues. We prepared a survey with Google forms and distributed it among friends and families and WhatsApp groups. It helped us confirm further what we found out from the secondary research.
Based on the surveys, we conducted initial field research where we visited dentists and patients and analysed the situation, understood their pain points and their challenges. During our interview phase, the government of India initiated a lockdown due to the rising cases of Covid-19. This made us switch to telephonic individual interview calls.
Define & Analyse
After collecting all the information required, perceiving the strong quotes and evidencing how the interview phase got prolonged due to the pandemic situation, our mentor proposed and facilitated us with a quick technique of deriving design directions from user quotes by analysing their problems.
User Personas
Going further, we identified 3 personas that have different needs and different goals. This data will be useful to improve the user experience for them.
Given the time constraint, our team entirely focused on the patient’s side of the solution. It was time for us to generate How Might We questions. HMW questions are the best way to open up Brainstorm and other Ideation sessions. HMW opens up to Ideation sessions where you explore ideas that can help you solve your design challenge. It helped us to construct in such a way that it opened the field for new ideas, admit that we do not currently know the answer, and encouraged a collaborative approach to solving it.
“HMW design a tool that educates and ensures the oral hygiene is maintained correctly and regularly so that people feel empowered to take care of their own health?”
“HMW design a platform for dentists and patients to connect remotely for diagnosis to make routine check ups more accessible?”
“HMW design a tool for patients and dentists to monitor and manage the dental records and schedules in order to maintain a better oral hygiene?”
Design Ideation
An idea rack was developed by keeping the HMW questions in perspective. Various ideas were jotted down, among which we selected those which were the most desirable, viable and feasible. Based on the design directions, user persons and idea rack, four primary buckets were created in order to develop the ultimate design solution for the patient’s application.
Journey Mapping
To identify the touch-points of a patient, a journey map was created with various scenarios which were divided into pre, during and post consultation/treatment.This helped us establish at what points our solution was expected to benefit the users.
Task Flow
Various task flows were created in order to understand the primitive flow of the patient interacting with the app while executing various tasks.
Information Architecture
Wireframes
Naming and Logo
The main reason to choose the name OroCare was to fuse “Oral” and “Care” together. The logo was designed by combining a shape of tooth inside the initial “O”.
Colour & Typography
We used blue and orange as primary colours. SF Pro was the font choice we made for the app because of its visibility and simplicity.
Mascot
We designed a custom mascot for our brand and named it ORO. The purpose of the mascot is to make the app look professional as well as user-friendly while describing various situations by using it.
Final Design
Home
The home screen covers two major actions and one information i.e. Brushing timer, Book an Appointment and Upcoming Appointment simultaneously.
Booking
Patients have the choice to book an appointment, both regular and virtual, by selecting date, dentist or issue first. Once an appointment is booked, a digital ticket will be generated for the patient with the appointment details mentioned in it.
Records
No more searching for one report in a bunch of files in the cupboard. All dental records will be stored in OroCare’s secure cloud and patients can access them through the app whenever required.
Learn
Various learning modules and a SuperQuiz section has been added to OroCare to help people learn about the importance of oral healthcare and improve their health.
Profile
OroCare offers you to create multiple users in a single account so that you can add your family members into the app and improve everyone’s oral health.
Prototype link:
https://xd.adobe.com/view/516c0b13-00d7-4ca6-683b-b6704808fc96-275d/?fullscreen
Learning
Considering the time constraint and work from home situation, Swapnil’s suggestion of making a table for jotting down the dialogues and coming up with design directions really help us boost up with the process of building HMW statements and idea rack for the solution. Designing for the right amount of functionality with limited time was a unique experience for us in this project keeping in mind that it had to look professional and fun at the same time.
The Next Step
After reviewing the project with our users, mentor, Philips team, professors and
classmates from ISDI and various other experts from the industry, a few changes were
recommended for us to implement later.
Hemantkumar Das took this project further as a part of his Capstone Project under the
mentorship of Mrs. Shweta Nair, Senior Designer at McKinsey & Company. The main goal of this project hereafter was to improve the UI of the application and build an MVP app with the help of a Design Language System.
MVP
In-order to design an MVP app, a decision was made to design an end to end dental consultation app with a well defined landing page with zero clutter and clear CTA’s for how and where to begin. Hence, the following features were thought upon and finalised:
Feature 01: Appointments
Connect online with dentists of your choice instantly and book an appointment with an omni-channel experience.
Feature 02: Learn
Track your oral health through our curated tutorials to maintain good oral hygiene and tips to be clean!
Feature 03: Digital Records
OroCare helps keep all your medical records in one place — safe and secure.
Design Language System
After finalising on the MVP features, designing the Design Language System became very important since it was the foundation of the whole application and maintaining consistency was a must.
01. Logo
Logo was redefined by reducing the colour palette to just one primary colour.
02. App Icons
App icons were constructed based on the standard specifications.
03. Colours
A new colour palette was defined for OroCare where Blue is chosen as a primary colour to convey a sense of trust, loyalty, dependability, cleanliness and understanding. Blue also calls to mind feelings of calmness which will reduce the fear of people associated with dentists.
04. Typeface
Gilroy became the new typeface for OroCare because of its simplicity and modern look.
05. Iconography
Icons were redefined to maintain consistency. All the icons are now rounded and of equal weights.
06. Components
All the components used in the app is listed in the DLS with an explanation of how and when to use them.
Once the Design Language System was organised, the process of designing the final screens became effortless.
Visual Design
Onboarding
Crisp and to the point walkthrough gives the user proper idea of the goal of the app to explore the features and possibilities.
Login/SignUp
Enter your phone number or continue with your Google account.
Home
Keep a check on your profile/activity progress, know the symptoms and book an appointment.
Brushing Timer
Learn the proper steps of brushing with OroCare’s brushing timer and keep smiling with healthy white teeth.
Activity Tracker
Keep a track of all your brushing and flossing activities and get tips on improving your oral health.
Select Your Dentist
Check which doctor is available right away for an online consultation and filter out the dentists based on your requirements.
Records
No more searching for one report in a bunch of files in the cupboard. All dental records will be stored in OroCare’s secure cloud and patients can access them through the app whenever required.
Profile
OroCare offers you to create multiple users in a single account so that you can add your family members into the app and improve everyone’s oral health.
App Store Screens
First impressions are important in many situations, especially when it comes to downloading apps from the store. Hence it was also essential to design the store screens.
Learning
Creating the Design Language System helped in simplifying the UI. User feedback and iterations made the app concept impactful.
What’s Next? Creating a prototype of the app with micro interactions and repeating the testing phase.
Thank You.
