The Greener Earth Project: Impact Dashboard
From emailing spreadsheets to a live platform. Clients now see where their trees grow, how much carbon they absorb, and how that impact builds over time.
3D Globe
Interactive Mapbox GL
CO2 Model
Age-weighted growth
Reports
Branded PDF generation
Full Admin
Back-office platform
The Brief
GEP came to us with a clear problem. Clients got impact reports by email. Donations were handled offline. There was no single place for supporters to see the real difference their money was making.
They wanted to go online. A platform where clients could log in, track their impact, download branded reports, and see the combined difference GEP was making around the world.
What We Built
A full impact tracking platform. Part client dashboard, part admin control centre. Built around a 3D globe that brings GEP's tree-planting projects to life.
Client Dashboard
Interactive 3D Globe
A spinning globe that pins every planting site around the world. Community and personal markers use different colours and sizes. Hover any pin to see the partner, tree type, project, and progress.
Personal Impact Metrics
See total giving, trees planted by site, and CO2 absorbed now and at maturity. The model reflects that young trees absorb less carbon than mature ones.
CO2 Sequestration Chart
A stacked chart that tracks CO2 absorbed over time, split by planting site. Clients watch their green impact grow month by month.
Branded Impact Reports
Branded multi-page reports with cover art, key stats, maps for each site, giving history tables, SDG links, and a full method section on how we calculate carbon.
Admin Back-Office
Client Management
Add new clients with secure auto-made logins. Edit accounts and manage roles. A full CRM for GEP's growing user base.
Contribution Tracking
Add gifts one at a time or bulk-import via CSV with live row checks. Each gift auto-updates impact stats and globe pins.
Branding Controls
A live colour picker that spreads brand colours across the whole platform. Buttons, charts, and reports all update at once. Plus a carousel manager for offers.
Admin Impersonation
See any client's dashboard as they see it, with no need for their login. Manage sites with map pins, partner info, tree types, and base counts.
Technical Highlights
Mapbox GL Globe Projection
Full globe view with atmosphere effects, auto-spin, zoom-based marker sizing, and pop-ups with backdrop blur. Community and personal pins use different colours and sizes.
Age-Weighted CO2 Model
Saplings absorb about 5 kg CO2 per year. Young trees absorb about 12 kg. Mature trees absorb about 22 kg. The model blends these stages smoothly for realistic growth forecasts.
Supabase Backend with Row-Level Security
Row-level security keeps client data strictly apart. Each client only sees their own gifts, impact data, and reports. This is enforced at the database level.
Dynamic Report Generation
Print-ready HTML docs with embedded maps, encoded images, and dynamic brand colours. Each report is unique to the client and updates as new gifts come in.
React + TypeScript + Vite Stack
TanStack Query for data, Recharts for CO2 charts, and shadcn/ui for the interface. The same fast, modern stack OYNK uses on every project.
The Result
GEP went from emailing spreadsheets to a polished, live platform. Clients see where their trees grow, how much carbon they absorb, and how impact builds over time. The admin team runs everything without touching code. Every client gets a branded report they can share with their own people.
Global
Planting locations mapped
Real-time
Impact tracking
Branded
Report generation
Zero code
Admin management
Have a Platform Idea?
We build more than websites. If you need a dashboard, tool, or platform that brings your data to life, let us talk.