GirlMate

This app supports women through puberty and menopause by providing stage-specific information, expert Q&A.

Comment 2

Idea- This app is a conversational companion designed to guide women through the pivotal life stages of puberty and menopause. Unlike other products that focus on limited functions, our chat-based app provides a personalized and empathetic experience, blending the wisdom of female medical professionals with the comfort of anonymity. It’s not just about tracking or symptom listing; it’s about understanding, connecting, and supporting women as they navigate their journey with confidence and clarity.

How is this different from the existing products-

  • Holistic and Conversational Approach: Unlike existing products that focus on a single function (e.g., period tracking or symptom listing), this app offers a comprehensive, chat-based experience, allowing women to ask questions and receive personalized information in real-time.
  • Anonymity for Privacy: Users have the option to remain anonymous, enabling them to discuss sensitive topics freely without fear of judgment or exposure.
  • Expert Guidance from Female Doctors: Volunteer female doctors from around the world provide credible advice, lending authenticity and reliability to the support offered.
  • Peer Support Communities: The app builds communities around specific challenges, such as "First Menopause Symptoms" or "Managing Puberty Changes," connecting women who are experiencing similar issues.
  • Trusted Companion: Beyond being just an information source, the app aims to serve as a supportive and empathetic companion, providing comfort and encouragement during life’s pivotal transitions.

Target users: • Adolescent Girls: Young girls experiencing puberty who need guidance, information, and support as they navigate physical, emotional, and hormonal changes. • Women in Their 40s and 50s: Women approaching or experiencing perimenopause and menopause, seeking information on managing symptoms, emotional well-being, and lifestyle changes. • Mothers and Caregivers: Mothers or caregivers looking for accurate information to help support their daughters through puberty or understand their own transitions. • Women Facing Early or Induced Menopause: Women who experience menopause early or due to medical interventions, such as chemotherapy or surgery, who may require specialized guidance. • Healthcare Professionals: Women doctors, counselors, and wellness coaches who want to volunteer or stay informed about common concerns related to puberty and menopause. • Transgender and Non-binary Individuals: Trans women and non-binary individuals undergoing hormone therapy or experiencing menopause, who may need additional guidance and support on physical and emotional changes.

How we built it

We built GirlMate using the MERN stack (MongoDB, Express, React, and Node.js), which provided a strong foundation for scalability and flexibility. Here’s a breakdown of the key components and technologies we used:

  1. Real-time Messaging with Socket.io: -We leveraged Socket.io to create real-time chat functionality, enabling instant communication between users. This technology was essential for ensuring seamless, dynamic interactions within the community and support groups.
  2. User Interface with Chakra UI: -To create a polished, responsive, and accessible user interface, we used Chakra UI. This design framework allowed us to rapidly prototype and implement visually appealing components, enhancing user experience across all device types.
  3. Data Handling with Axios: -We used Axios to handle data and API requests, efficiently connecting the React frontend to our Node.js backend. This library simplified making HTTP requests and managing responses, especially for sending user data, fetching messages, and retrieving health resources.
  4. Secure Authentication: -Security was a priority, so we implemented JWT-based authentication in the backend, ensuring that user data is protected. JWTs (JSON Web Tokens) allowed us to securely manage user sessions, limiting access to specific features based on user roles and credentials.
  5. Global State Management with React Context API:
  6. To manage application-wide state, we used React’s Context API. This provided a flexible way to handle global data, such as user authentication status and chat history, without needing to pass props down multiple levels. It streamlined communication between components, resulting in smoother interactions and improved performance.
  7. Dialogflow Integration for Chatbot (Planned Feature): -While not fully implemented, we explored using Google Dialogflow to enable chatbot interactions, particularly for health-related guidance and FAQ responses. This integration would allow GirlMate to respond dynamically to user inquiries, offering a conversational and supportive experience for health questions.
  8. Frontend Components: -We built multiple pages and components to enhance user engagement, including:  Login and Signup: Easy onboarding process with validation.  Avatar Selection: Allows users to pick or upload their avatars.  Chat Components: Enables direct messaging, group chats, and real-time support with an intuitive chat interface.

Challenges we ran into

  1. Real-time Chat with Socket.io: Implementing real-time chat was more complex than anticipated, especially when managing user presence and notifications. Ensuring users received messages in real time, handling reconnections, and displaying accurate online/offline status required careful coordination with Socket.io’s event-driven nature. Balancing performance with a responsive user experience in real-time interactions was challenging but crucial for the seamless communication we envisioned.
  2. Handling Multiple User Types (Doctors and Regular Users): Structuring data to accommodate both regular users and doctors presented a significant challenge. Each user type required unique features—regular users primarily needed health tracking and community support, while doctors provided expert guidance and health consultations. Designing flexible data models to handle this without overcomplicating the database or slowing down performance was a critical learning experience.
  3. Avatar Selection and Image Handling: Creating a smooth user experience for avatar selection and image handling was challenging. We had to find a balance between offering pre-defined avatars and allowing users to upload custom images. This required optimizing images for performance and ensuring that custom uploads were handled efficiently without compromising the app’s simplicity and loading speed.
  4. Implementing the Chatbot with Dialogflow: Integrating Dialogflow to implement the chatbot was one of the most difficult challenges. Defining intents and training the model to respond accurately to health-related queries required trial and error, especially for a specialized domain like menstrual health. Additionally, managing API calls and ensuring reliable communication between Dialogflow and our app was complicated. Configuring Dialogflow permissions and managing API keys to ensure seamless interaction was both time-consuming and technically demanding.
  5. Integrating Generative AI with Gemini 1.5 API: Utilizing the Gemini 1.5 API for dynamic, context-aware responses added another layer of complexity. Ensuring smooth interactions while managing API limitations and latency issues was a challenge. Balancing personalization with accurate responses required refining how we called and handled responses from the generative model, all while managing API costs effectively.

