Before They Were Gone

## Inspiration

We built Before They Were Gone around the theme Bridge because reconnecting with someone you have lost touch with is often less about technology and more about crossing an emotional gap. Many people want to reach out to an old friend, teammate, cousin, or classmate, but they freeze because they do not know what to say. We wanted to make that first step easier by turning hesitation into a message that feels human, low-pressure, and sincere.

What it does

Before They Were Gone helps users generate a thoughtful reconnection message for someone they have drifted away from. The user fills out a short form with details like the relationship, how long it has been, why they drifted apart, how close they were, and the tone they want. The app then generates:

a short message they can send,
a brief explanation of why the message works,
and an honest warning about what to expect.

The goal is not to replace human connection. The goal is to help someone take the first step across the gap.

How we built it

We built the project as a React app in bridge/. The interface collects relationship context from the user, then sends that input to the OpenAI API through a prompt designed to produce structured JSON output. We use a parsing layer to safely extract the response and display it in the UI.

The app is organized into a few main parts:

InputForm for collecting user input
ToneSelector for choosing the message style
ResultCard for showing the generated output
BridgeVisual for reinforcing the theme visually
buildPrompt for shaping the request to the model
parseResponse for handling the model output safely
useOpenAIAPI for managing loading, error, and result state

We also added framer-motion for animation and react-hot-toast for copy feedback.

## Challenges we ran into

One challenge was making the output feel human instead of generic AI text. We solved that by giving the model strong constraints: short length, tone control, relationship context, and a required JSON format.

Another challenge was keeping the demo simple enough for a hackathon while still making it feel polished and emotionally believable. That meant balancing technical structure with a clean UI and a clear pitch.

We also had to think carefully about safety and tone, because this is a sensitive use case. The app needs to encourage respectful reconnection without pushing users into situations that might not be healthy.

## Accomplishments that we're proud of

We are proud that the project has a clear emotional purpose and fits the bridge theme in a meaningful way. Instead of treating the theme as a visual metaphor only, we used it as the core of the product idea.

We are also proud that the output is practical. The app does not just generate text, it gives the user a message they can actually send, plus context that helps them feel more confident about it.

Finally, we built a system that is simple enough for a live demo but structured enough to grow into something larger later.

## What we learned

We learned that the hardest part of reconnection is often not the relationship itself, but the We also learned how important prompt design is when building with AI. The quality of the product depends not just on the model, but on how clearly the app frames the task and formats the output.

On the technical side, we learned how to organize a React app around one focused user flow, and how ## What's next for Before They Were Gone

Next, we would improve safety and reliability by moving the API call behind a backend so the key is not exposed in the browser. We would also add features like saved drafts, multiple message variations, and regeneration controls such as “make it shorter” or “make it warmer.”

We could also expand the app beyond one-time reconnection messages into a broader relationship support tool, while still keeping the experience simple and emotionally respectful.

In the long term, the project could become a lightweight companion for anyone trying to rebuild a bridge with someone they care about.