Columbus

• 

  Columbus light theme image 7

• 

  Columbus dark theme image 2

• 

  Columbus dark theme image 7

• 

  Columbus dark theme image 6

• 

  Columbus dark theme image 5

• 

  Columbus dark theme image 3

• 

  Columbus light theme image 6

• 

  Columbus dark theme image 4

• 

  Columbus dark theme image 1

• 

  Columbus light theme image 1

• 

  Columbus light theme image 4

• 

  Columbus light theme image 3

• 

  Columbus light theme image 5

• 

  Columbus light theme image 2

• 

  Columbus light theme image 8

Inspiration

Columbus was inspired by the idea of making global discovery feel interactive, social, and rewarding. We wanted exploring countries to feel more meaningful than scrolling through facts on a page.

What it does

Columbus is a world-exploration game where users travel between countries, spend and regenerate energy, collect passport stamps, track progress toward visiting all 195 countries, read country details, and chat with other explorers in country rooms.

How we built it

We built Columbus with React, TypeScript, Vite, Tailwind CSS, Leaflet, and Supabase. Leaflet powers the interactive map and travel animation, while Supabase supports authentication, profiles, passport stamps, chat, and leaderboard data. The project is also configured as a Progressive Web App.

Challenges we ran into

Balancing map navigation, distance-based energy costs, reliable progress tracking, guest versus authenticated data, and real-time Supabase state. We also had to handle asynchronous data safely so older requests could not overwrite newer user interactions.

Accomplishments that we're proud of

We created a polished map-first experience with travel mechanics, energy management, passport progress, country search with visited and unvisited filters, country chat, persistent theme and sound preferences, and installable PWA support within a week.

What we learned

We learned how to manage complex state in an interactive map interface, coordinate client-side data with Supabase, handle repeated authentication events, calculate travel distance and energy costs, and design consistent progress tracking across multiple parts of an application.

What's next for Columbus

Next, we want to expand country content, improve leaderboard data, add richer social interactions, introduce achievements and route challenges, and continue improving offline support and mobile usability.

Codex and GPT‑5.6 were used as development collaborators to inspect the codebase, reason through map and state behavior, implement focused improvements, and validate production builds. GPT‑5.6 is not used at runtime; country data is currently local.

Built With

• leaflet.js
• pwa
• react
• supabase
• tailwind
• typescript
• vite
• workbox