A clickable prototype of the redesigned QuranFlow app — the semester program, rebuilt around one question: where am I, and what's next?
OPEN THE APP →Best on a phone — tap the Share button → Add to Home Screen for the full-screen experience. Everything is tappable.
Students were doing the work — watching, reciting, showing up — and still felt lost in their own program.
"8 out of 15" never read as Week 8. Students didn't know what week they were on, when the semester started, or what to do today.
The live schedule sat five clicks deep behind an external calendar link. Students missed sessions they fully intended to attend.
Coach feedback arrived and students never saw it — the "Feedback" button read as give feedback, and notifications carried no context.
A hi-fi prototype of the iOS app. Clickable, not final art. It shows structure and direction.
One member, mid-journey. Sarah, Week 8 of a 15-week semester. She watches the week's tajweed lesson, records Al-Mulk 67:1, and hears her coach's notes on the exact words.
The coach's side is included. The last chapters cross to the coach app: the review queue, reviewing a recitation, and the coach's schedule.
Real curriculum, demo data. Lessons and verses are drawn from the actual program; names, dates, and counts are fixtures.
It opens into a guided tour. A rail under the phone walks ~20 chapters in order, in five acts: getting oriented → the weekly rhythm → sessions & coaching → learn & progress → the coach app. Step with the ‹ › buttons, or the arrow keys on a laptop.
Or explore freely. Tap ✕ on the rail and just use the app — four tabs (Today · Learn · Sessions · You), the lesson, the recorder, booking. Everything is live.
Prefer no chrome at all? The App is the same build with the tour hidden — first-person, like the shipped product.
Progress is a real semester, not a fragile counter. Nothing shames, nothing expires at midnight for effect.
Every screen shows what's next, one week reference, one primary action. Depth on demand, never all at once.
Every session renders in the viewer's timezone, stated once per screen — never a guess, never someone else's clock.
Week, next session, and feedback meet the student before the app opens. Reading the week's verse there and never opening the app is a success.
First-person, no walkthrough chrome. Starts at onboarding, lands in Week 8. Tap through like the real thing.
Open →The same app with a narrated rail — ~20 chapters explaining what you're looking at and why it's designed that way.
Open →How two design explorations became one app: screen-by-screen comparison, every decision adjudicated and logged, closed with the final design review.
Open →One week lived on the lock screen, widgets, and Dynamic Island — reaching students before the app opens.
Open →Suggested path for a first read: tap through the walkthrough, skim Feedback Synthesis for the why, then go where your role takes you — Product Spec and Data Model for engineers, Traceability for the PM, the reconciliation board for design reviewers.