Inspiration
We were inspired both by the existing health apps out there, and by what they lacked: while there are tons of apps that track cycle timing, workouts, and food separately, we wanted to build something where all these tools were not only accessible from a single page, but completely private as well. Health data should never be sold or used without your knowledge, so all data collected in Red Sea is client-side, and never enters a wider cloud or server without your permission.
What it does
Red Sea is a browser-based app that allows you to track your cycle, workouts, and the food you consume. We then use that information to give you insights on your body: after 3 logged periods, we're able to not only predict the timing, but tell you what foods you tend to crave, what workouts you perform better in, and what symptoms you might be able to expect. You can receive this information by asking our resident mermaid, Nami, who will be able to dissect the patterns present in your body. Keeping your logging streak is encouraged with a tamagotchi-style pet system, where for every period you log, you get a unique, nameable, hand-drawn fish for your tank.
How we built it
Initially, we planned to make it an iOS/Android compatible app, but after developing the base for the frontend, we ran into many pay walls for iOS that would make it impossible to create a fully fledged multi-OS app. The next step was to translate this idea into a website, which allowed for greater asset creativity. Instead of restarting, we took out Typescript file for the app and translated it into a working html file. After which, we delegated tasks into three main catagories, audio, visual, and backend. The two former are self explanitory, but for backend we used three major APIs, one to store user data, one for foods/ingredients, and one to prompt the AI agent.
Challenges we ran into
The largest challenge was having to switch platforms partway through for the reasons mentioned above. Additionally, we wanted to prioritize user experience and design on all devices, so a lot of time was spent making sure our features remained intuitive and usable no matter the screen size or specs. We struggled with the scaling and API implementation as it was our first time dealing with the concept.
Accomplishments that we're proud of
Though we struggled with it, we're proud of the visuals and the UI/UX experience, particularly the art and the way which we were able to merge assets and function. The art, animations, and interactive elements blend effortlessly as a result of intense attention to detail and care for the subject matter. Lastly, we were proud of the backend work and sign-in implementation.
What we learned
How to build a website, UI/UX Design, App Development, API Integration
What's next for Red Sea
Maybe machine learning implementation, and more beautiful fish!
Built With
- css
- flstudio
- gsap
- html
- javascript
- procreate
- typescript
Log in or sign up for Devpost to join the conversation.