Red String | Devpost

logo
yuan
social graph
red strings
connections

Inspiration

缘分—destined connections in Chinese—and the red string of fate, a myth that says we are invisibly tied together, destined to meet no matter the time or place, even in the chaos of a crowded party. We asked ourselves: What if technology could help us find those connections we were always meant to make?

What it does

AI Matching Engine: Our backend takes in basic inputs — MBTI, birthday, school — but it doesn’t stop there. Every time you connect with someone, you're prompted to share why you connected. Those short reflections train the AI to learn about you and your social patterns on a deeper level.

Red String Matches: At every event, AI curates a personalized “who to meet” list from the guest list, predicting your most meaningful matches — not just statistically, but emotionally.

Social Graph Visualization: Every connection forms a node in your dynamic visual graph. First-degree, mutuals, and distant links light up your map as your network grows in real time, turning mingling into a playful, gamified experience.

How we built it

Frontend

RedString’s user interface is built with React Native and Expo, enabling us to target both iOS and Android from a single codebase. We used Expo for rapid prototyping, hot reloading, and easy device testing. The UI leverages React Native’s component system, with additional libraries like @react-native-picker/picker for dropdowns and react-native-modal-datetime-picker for smooth date selection. For image uploads, we integrated expo-image-picker, and for QR code scanning, we used expo-camera. The app’s navigation is handled by React Navigation, supporting both stack and tab navigators for a seamless user experience.

Backend

For our backend, we chose Supabase, an open-source alternative to Firebase. Supabase provides a Postgres database, authentication, and real-time APIs out of the box. We used the @supabase/supabase-js client to interact with our backend, storing user profiles, events, and social connections. This allowed us to focus on building features rather than infrastructure, while still having the flexibility of SQL and real-time updates.

AI Engine

To power our intelligent matching system, we built a separate backend server using Express that leverages Google’s Gemini AI to generate semantic embeddings from user interests and profiles. When a user completes onboarding or updates their interests, our app sends this data to the AI server, which uses Gemini to compute high-dimensional embeddings. These embeddings are then used to calculate similarity scores between users, enabling us to suggest meaningful “Red String” matches—people with shared interests or compatible personalities. This AI-driven approach makes our social graph more dynamic and compelling.

Authentication

User authentication is handled via Supabase’s OTP-based email login. When a user enters their email, they receive a one-time code to verify their identity. This approach is both secure and user-friendly, eliminating the need for passwords. The authentication flow is tightly integrated with our onboarding process, which collects additional user information like MBTI personality type and interests.

Social Graph & Features

A standout feature of RedString is the visual social graph. We built a dynamic, interactive graph using React Native’s SVG and animation libraries, managed with React Context for state. This graph visually represents first, second, and third-degree connections, updating in real time as users make new friends or scan QR codes at events. The QR code scanner, built with expo-camera, allows users to instantly connect by scanning each other’s codes, which updates their connection graph in the backend.

Design & UX

Our design philosophy centered on a clean, modern interface with a signature “red string” motif, symbolizing connections. We used Figma, custom styles, and SVG elements to create a visually distinctive experience. Accessibility and responsiveness were priorities, ensuring the app looks and works great on all devices and screen sizes.

Challenges we ran into

Data Matching at Scale: Matching in real-time from large RSVP guest lists while considering both static traits and dynamic user reflections pushed us to optimize our models and caching layers carefully.

Accomplishments that we're proud of

Proud of building a project that can creatively challenge us, but also incorporate topics we care about, such as loneliness and social anxiety, while integrating a bit of culture.

What we learned

We learned the importance of visualizing data in ways that feel alive. Watching your social graph bloom from a single point into a web of possibilities made abstract connections feel tangible, even beautiful.