Quran Accomplisher – Dynamic Quran, Prayer & Dhikr Tracker

A dynamic Quran completion and prayer tracking system with real-time progress recalculation and performance insights.

Click to jump to sections

Problem & Solution
Result
My Apporach
Core logic
Testing

Role

Product Designer & Builder

Timeframe

August, 2025

Tools

Figma, Lovable.ai

Context

See Live Website

This project started from a personal problem.

I wanted to complete the Quran within a fixed timeframe. I calculated how many pages I needed to read daily. But whenever I skipped a day or read more or less than planned, I had to manually recalculate everything.

The more I adjusted, the more time I spent recalculating instead of reading.

So I built a tool to automate it.

Problem

Manual planning breaks easily.

If:

  • A day is skipped
  • More pages are completed
  • Fewer pages are completed
  • The deadline changes

The entire plan needs recalculation.

This creates friction and discourages consistency.

I needed a system that could adjust dynamically.

Solution

I designed and built a dynamic progress tracker that:

  • Accepts total Quran pages, current page, and target completion date
  • Optionally excludes menstrual days from the calculation
  • Automatically generates daily reading targets
  • Allows manual input of actual completed pages
  • Recalculates remaining pages in real time if progress changes
  • Adjusts targets when days are missed ( user did not input completed task)

If a day is missed, the system detects it and redistributes the remaining pages across valid days.

Instead of fixed numbers, the system responds to real behavior.

 

Result

I used the product personally and completed the Quran within two months.

The experience validated the logic and usability in real life.

My Approach

I first designed the full experience in Figma , defining layout, task flow, and progress logic.

Then I built the working product using Lovable. At the time, Lovable was still limited compared to what it can do today, so building dynamic recalculation required careful logic and repeated adjustments.

All progress and calculations run in session, meaning the system updates immediately based on user input.

The Core Logic

The app allows users to:

  • Enter total pages, current page, and target completion date
  • Optionally excludes menstrual days from the calculation
  • Receive daily reading targets
  • Manually update actual completed pages
  • Reset the entire plan if needed

Every time a user:

  • Skips a day
  • Completes fewer pages
  • Completes more pages
  • Changes progress manually

The system recalculates remaining pages and redistributes the workload across the remaining valid days.

No manual math needed.

Prayer & Dhikr Tracking

I extended the product to include session-based prayer and dhikr tracking.

  • Start and stop multiple sessions per day
  • Track total time spent in praying
  • View daily and weekly summaries

This complements the reading tracker by building consistent habits.

Testing & Iteration

The most challenging part was ensuring the math worked in every scenario.

I tested the product for weeks by:

  • Skipping multiple days
  • Completing partial targets
  • Over-completing targets
  • Changing deadlines mid-progress

There were early calculation bugs and edge cases that required adjustments. After multiple refinements, the redistribution logic became stable and reliable.