Rosa

Inspiration

All four of us have watched our grandparents struggle to use the same technologies that feel like second-nature to us. We wanted to build something that helps them, and in turn the millions of other seniors in the US, Japan, and elsewhere.

What it does

Rosa helps seniors with daily tasks, without them needing to know specific app names or touch their phone at all. In its current, proof-of-concept form, Rosa is a web app. It takes user input, like "I need to go to my doctor" and transforms it into an Uber ride request. It also learns and adapts to its users, sending reminders and checking in to comfort and assist.

How we built it

We started Rosa on a whiteboard. For half of the team, this was our first time building a full-stack web app, and there was a lot to learn. We defined user stories, setting out clear goals for what we wanted Rosa to do. Then, we began looking at how we could accomplish those goals.

We mocked our app in Figma extensively. This was something we also put a lot of time into. Part of that was because we wanted to know what it would look like. Another part of this was that mocking it in Figma kind of gave us an idea of where the touchpoints (and thus API calls) were. Lastly, it was just fun!

One thing we knew from the start was that we wanted Rosa to eventually be a built-in integration to one of the messaging apps that seniors likely already have, like WhatsApp and Facebook Messenger. With this in mind, we decided to authenticate each user via their Facebook account, which we considered to be the most common, easiest-to-use online account for seniors.

With that in mind, we decided to use Supabase for our database. Supabase has a built-in integration for logging in with Facebook, making our flow easier. We then defined table schema for each user and all of the info we wanted to store about them. These included things like important locations (doctor's office, child's address, etc), authentication tokens for the services we wanted to integrate (so they don't need to log into Uber each time), and language of choice, to support multilingual support.

With our Supabase, we then decided on the backend. We wanted to take advantage of Bun, so we decided to do the backend in Express. We'd integrate with the Together.ai LLMs to parse and fulfill requests, as well as the APIs of the services we wanted to use.

Our frontend was built in React with TypeScript.

Challenges we ran into

First, and the one that became the biggest time sink, was that we had trouble defining the tech stack and flow of our app. Designing the architecture took us many, many hours, and ultimately kept us from coding for a long time. We wanted to utilize the partners here at TreeHacks, so we looked into a lot (probably too many) of services. This cut down the time we had to code significantly.

Second, we had trouble getting approval to use certain APIs. For example, we wanted to use Facebook login, but to actually use the login information provided by Facebook, we would need to submit our app for review, which takes 5 days. Similarly, the Uber API had certain approval requirements. Other APIs, like Google Maps, had no free tier and were expensive to use, and we struggled to find viable alternatives.

Third, many of us were unfamiliar with building a full-stack web app from the ground up. This necessitated spending lots of time learning how requests would move through the app. It also hindered our splitting of the work, since we were all trying to figure out how the other person's part would work with ours.

Accomplishments that we're proud of

Getting our Supabase database setup! Defining the tables took longer than we thought. Related to this, getting the login with Facebook part to work. We originally used the Facebook login independently of Supabase, but kept running into issues with this. Using the built-in Supabase login with Facebook helped significantly and reduced the work we needed to do to register users.

Another accomplishment was getting some of the routing infrastructure for handling requests set up. We weren't able to get the front end working beyond logging in, but on the backend, we defined numerous routes that we intended to make requests to. We also came up with ways to parse user inputs for intent, information, and eventually responding.

What we learned

Full-stack web apps are hard to make! We had a lot of struggles with defining an end-to-end infrastructure. We learned just how important it is to define contracts for the app so that each person can begin working without needing to worry about how their part will integrate (something that was a huge time sink for us!).

We also learned a lot more about setting up and managing databases. It can be quite overwhelming to think about each piece of information you want and creating a place to store it.

Lastly, we learned that sometimes you just need to narrow the scope. We realized that we probably spent too much time thinking about finer details of the product and database to the detriment of coding and getting something working.

What's next for Rosa

• Flesh out the front end and integrate with the backend so users can chat with Rosa
• Integrate with more services beyond just Uber (e.g. Instacart for groceries, DoorDash for food, etc)
• Submit the app for approval by Facebook

Built With

• express.js
• react
• supabase
• together.ai