Inspiration

The inspiration for EmBrace-Her came from the desire to empower women managing PCOD/PCOS with a solution that combines health tracking with uplifting experiences. Often, managing health conditions can feel overwhelming, so I wanted to create a tool that adds a Gen-Z twist to make the process fun, engaging, and motivating.


What it Does

EmBrace-Her is a web app that offers:

  • Interactive Menstrual Cycle Tracker: Users can mark their start and end dates, predict the next period, and stay on top of their cycle.
  • AI-Powered Compliments: Quirky, Gen-Z-style compliments to boost users' moods daily.
  • Gamified Mood Tracking: Encourages users to engage with the app by awarding badges based on their moods and activities.
  • Easter Eggs: Hidden, fun messages for users to discover, adding an element of surprise and joy.

How We Built It

  • Idea Generation: Used Nosu.io (View the idea) to brainstorm and refine features.
  • Frontend: Built using React.js, styled with CSS and TailwindCSS for a modern, responsive UI.
  • Backend: Integrated lightweight logic for health tracking and AI-powered features.
  • Deployment: Deployed on Vercel V0, making the process seamless and accessible for a beginner.

Challenges We Ran Into

  • First-Time Deployment: As a first-time user of Vercel V0, learning the deployment process within a limited time frame was challenging but rewarding.
  • AI Integration: Implementing AI-powered features like personalized compliments was tricky. Ensuring they were relevant, uplifting, and aligned with the Gen-Z tone required multiple iterations and fine-tuning.
  • Feature Balancing: Designing and implementing features like AI compliments, gamified mood tracking, and cycle prediction while keeping the app lightweight and user-friendly posed significant challenges.
  • Time Constraints: Building a polished, functional project in a short period while balancing creativity and utility.

Accomplishments That We're Proud Of

  • Successfully creating a fully functional web app deployed on Vercel V0.
  • Integrating fun and useful features like the AI-powered compliment generator and gamified mood tracking.
  • Making health tracking for PCOD/PCOS an engaging and enjoyable experience for users.

What We Learned

  • Tech Stack: Gained hands-on experience with React.js, TailwindCSS, and Vercel V0 for the first time.
  • User Experience: Learned how small, thoughtful design choices can make a significant impact on user engagement.
  • Idea Refinement: Using Nosu.io helped me understand the importance of structured brainstorming in building innovative projects.

🎯 Tracks I Participated In 🎯

1️⃣ New Hackers Prize: As a first-time participant, I took the plunge into hackathon madness and emerged with a fully functional web app!
2️⃣ IJAG: I’m Just a Girl: This track celebrates projects made by women, and I’m proud to have built this app solo as a woman hacker.
3️⃣ Nosu.ai Usage Track: Leveraged Nosu.ai for brainstorming and refining ideas! Check out my idea journey here: Nosu.io Idea.
4️⃣ Best Morgan Young Build-Your-Brand LinkedIn Post: Sharing this journey with the world using #BrainrotHackathon and #MorganYoung. Let’s spread the inspiration!
5️⃣ Most Cutesy Pink Project: With a Gen-Z aesthetic, pastel gradients, and quirky visuals, EMbrace Her is as cute as it gets!
6️⃣ Kanika Mohan Chaos Prize: While the app helps with productivity, it throws in enough fun, random surprises to embrace chaos in true brainrot style!


What's Next for EmBrace-Her

  • Mobile App Development: Extend the functionality to a mobile app for greater accessibility.
  • Health Insights: Add features like symptom tracking, personalized health recommendations, and nutrition tips.
  • Community Engagement: Create a community feature where users can connect, share stories, and support each other.
  • AI Chat Integration: Incorporate an AI-powered chatbot for real-time health tips and answers to common questions.

Built With

  • css-frameworks/libraries:-react.js
  • for
  • html
  • idea
  • javascript
  • nosu.io
  • platform:
  • tailwindcss
  • tools:
  • v0
  • vercel
Share this project:

Updates