7links

• 

  Relationship graph

Inspiration

7links was inspired by Kazakh culture, where knowing extended family and distant relationships is deeply valued. The tradition of Жеті ата (Zheti Ata) teaches people to remember seven generations of ancestors. We wanted to bring that spirit into modern everyday relationships.

What it does

7links is a private relationship atlas. It organizes direct connections into islands such as family, friends, school, and work. Secondary connections remain visible but dimmed, while selecting someone reveals their branch and connection back to you. It also includes relationship notes, event reminders, search, and a Bridge Finder that shows how two people are connected.

How we built it

We used React, TypeScript, Vite, D3, react-force-graph, Supabase Auth, and Vercel. Custom layouts keep direct connections organized while arranging secondary connections into readable trees.

Challenges we ran into

Our biggest challenge was displaying complicated relationships without overwhelming the user. We also had to balance clicking, dragging, animation, and performance while keeping navigation intuitive.

Accomplishments that we're proud of

We created a graph that clearly distinguishes direct and indirect relationships while always keeping the user anchored at the center.

What we learned

We learned that relationship visualization is less about displaying every connection and more about showing the right context at the right moment.

What's next for 7links

Next, we plan to build an iOS app, add privacy-first contact importing, encrypted synchronization, improved reminders, and better support for larger networks.

Built With

• css
• html
• react
• supabase
• typescript
• vercel
• vite