People's Postcode Lottery Impact Tracker Interactive Map Visualization of Community Donations 🎯 Project Overview The People's Postcode Lottery Impact Tracker is an innovative web application that transforms how players visualize and understand the real-world impact of their lottery participation. By combining interactive mapping technology with compelling storytelling, this platform creates an emotional connection between players and the communities they support.
🚀 Key Features 📍 Interactive London Map
Real-time geolocation to show charities near the player's location Google Maps-style pin markers distinguishing directly supported vs. local charities Intelligent marker distribution algorithm preventing clustering for better visibility Responsive design optimized for mobile, tablet, and desktop experiences 💝 Compelling Impact Stories
12 authentic charity profiles across diverse London boroughs Personal transformation narratives showing real people helped by donations One-click access to detailed success stories from beneficiaries Emotional storytelling that demonstrates tangible life changes 🎨 Brand-Aligned Design
Faithful recreation of People's Postcode Lottery visual identity Custom color palette (#5FB61A green, #F4C400 yellow, #FF6A00 orange) Responsive layout ensuring accessibility across all devices Professional UI/UX following modern web standards ⚡ Technical Excellence
Built with React 18 and TypeScript for type safety and performance Vite development environment for lightning-fast hot reloading Leaflet.js integration for smooth, interactive mapping SQLite database with realistic charity data and locations Custom CSS animations and hover effects for enhanced user experience 🎪 Live Demo Highlights User Journey Simulation
Welcome Screen: Players enter their postcode and donation amount Impact Visualization: Animated transition to interactive map showing their area Charity Discovery: Click pins to explore supported organizations Story Engagement: Read inspiring stories of lives transformed Community Connection: Suggest new charities for future support Technical Showcase
Smooth pin hover animations without position glitching Responsive design demonstration across multiple screen sizes Real-time distance calculations from user location Modal popups with charity details and impact stories Suggestion form for community-driven charity recommendations 📊 Impact & Value Proposition For Players:
Visual proof of donation impact in their local community Emotional connection through personal transformation stories Discovery of new local charities and causes Enhanced engagement with the lottery brand For People's Postcode Lottery:
Increased player retention through emotional engagement Transparent demonstration of community impact Modern, professional brand representation Potential for viral sharing of inspiring stories For Charities:
Increased visibility and awareness in local communities Platform for sharing success stories and impact Potential for new donor acquisition Recognition as part of the lottery's impact network 🛠 Technical Implementation Frontend Stack:
React 18 with TypeScript for robust component architecture Tailwind CSS for rapid, responsive styling Leaflet.js for interactive mapping capabilities Vite for optimized development and build processes Data & Infrastructure:
SQLite database with sample charity data across London Geolocation API integration for user positioning RESTful API design for charity data management Responsive image optimization for fast loading Performance & Accessibility:
Mobile-first responsive design principles Semantic HTML structure for screen reader compatibility Optimized images and lazy loading for fast performance Cross-browser compatibility testing 🎯 Future Enhancements Integration with live charity databases Social sharing functionality for impact stories Personal donation tracking and history Gamification elements to encourage continued engagement Expansion to other regions beyond London This project demonstrates the power of combining meaningful data visualization with emotional storytelling to create genuine connections between donors and the communities they support, ultimately strengthening the People's Postcode Lottery brand while showcasing real community impact.
What is it? A fun educational app that helps kids and teens (ages 8-16) learn about money management through interactive games and activities.
Age Groups: Money Masters (Ages 8-11)
Fun money games like Coin Catcher 🪙 Money Math challenges 🧮 Savings Sorter game 💰 Finance Warriors (Ages 12-16)
Savings Workout tracker 💪 Budget Mastery tools 📊 Investment Basics guide 📈 Bank Card Guide 💳 FinBuddy AI Chat for money questions 🤖 Cool Features: Score System 🏆
Earn points for learning and good financial decisions Track your progress with a trophy display FinBuddy Chat 🤖
AI chatbot that answers money questions Get friendly financial advice and tips Financial Assessment 📝
Fun quiz to understand your money personality Get personalized tips based on your answers Interactive Games 🎮
Learn while playing Track savings goals with visual progress bars How to Use: Log in and choose your age group Take a quick financial assessment Get a personalized learning path Play games, track savings, and chat with FinBuddy Earn points as you learn and grow! The app makes learning about money fun and engaging, perfect for young people starting their financial journey!
Built With
- 18
- apis
- browser
- cloud-services
- css
- databases
- frameworks
- gps
- leaflet.js
- openstreetmap
- platforms
- postgresql)
- react
- supabase
- tailwind
- typescript
- vite
Log in or sign up for Devpost to join the conversation.