Accomplishments that we're proud of

We’re proud to have built an engaging, user-friendly platform that allows users to connect for support and guidance in real-time. We successfully implemented features like avatar selection, a secure login process, and responsive design, ensuring accessibility across devices. Additionally, integrating optional elements like volunteer recognition and health resources demonstrates our commitment to providing a valuable and supportive user experience.

What we learned

Throughout the development of GirlMate, we gained valuable insights and skills across multiple technologies and tools:

  1. Real-time Communication with Socket.io: -We deepened our understanding of real-time communication by implementing Socket.io, which allowed us to create a seamless and interactive user experience. This was especially beneficial for group chats, live notifications, and user interactions, enhancing the app's social aspect.
  2. UI Prototyping with Chakra UI: -Working with Chakra UI taught us how to rapidly prototype and design visually appealing interfaces. Chakra UI's component-based approach made it easier to maintain consistency in the design, resulting in an intuitive and accessible user interface.
  3. Global State Management with Context API: -Using the Context API improved our efficiency in managing the app's global state. It enabled us to share data across components without prop drilling, which made our code cleaner and more maintainable.
  4. Flexible Data Models: -We learned how to effectively design and manage data models that cater to different user types, such as adolescent girls, women, and transgender individuals. This flexibility allowed us to build features that are tailored to the unique needs of each group, enhancing user engagement and relevance.
  5. Dialogflow for Conversational AI: -Working with Dialogflow taught us how to design and implement conversational flows for health-related questions and period tracking. We learned how to create intents, define entities, and connect our app to Dialogflow’s API, laying the groundwork for a chatbot that can respond to user queries naturally and empathetically.
  6. Gemini 1.5 API for Content Generation: -By exploring the Gemini 1.5 API, we expanded our understanding of integrating generative AI capabilities. Gemini’s language generation allowed us to create responses for user queries that are more contextually relevant, supporting our goal of providing a personalized experience. We also learned how to manage API calls effectively to maintain smooth and reliable communication with the AI model. Each of these components contributed to a richer, more interactive GirlMate experience. The knowledge we gained from using these technologies has equipped us with a strong foundation to continue developing innovative features in the future.

What's next for GirlMate

Next, we plan to enhance personalization through AI-driven recommendations and build premium subscription-based features to generate revenue. We’re also looking to expand the volunteer recognition system to include badges and rewards for active contributors, along with curated health resources such as articles and videos. Future updates will focus on adding data analytics to further optimize the user experience based on behavior insights, as well as integrating a resource-rich page for health information. Dialog flow Integration: With Dialog flow, we envision an even more powerful and personalized GirlMate experience. Here’s how Dialog flow will contribute to our future plans:

  1. Enhanced Personalization: -Using Dialog flow’s natural language understanding, we plan to refine the chatbot’s responses to be more personalized. As users interact with the chatbot, Dialog flow can help tailor responses based on individual health needs and preferences. -Through Dialog flow’s contextual awareness capabilities, the chatbot will remember previous user interactions and provide relevant recommendations and guidance, making each interaction more meaningful.
  2. Premium Features: -For premium users, we plan to use Dialog flow’s webhook integration to offer advanced AI-driven recommendations and real-time symptom analysis. This will enhance the chatbot's ability to provide more in-depth responses based on external health data and insights. -Premium users can access exclusive health resources and connect with our chatbot for priority support on health-related questions.
  3. Volunteer Recognition and Badges: -Using Dialog flow’s ability to handle a wide variety of user intents, we can implement conversational flows that track volunteer contributions. Dialog flow will help manage interactions for recognizing volunteer achievements and awarding badges for active contributions. -Volunteers will receive encouraging messages from the chatbot, reinforcing positive behavior and engagement.
  4. Health Resources and Education: -We plan to integrate curated health resources like articles, videos, and tips within the chatbot’s responses. With Dialog flow’s knowledge integration (using Knowledge Bases in Dialog flow), the chatbot can automatically fetch and provide relevant health resources based on user queries. -Users can ask health-related questions, and Dialog flow can pull information from our curated resources, offering users the right content at the right time.
  5. Data-Driven Insights and Analytics: -Leveraging Dialog flow’s conversation data analytics, we’ll gain insights into user needs and behaviors, which will allow us to optimize the chatbot’s responses and improve user satisfaction. -Using Dialog flow’s analytics features, we can identify common questions and pain points, enabling us to create more focused and helpful content and features.
  6. Resource-Rich Page for Health Information: -In the future, users can navigate through various health topics within the chatbot. With Dialog flow’s capability to handle complex flows, the chatbot will guide users to explore articles, tips, and resources directly within the chat interface, making health information more accessible. By further integrating Dialog flow’s capabilities, we aim to create a truly supportive and engaging experience in GirlMate, helping users manage their health in an intuitive and conversational way.

Built With

Share this project:

Updates