CareDoct App & Website
CareDoct is a mental health app whose goal is to help users feel at ease. Good mental health comes from seeking treatment, understanding your own personal issues, and developing healthy habits. CareDoct is there to assist users every step of the way on their journey to better themselves, by connecting users with local resources, communities, and treatments.
Project Summary
CareDoct was developed over the course of 10 weeks by myself and 5 other people.
We began by researching ways that our app could provide better access to mental health resources for students, as well as the best way to design an artificial intelligence chatbot that would be suitable for helping those struggling. This was followed by sketching and developing initial prototypes to test and get feedback from users, before further designing in Figma, establishing a brochure website for the product, and beginning the app's development in Ionic.
The primary goal of CareDoct was to consider the real-life application of a tool that was needed but didn't exist in such a form, and how the intersection of pre-existing mental health resources and technology could fulfill that need. As such, this project very much combined UX/UI design with business and how a product like this could illustrate long-term success.
Responsibilities
Research
Prototyping
Testing with Users
Website Design
Problem Scope
According to our research, nearly 73% of college students experience symptoms of a mental issue such as depression and anxiety. In addition, most students are not even aware they they may be dealing with a diagnosable mental health issue.
To solve this problem, we decided to design a mobile app named CareDoct that directly addresses the gap between someone first exeriencing symptoms and eventually getting a diagnosis. Thus, our goal for the app was to provide a non-diagnostic set of steps for users to take on their way to getting the aid they need from professionals.
Our main feature would focus on an AI chatbot that was the primary interaction between the user and the application, which would guide them in seeking resources. It would also have the capability to suggest productive and meaningful activities users can participate in (i.e. taking a walk, journaling) to provide ways for them to feel a sense of agency over their mental well-being. In addition, the app also provides access to various community and campus resources, as well as displaying a user's progress and tracked activities.
Research
Apps for Anxiety
Recently there has been a rise in the trend of newly created mobile apps aimed at audiences experiencing anxiety. There are many that provide help for users in the form of various coping activities, such as meditation or physical exercises, while others provide educational information. The common element of these applications is the requirement of a proactive user that constantly assesses their own mental health, which is a fairly difficult task for those unfamiliar with the topic, in order for the app to work effectively. There are no flexible counseling apps where users could find out more about their current mental condition.
Peer-Reviewed Studies Research
Cognitive Behavioral Therapy (CBT): a type of psychotherapy in which negative patterns of thought about the self and the world are challenged in order to alter unwanted behavior patterns or treat mood disorders such as depression. CBT believes that the goal of treatment is not only to address the external manifestations of behavior and emotion, but also to analyze the patient's thinking activities and strategies for coping with reality, and to identify and correct the wrong cognition. It is used to treat many diseases and psychological disorders, such as depression, anxiety, anorexia nervosa, sexual dysfunction, drug dependence, panic attacks, chronic pain, and psychosis.
First Iteration
Outline of Prototype Goals
The initial prototype for CareDoct was a basic implementation of the user interface developed in Figma and was created in order to simluate a basic user flow of the application with the goal of finding frustration points. We wanted to assess our prototype by having users 'navigate' the Figma mockups using the built-in interactive feature that simluates using the application without requiring code functionality. Several target users (college students) interacted with the prototype, and qualititative data was collected that helped us gather useful information about users' experiences.
Displayed below are the Figma mockups for this initial prototype, featuring the Login/Registration page, the ChatBot, Session information, Community, Resources, and Account. The link to the interactive prototype can be found here.
User Feedback
We found that the testers expected a login page on the inital screen, which was not a part of our design, leading us to consider the implications of requiring a user login to use the app, such as increased need for account security and concerns over anonymity. Moreover, this had us reflect on whether or not it would be beneficial to save user data to local device storage or to the cloud, if user accounts were to then become a part of our design.
One of our main features - the AI chatbot that the user can chat with regarding their current feelings and state of mind - was a challenging feature to test for, since there was litle way to simulate an actual conversation with the user in this format. Therefore, we focused on the consistencies among user feeback regarding the basic navigation and UI provided through Figma.
Implementation
Product Hypothesis
With CareDoct, we were trying to create a resource primarily targeted at college students and young adults to help them discover local and on-campus resouces, talk to others who are also struggling with their mental well-being, and follow small tips for temporarily relieving distress. We planned to do this by delivering an AI chatbot that could help connect a user with close-by therapists, provide them information about next steps for them to get help. We decided that our goal for the app would be accomplished after users discover and use CareDoct and are able to feel that their mental state and perspective has changed as they are more confident in the resources that exist for them as well as feel less isolated in thier struggles.
This was critical to the development of the product because it strived to maintain our focus on the core functionality and mission of CareDoct. We wanted to keep it simple in terms of success so that we could be certain that our product fulfilled this mission, and wanted this to be kept in mind at all points of design.
Design
Our final product design included three items: a brochure website, the Figma mockups, and a prototype developed in Ionic framework.
We designed the user interfaces so that the main features behind the product would be able to be understood from a static perspective. With the website, a user is able to move from one page to another via the top navigation bar. For the Figma prototype, the user can move from one screen to another through the bottom bar featuring icons that represent different pages. Lastly, the Ionic prototype is navigable through the side “hamburger” menu that was a part of our original mockups.
Brochure Website
Ionic Prototype
Testing with Users
Method
With our final product form, we tested with 6 participants, all students from UCI. We conducted a survey utilizing Google Forms in order to gain insight on what users thought about both the concept of CareDoct and the current features being executed in the various prototypes we had created.
Findings
Users noted the following strengths:
Adding the ChatBot feature via Facebook messenger since it’s so widely used by UCI students
The simplicity of the UI design
The many resources the app offers to get help such as emergency contact, community services, and local health centers
Integrating Google Maps for directions to local health centers making this feature both practical and familiar to users
And the following points highlight CareDoct's weaknesses:
Need better clarification on what each tab is for
Need cleaner transitions when navigating through the pages/tabs/menu for improved feedback while using the app
Need to create a more eye-catching design for the Community feature within the Ionic prototype
Project Conclusion
The development of CareDoct began with a problem - a huge portion of the population suffers from various mental health issues, which is where we began to brainstorm solutions. After a few iterations of ideas, we decided our main targets would be college students. Among them, our early adopters are freshmen, international and transfer students who are new into the school. We settled on CareDoct - a mobile application featuring an AI chatbot that would aid a person in need by providing a streamlined access to knowledge of existing resources that could help a student improve their mental well-being.
Throughout this process, we considered how to look at CareDoct through the lens of UI/UX as well as business and long-term success, which allowed us to design, test, and brainstorm changes while considering both sides. Throughout this course we started with a basic idea and ultimately developed tangible product prototype and conept that we feel represents the core value of CareDoct - to help people feel less alone in their struggles with mental health.