Inspiration

For many pre teens, a first period can come with a lot of uncertainty.

What happens if it starts at school? What if they bleed through their clothes? What are they supposed to do next?

PADthai's research with 140 period havers showed that many felt unprepared for their first period, with bleeding through clothes emerging as the biggest fear.

Their concept, MenstraMission, introduced Menstrome Island as a more interactive way to approach period education through relatable scenarios instead of long blocks of information.

Our challenge was to take that blueprint and bring it to life while still having room to build on it.

Bloom is our answer. It makes period education feel like exploration instead of a health textbook.

What it does

Bloom is a private period companion for pre teens, built around three core features.

Menstrome Island

Menstrome Island teaches period education through short, relatable scenarios and interactive choices. Instead of reading long explanations, users learn what to do in situations they may actually face.

Bloom Flower

The Bloom flower turns cycle tracking into a visual experience, changing as the user moves through their period and cycle.

Find Help

Find Help guides users through concerns like pain, bleeding, or unusual timing, then suggests a clear next step and nearby support options when relevant.

Cycle and personal data stay stored locally on the device, with no account required.

How we built it

We built Bloom with Next.js, React, TypeScript, and Tailwind CSS.

We used PADthai's original research and pitch deck as the foundation for the experience. Their blueprint gave us the idea of Menstrome Island, its seven towns, the visual direction, and the core audience, but it did not define exactly what users would learn inside each town.

We developed that content using PADthai's own survey findings and their research into how Gen Alpha learns. We focused on:

  • Interactive learning
  • Short story based scenarios
  • Low cognitive load
  • Small rewards after completing each town

We also kept the original visual identity as closely as possible, including the coral, light blue, lavender, and cream palette, rounded typography, and the Menstrome Island name.

Where we changed or extended the blueprint, we made sure there was a clear reason behind the decision rather than changing things purely based on preference.

Challenges we ran into

Working from an incomplete blueprint

One challenge was working from a blueprint that was partly available through PADthai's pitch deck and partly through a Figma file that was not accessible directly in our build environment.

That meant we had to be careful about separating what came directly from their research from what we were designing ourselves.

Building within the hackathon timeframe

Menstrome Island contains seven towns, and each town needed scenarios, interactions, rewards, and navigation.

We had to balance how much we could build within the available time while still making the experience feel complete and consistent.

Making Find Help reliable

Nearby GP and pharmacy search depends on public location and map services, which can be inconsistent.

We built the guided support flow first and treated nearby search as an additional layer rather than making the entire feature depend on it.

Making the Bloom flower meaningful

We wanted the flower to be more than decoration.

Its behaviour needed to reflect real cycle changes, including shorter or longer periods and the transitions between different stages of the cycle.

Accomplishments that we're proud of

We are especially proud that Bloom does not treat period education as a collection of facts to memorize.

Menstrome Island puts users into situations they may genuinely experience and lets them practise what they could do before those situations happen in real life.

The Bloom flower turns cycle tracking into something that is easier to understand at a glance. It connects what users learn about the menstrual cycle with what they see happening in their own tracker.

Find Help brings the educational side of Bloom back into practical support. Instead of leaving a user with information alone, it helps answer the next question:

What should I do now?

Most importantly, we were able to take PADthai's original concept and turn it into a working product while keeping our decisions grounded in their research.

What we learned

The biggest thing we learned was that being faithful to a blueprint does not mean copying it without thinking.

Some parts of PADthai's concept were very clearly defined, while others were intentionally open. The challenge was figuring out where we should preserve the original idea and where we could add something new.

Going back to their research helped us make those decisions. Instead of asking whether a feature simply looked good or felt fun, we could ask whether it helped solve the original problem:

Does this help pre teens feel more prepared for their first period?

We also learned that period education becomes much more approachable when information is connected to a situation.

Knowing that cramps are caused by uterine contractions is useful.

Knowing what you can actually do when cramps start during class is much more useful.

What's next for Bloom

Next, we want to make Bloom even more connected and accessible.

This includes:

  • Linking what users learn on Menstrome Island more closely with the Bloom cycle flower
  • Expanding the plant themes
  • Adding multilingual support
  • Improving Find Help so nearby support feels more reliable and useful

Our goal is to keep building Bloom into a practical companion that helps pre teens feel more prepared, informed, and confident about their period.

Built With

Share this project:

Updates

Submission history