Inspiration
Munich is a city of 180 nations, yet we often live in parallel societies. While 28% of the population are foreign nationals, existing platforms like InterNations create expat bubbles, and Airbnb Experiences are designed for tourists, not neighbors. We wanted to simplify integration, turning the intimidating process of meeting new people into a rewarding adventure.
How we built it
We built KulturKonnect as a high-performance web application using Next.js App Router for the frontend and Supabase for our real-time database. For the map, we integrated Mapbox GL JS to create an interactive exploration layer, using custom markers to display country flags dynamically based on the event's cultural origin. We track user progress, so when a user attends an event, the system updates their Stamps array in the database and unlocks new visual badges. Finally, we used Tailwind CSS to design the UI.
Challenges we ran into
Synchronizing the imperative nature of Mapbox, which modifies the DOM directly, with React's declarative state management was tricky. Designing the Journal Entry popup to handle variable amounts of content like photos and long text summaries was a UI challenge as well. We also had to manage a major pivot, as we originally started with a sustainability idea but switched halfway through to a social integration platform, forcing us to redesign our database schema and UI components rapidly under pressure.
Accomplishments that we're proud of
We are incredibly proud of the visual polish of the Passport interface. Seeing the progress bar fill up and the stamps appear gives a genuine dopamine hit that we believe will drive user retention. Successfully implementing the interactive layer in Mapbox makes the app feel premium and immersive compared to standard maps. Unlike many hackathon projects that are just tech demos, this feels like a product that could launch in Munich tomorrow and solve a real social problem.
What we learned
On the technical side, we learned the use client directive in Next.js 13+ and how to bridge third-party libraries like Mapbox with React Server Components. We also learned the importance of consistent spacing and typography using Tailwind to make an app feel trustworthy and official. In addition to the tech side we learned important collaboration skills and software management abilities.
What's next for KulturKonnect
We want to ultimately make KulturKonnect more scalable which would include, among others aspects, improving database integration by moving from our current hackathon structure to a fully Supabase architecture. We also aim to leverage Google Gemini to significantly enrich the Passport and Memories features. Instead of static entries, we will use Gemini to analyze uploaded photos and event metadata to auto-generate cultural summaries for each journal entry. This would effectively turn a simple stamp collection into a AI-curated cultural biography for every user. Lastly, we will expand on more social features of the application.
Log in or sign up for Devpost to join the conversation.