Blosm

Overview
Overview 2
Homepage
Flower page
Watering page
Watering page 2
Add a friend
Profile/garden page
Profile/memories page
Capturing Memories

Project Inspiration

In today's fast-paced digital world, we've noticed a concerning trend: friendships drifting apart more frequently than ever before.

We live in an era where screens dominate our lives and overload us with constant stimulation. We felt a need for something different – a refreshing, simple, and genuine alternative that brings mindfulness back to our relationships.

Blosm draws inspiration from the art of gardening. Just as tending to a garden requires patience, care, and regular attention, so do our friendships.

Our goal is to encourage users to step away from their screens and build meaningful connections in person.

What did we make?

Our app allows friends to connect by growing digital flowers.

When you add a friend, a flower is created. The flower needs to be watered every so often to keep it alive.

To water the flower, users need to meet up and hold their phones together.

After the flower is watered, Blosm prompts the user to take a photo and create a memory that both friends can look back on.

The flower will be upgraded if both users meetup consistently. The higher the level, the more often you need to see each other.

App Demo Video (1 Minute)

https://youtu.be/UFnUx0CIq5Q

Development Process

Like all good ideas, we spent a long time discussing something we could make that’s new and innovative, with a fun spin on it.

We first drafted up all our designs and pages on Figma. This allowed us to get a common understanding of the app’s pages and navigation. Initially we wanted to incorporate a 3D game-like garden, but we soon realised it would be too ambitious.

Next we decided to choose a framework. As we were experienced with web development in React already, React native became our first choice. We also discovered a framework named Expo which allowed us to test the apps natively by scanning a QR code.

We put a lot of care into our app, making sure users on all platforms get a consistent and smooth experience. To avoid overloading the users, we made sure the designs are minimal and clean.

Throughout the process, we kept testing the app and asking friends to try it out. Their feedback helped us make Blosm even better.

In the end, we're really proud of what we've created!

Why are we innovative?

I’m sure you’ve heard of many friend apps before and we didn’t want to reinvent the wheel. Friend apps are probably one of the most common projects at hackathons.

Blosm is not just another messaging / dating app – it's a fun way to grow virtual flowers with your friends. Here's what makes it special:

It encourages real-life meetups. To grow your flower, you need to actually get together with your friend. This pushes people to spend time face-to-face.
It turns friendships into a game. Watching your flower grow over time makes keeping in touch more fun and rewarding.
It's simple but meaningful. A growing flower is a beautiful way to show how your friendship is blooming.

Technical Implementation

Developing mobile apps is something completely new to us. We quickly realised how different IOS and Android is, each with their own set of APIs, and made creating a consistent experience tricky.

Working with javascript made it a much better experience, instead of dealing with languages like Swift or Java.

We were really glad to have used Expo as well. It simplified a lot of the cross-platform headaches and gave us a smoother workflow. We didn’t have to go through the troubles of setting up development environments on all our team’s devices.

Expo’s file router was a game changer compared to react native navigation. It made the setup much easier as the pages were just in folders. Expo provides an extensive api like hooks for us to work with it.

Styling on mobile is a whole different ball game. We had to deal with safe areas, different screen sizes, and how components behave differently on various devices. StyleSheet became our best friend for keeping styles organised.

Our Team

We are a team of 4!

Edwin was the tech lead, focusing on the development of the app. He also setup CI/CD and github workflows so we could all have a better developer experience.
Amy was our design lead, creating most of the Figma sketches and modifying pages to fit our design language.
Alex helped us out with the ideation, script writing for the pitch, and was responsible for implementing the water animation page.
Auri helped out a lot with frontend development and assets, helping us create the profile pages and setting up assets and images for everyone to work with.