The challenge
Most Islamic habit apps fail at retention. They either over-gamify (and lose sincerity) or under-design (and feel like a spreadsheet). We wanted to build something that respected the act of worship — but still pulled users back daily without nagging.
Constraints
- Zero-budget launch — could not buy reach, had to earn it via SEO and word of mouth.
- Audience spans casual Muslims to memorization-serious students — UI had to scale both ways.
- Single founder + AI agents — every feature had to be reusable across other Idin Studio mini apps.
- Must work offline on entry-level Android in mosque Wi-Fi conditions.
How we approached it
We split the problem into 7 thin sub-features (tracker, Qur'an, hadith, doa, dhikr, qibla, qurban) and shipped one at a time, keeping each independently useful. Architecture-wise: Next.js 15 App Router with RSC by default, Payload CMS as the content + admin spine, Auth.js for Google OAuth (lowest-friction sign-in for Indonesian users), and PWA with custom install prompts. Streak gamification and share-cards were added last — once the core daily loop worked.
Outcome
- Installable PWA — no app-store friction; daily-active retention measurable from week 1.
- 7 sub-features shipped in 8 weeks with one consistent design system.
- Patterns reused: PWA shell, gamification engine, share-card generator, and i18n setup now power Rukun, Zakat, and Hafalan — cutting their build time by ~60%.
- SEO traffic from Islamic long-tail keywords (high-intent) — sustainable acquisition without paid ads.
- Monetization unlocked via donation tier + sponsor slots inside non-worship surfaces — no ads on prayer screens.
What we learned
Spiritual products live or die on credibility. The fastest way to lose users is to over-gamify a sacred act. The fastest way to gain them is to ship one tiny feature that genuinely helps tonight — then earn the right to add the next. Treat each sub-feature like its own product with its own first-week outcome, and the portfolio compounds.
Tech stack
- Next.js 15 (App Router, RSC)
- Payload CMS
- PostgreSQL
- Tailwind CSS v4
- Auth.js v5 (Google OAuth)
- PWA (installable, offline-capable)
- next-intl (ID + EN)
- Web Share API + haptic feedback
Timeline
1 sprint (1 week) to MVP, 2 weeks of polish, then 5 weeks of weekly sub-feature drops. Ongoing maintenance handled by retainer.
Visit Nawafil