A retro-styled, pixelated interactive memory mapping experience built for the SESA x WDCC Hackathon 2025 by Team Fullstack Big Backs, under the theme "Nostalgia".
Our application lets users create, explore, and share cherished memories on a beautifully rendered 3D globe. Every interaction is designed to feel like a journey through time: from the nostalgic pixel-art interface to the retro audio effects, the entire experience evokes the charm of early web and gaming eras.
Users can drop memory pins anywhere on the globe, attach photos, write reflections, and browse through others' stories across time and space. The app supports live collaboration, custom avatars, and seamless sharing through unique globe links. Whether it's childhood vacations, school moments, or digital friendships, every memory finds a place.
This project is more than just a map. It's a digital scrapbook shaped by community, creativity, and a longing for the past — all brought together through modern fullstack engineering with a retro soul.
- Pixelated Aesthetic: Retro 8-bit style map with dynamic pixelation effects
- 3D/2D Toggle: Switch between immersive globe view and traditional 2D map
- Custom Pushpins: Pixel art pushpins with unique colors for each user
- Real-time Location: Automatic geolocation with "Locate Me" functionality
- Pin Memories: Click anywhere on the map to create new memories
- Rich Content: Add photos, journal entries, voice memos, and tags
- Timeline View: Browse memories chronologically with interactive timeline
- User Profiles: Personalized experiences with unique usernames and colors
- Pixel Perfect: Authentic pixel art pushpins with 3D shading
- Color-Coded Users: Each user gets a unique color scheme
- Smooth Animations: Fluid transitions and hover effects
- Responsive Design: Works seamlessly across devices
- Geocoding: Search for places with integrated Mapbox Geocoder
- Memory Search: Find memories by location, date, or content
- Globe Navigation: Smooth flying transitions between locations
- Marker Visibility: Smart marker hiding/showing on globe rotation
- Frontend: React 18 with Vite
- Mapping: Mapbox GL JS with custom styling
- Styling: Tailwind CSS with custom pixel fonts
- Storage: localStorage for persistent user data
- Icons: Custom pixel art SVG icons
- Audio: Web Audio API for voice memos
Each user gets a unique color for their pushpins:
- wander_joe: Red (#E74C3C)
- dave_explorer: Pink (#FF69B4)
- mclovin: Blue (#3498DB)
- sesalover123: Yellow (#F1C40F)
- ibrahimovic: Purple (#9B59B6)
- rocketleaguer55: Teal (#1ABC9C)
Made with ❤️ and pixels - Turn your world into an interactive memory map!