Circles

Home Page
'Create new event' modal: page 1
'Create new event' modal: page 2
Event Confirmation Modal, Gallery Upload View
User Profile Page
Event Memories
Page for Hiking Group circle (shows upcoming scheduled events; events proposed by Circles; and shared GCal availability)
Popup for creating a new circle
Circles suggests plus ones when a user creates an event!
Figma designs

Inspiration

Keeping up with friends is hard. College students balance school, work, and a million other commitments; we're invested in meeting up with friends, but between finding common times, sending messages, and coordinating locations, making actual plans often feels impossible.

From research with 50+ students, we found these challenges are common. Existing tools like when2meet and Google Calendar help with one-off events but still require manual effort and don’t promote spontaneity or ongoing connections.

We identified a clear need for a frictionless hangout planning solution tailored to strengthening existing friend circles and creating new ones. Enter Circles.

What it does

Circles is a web app for easy, spontaneous meetups within friend groups and connecting with new people. Users can invite friends to form circles, and with GCal integration, Circles automatically finds shared free times and suggests activities. For example, if all members are free Thursday from 6-7:30PM, Circles might suggest a hot pot dinner! In addition to an interface view, Circles also emails proposed meetup times and events every Monday or on request. We also support 2 other key features: (1) inviting mutual friends who are free, to encourage making new friends, and (2) creating shared photo albums for events, with photos stored via Pinata.

How we built it

Circles was built upon a Next.js frontend with React and JS/TS; an integrated Node.js backend; and a Supabase database for data management.

Further, we used the Mailgun API for sending friend invitation emails and event suggestion emails. The Pinata API was used for uploading, storing, and sharing event photos. Google Cloud APIs was used for email-based auth and Google Calendar access. Shadcn and Radix UI components were used for frontend development.

Finally, we used Figma for design, Google Forms for user research, GitHub for version control, and Vercel and GoDaddy for deployment.

(+ powered by Celsius & snacks)

Challenges we ran into

We encountered several technical challenges during development:

Second-degree Node Matching: Implementing the "+1" feature for finding and suggesting mutual friends. State Management: Maintaining state between modals
Performance Optimization: Dealing with numerous data calls required us to implement parallel processing techniques.
API Limitations: We initially planned to use Twilio for SMS notifications but had to pivot to email reminders due to phone number verification restrictions. This change actually improved our integration with Google Calendar. In addition, we encountered conceptual challenges as we ideated our product. We spent considerable time defining user flows and value propositions – for instance, resolving questions about the relationships between users, circles, friends, and events.

Accomplishments that we're proud of

Technical Problem-Solving: We developed several novel solutions and features, including: An algorithm to find common free times among multiple Google Calendars A custom-generated calendar visualization to render these common times Efficient data querying and processing methods: parallelizing operations to combat the large number of queries and operations User-Centric Design: We're proud of making Circles not just functional, but fun. Our pastel color palette and exciting event recommendations (like Saturday morning pickleball or afternoon apple picking) create an app that we and our friends would genuinely use. Rapid Iteration: We went through the complete design cycle in a short timeframe (analyzing 50 user surveys and iterating on many designs and product concepts). Potential for Real-World Impact: We've created a solution that addresses a genuine problem among college students. Excited to share it with our friends and student organizations :)

What we learned

Technical Skills:

Practicing advanced data querying techniques
Working with new tech stacks and dev tools: Supabase, Tailwind CSS, Cursor
Integrating multiple APIs (email services, Google Calendar, photo storage) UI/UX Design:
Doing very rapid prototyping and iteration
Analyzing 50 user surveys, identifying pain points and incorporating feedback
Balancing aesthetics with functionality Project Management:
Effectively distributing tasks and collaborating in a very short timeframe!
Adapting to unforeseen challenges and pivoting when necessary ## What's next for Circles
Partnering with university clubs and organizations to grow our user base and gather more diverse feedback
Increasing spontaneity: we currently support mutual friend suggestions, but we want to strengthen it to encourage more impromptu meetups
AI-powered recommendations: we want to develop a more sophisticated, personalized activity recommendation system using AI to take in users' interests and output tailored activities and times
Calendar invite addition: we want to automatically create GCal invites for events that are planned and confirm through Circles
Social Features: Having a social or private events feed, similar to Venmo