Designing a unified platform for 750+ mosques across 450+ cities — five surfaces, one design system, millions in donations processed.
MadinaApps is a SaaS platform built specifically for mosques — helping them manage donations, run apps, display prayer times, handle school fees, and engage their communities across the US and globally.
Think of it as an all-in-one operating system for a masjid: one account, five surfaces, zero fragmentation — from a wall-mounted kiosk to a parent's phone to the TV screen behind the imam.
Before MadinaApps, mosque administrators juggled separate tools for donations, communications, events, and displays. No unified experience — for the admin or the community member.
The design challenge: create a coherent product experience across physically different surfaces for users with very different needs and technical comfort levels.
I started not with screens but with a design system — components and patterns that could adapt across a 6" phone, a 15" kiosk, and a 55" TV without losing coherence.
Spoke with mosque admins and donors. Mapped user journeys per surface. Found where friction caused abandonment.
Shared component library — typography, colour, spacing, interaction patterns — before any screen was designed.
For each surface: what is the one thing a user needs to do here, and how fast can they do it?
750+ live mosques means patterns emerge at volume no prototype reveals. Design for flexibility from day one.
The kiosk is the most critical conversion surface — a donor walks up, taps, and either gives or leaves. I reduced the donation flow to 3 taps maximum. Large touch targets, high-contrast type, pre-set amounts with custom option, instant confirmation.
The Quick Tap Pay feature — a single-page, predefined-amount screen — was designed for Jumu'ah when queues form quickly. Speed was the entire design brief.
Two distinct users: the casual member who checks prayer times, and the engaged member who donates, RSVPs, and reads announcements. I designed a layered information architecture — surface simplicity for the first, depth for the second.
A unique surface — displayed on mosque TVs, viewed from across a room, no interaction. I created a modular layout system mosque admins configure from the web portal, with safe zones for prayer times, events, and announcements.
Mosque administrators are often volunteers. I simplified navigation to task-based sections (Donations, Events, Members, Display) rather than feature-based menus, reducing cognitive load significantly.
Unified design system across 5 surfaces — maintaining consistency at every touchpoint
Kiosk donation flow reduced to 3 taps, cutting abandonment during high-traffic prayer times
Admin portal redesigned for volunteer staff — task-based navigation replacing feature menus
Quick Tap Pay launched as a new product for Friday prayer donation queues
Building shared components upfront saved significant rework. When a kiosk, phone, and TV share the same tokens, consistency follows naturally.
A failed donation tap at a mosque during Friday prayer is embarrassing and trust-breaking. Designing for emotional context changes every edge case.
Mosque admins are often volunteers. Designing for their confidence was as important as designing for the donor.
With 750+ active mosques, patterns emerge at volume that no prototype reveals. Design for flexibility from the start.