Sanabil

Inspiration

Sanabil was inspired by the idea that charitable giving should be intentional, transparent, and ongoing, not just a one-time transaction. In many donation platforms, donors give money and immediately lose visibility into what happens next. There is little sense of journey, accountability, or personal growth tied to giving.

Sanabil draws inspiration from the Islamic concept of niyyah (intention) — the idea that actions are defined not just by outcomes, but by the sincerity and mindfulness behind them. We wanted to design a system where donors could give with intention, track impact over time, and remain emotionally and ethically connected to the causes they support, whether local or global.

What it does

Sanabil is a visual charity impact platform that allows users to explore charitable causes across the world through an interactive 3D globe. Each point on the globe represents a cause, categorized as local or global, and shows its current status (e.g., Seed Planted, In Action, Impact Delivered).

Users can click into a cause to see:

• a donation summary
• a timeline of updates
• progress tracking similar to an Amazon delivery experience (from funding → action → delivery)
• contextual information that explains how impact unfolds over time

The platform also introduces the idea of long-term donor engagement through incentives. As a donor’s lifetime contributions reach certain milestones, they could unlock meaningful incentives such as charity service trips, on-site volunteering opportunities, or behind-the-scenes involvement, reinforcing that giving is not just financial, but participatory.

All data shown in the current version is simulated for demonstration purposes, designed to model how a real system would behave once connected to verified organizations and real donations.

How we built it

• Frontend: React 19, Vite 6, React Router v7, Tailwind CSS v4
• 3D & Visualization: globe.gl, Three.js, Recharts
• Backend: Node.js (ESM), Express 5, SQLite (better-sqlite3), CORS
• Tooling: npm, Nodemon, PostCSS/Autoprefixer

Challenges we ran into

One challenge was designing a schema that could represent intention, progress, and accountability, not just raw donation numbers. We had to think carefully about how status updates, timelines, and incentives would fit together in a way that felt natural and trustworthy.

Accomplishments that we're proud of

• Designed an Amazon-style impact tracking timeline for charitable causes
• Incorporated niyyah and ethical intentionality into a technical system
• Created a foundation for long-term donor engagement through incentives
• Balanced local and global causes in a single, intuitive interface

What we learned

We learned that architecture matters, even at the demo stage. Separating frontend, backend, and database logic made the system easier to reason about and extend. We also learned that meaningful products emerge when technical decisions are guided by values, in this case, transparency, intention, and accountability.

What's next for Sanabil

Next, we plan to:

• Connect Sanabil to real charities and verified impact data
• Introduce donor profiles with intention setting and lifetime impact tracking
• Implement incentive tiers tied to meaningful service opportunities
• Add verification layers and audit trails for trust
• Deploy Sanabil to a scalable production environment
• Expand the tracking system with photos, documents, and partner updates Sanabil is a step toward reimagining charitable giving as a transparent, intentional, and lifelong journey, rather than a momentary transaction.

Built With

• cors-tooling:-npm
• express-5
• frontend:-react-19
• nodemon
• react-router-v7
• recharts-backend:-node.js-(esm)
• sqlite-(better-sqlite3)
• tailwind-css-v4-3d-&-visualization:-globe.gl
• three.js
• vite-6