CareCircle

Where mothers can have their entire medical support team in one place.

Comment 1

Inspiration

Developing a pregnancy support platform is motivated by the need to empower expectant mothers with knowledge, improve maternal and child health, and reduce stress during this transformative journey. By integrating features like a pregnancy tracker, symptom monitoring, and access to vital information, the platform promotes timely care, informed decisions, and holistic well-being. It bridges accessibility gaps, offering resources to underserved communities and fostering inclusivity through multilingual support. With tools for connections to healthcare providers and peer networks, the platform ensures a safer, more informed, and supportive experience for both parents and their growing families.

What it does

Web Application

The application features a chat interface where users can interact with support staff. The chat has some pre-prepared messages that the medical professional can click on to streamline the conversation. There are also “Patients” and “Support Staff” pages where the medical professionals can view the patients they’re currently interacting with and their details or see a list of other medical professionals who might also be working with a mutual patient. Both these pages have the option to add a new patient/staff member and allow you to sort through the list of people by country or gender. If we had more time, we would’ve also implemented an add recommendations page that looks like week by week calendar. This page would allow the doctors to push recommendations from their side and would consist of a bunch of data about pregnancies and maternity overall.

App Prototype

The Figma prototype is a representation of what the patient side of the portal would like. The patient side is an app that expecting mothers could simply download on their phones for free. Some main features include the inbox page where mothers can see numerous chats (individual and group) for their care team in one place. This inbox page also has the option to allow the mother to search for additional medical professionals near her. We implemented this feature to enable mothers in areas with limited healthcare access to connect with doctors from other regions. Clicking on the conversation in the inbox page navigates to the chat page. Which is where mothers can easily message their care team. Another feature we’ve implemented is that doctors can push personalized recommendations to mothers for specific weeks of the pregnancy. These suggestions can be visualized in the recommendations page. Any time a recommendation is pushed, the mother gets a notification in their designated chat room and can also navigate to the recommendations page from there. We also have a tracker page that provides a week-by-week visualization of the pregnancy, featuring a progress bar to show the time remaining until the due date. It also shows helpful advice and tips for the mother organized by the week. This page simplifies pregnancy information for the mother, helping her stay informed without feeling overwhelmed. Additionally, in the case of an emergency, the mother can use the emergency ping button on the home screen, just below the notifications button. This feature brings up a map to quickly locate the nearest hospital and notifies her care team, ensuring they are aware of the situation. Other than these primary features, our prototype has general log in and sign up functionality. The log in pages notify the user if the password entered is wrong, allows them to reset their password, and asks for a verification code once they enter their log in credentials.

How we built it

To build CareCircle, we utilized a strong technology stack to ensure efficiency, scalability, and user-friendliness. The web application was developed using Next.js 14 as the framework, providing server-side rendering and a seamless development experience.

  • We chose TypeScript for its strong typing capabilities, enhancing code reliability and maintainability.

  • For styling, we implemented Tailwind CSS, allowing us to create a responsive and visually appealing design with minimal effort. To streamline the integration of UI elements, we incorporated Shadcn-ui components, ensuring consistency across the app.

  • We used Zod for schema validations to maintain data integrity and Nuqs as a search parameters state manager for smoother data handling.

  • For dynamic, real-time communication, we employed Socket.io, enabling instant chat functionality between users and agents. Additionally, Tanstack Tables were used to efficiently manage and display tabular data.

  • To conceptualize and refine the app's design, we created a detailed prototype using Figma, which served as a blueprint for development and helped align our vision as a team. This combination of tools allowed us to create an intuitive application tailored to our users' needs.

Challenges we ran into

We faced a few notable challenges during the development of CareCircle that tested our teamwork and adaptability. One significant issue was one of our teammates experienced technical difficulties with their computer, preventing them from pushing updates to our GitHub repository. This led to irregular updates and required additional coordination from the rest of the team members to ensure our progress stayed on track. Another challenge was trying to find the right balance between simplicity and functionality in our design. Our app needed to cater to a diverse audience of women with varying levels of knowledge in tech and unique maternity needs, making it essential to prioritize an intuitive user experience without compromising on essential features. Overcoming these challenges required open communication, flexibility, and collective problem-solving as a team.

Accomplishments that we're proud of

We are incredibly proud of several accomplishments achieved during the development of CareCircle. One standout achievement is successfully building a chat system within the web app, facilitating easy communication between agents and customers in real-time. This feature is central to providing timely support and creating trust with users. Another accomplishment is our innovative approach to pushing personalized recommendations for mothers, which helps them efficiently manage the overwhelming amount of information they encounter during pregnancy. Additionally, we're proud of our detailed Figma prototype, which accurately showcases the key functionalities and unique features of our app. This prototype effectively communicates our vision and demonstrates how CareCircle addresses critical challenges in maternity care, making it a valuable tool for both users and healthcare professionals.

What we learned

This project came with a significant learning curve as our team had primarily worked with JavaScript before. Adapting to TypeScript and Next.js required us to expand our knowledge and familiarize ourselves with new concepts and tools. Additionally, it was our first time using the Shadcn UI library, which presented unique challenges since it isn't a traditional component library that you can simply download. Instead, we had to learn how to generate and integrate its components effectively. This experience has greatly enhanced our technical skills and problem-solving abilities.

What's next for CareCircle

This is our plan for future enhancements and development of CareCircle:

  • Incorporate models like MedImageInsight and MedImageParse from the Azure AI Model Catalog to enable patients to upload various types of medical media for quick analysis, enhancing their overall experience. These models are designed to help licensed medical professionals easily interpret complex medical media, such as lab reports or X-rays, even if they fall outside their area of specialization to allow for more accurate and efficient support.

  • Develop an AI chatbot leveraging Retrieval-Augmented Generation (RAG) to help medical professionals quickly access relevant information from their database, such as patient details, streamlining conversations and improving efficiency. The purpose of this chatbot is to reduce the time spent manually searching for information.

  • Implement real-time message translation to support a broader range of languages to make the app accessible to users worldwide. This feature will enable patients in countries with limited medical staff to communicate effectively with medical professionals from other regions.

  • Utilize web scraping to collect different forms of information on pregnancy and maternity to expand the database which medical professionals can use to push recommendations. Automating this process of collecting and organizing information will allow the app to offer medical professionals comprehensive and up-to-date resources to draw upon when providing personalized recommendations to patients.

  • Add a community groups feature where mothers can connect with each other to build a supportive and inclusive network for sharing experiences, advice, and resources tailored to their maternity journey.

  • Implement stronger cybersecurity measures to safeguard user data by using encryption algorithms like AES, Signal Protocol, and libsodium for data at rest and during communication; securing databases with Transparent Data Encryption (TDE); conducting regular audits; and continuously testing for vulnerabilities such as SQL injections, XSS, and misconfigurations.

Additional RAG Chatbot

We’ve developed a standalone RAG (Retrieval-Augmented Generation) chatbot designed for future integration into our CareCircle application. This chatbot is tailored to assist medical professionals by streamlining access to relevant information from their databases, such as patient details or medical references. By leveraging RAG, the chatbot ensures quick and accurate responses, enhancing the efficiency and quality of care provided through our platform.

Here is the link to this chatbot: https://github.com/kambojananya/carecircle-rag

How To Access Prototype

To access the working prototype, navigate to our figma using the links below and click on the play button located at the top right. Simply experiment clicking at different buttons to see what's functional. If this doesn't work, try this link: https://tinyurl.com/figma-prototype-carecircle

Built With

Share this project:

Updates