Case study · Learning · 2025
Seera (السيرة) · an interactive, sourced timeline of the life of Prophet Muhammad ﷺ
Learning the Seerah usually means long books or scattered videos. Seera turns it into one continuous, scrollable timeline — from 53 years before the Hijra to 11 AH — where every event carries its source.
The idea#
Make the Prophet's ﷺ life explorable: see the order of events, jump between eras, filter by what interests you (battles, revelations, migrations, marriages, ordinances) and always be able to check where a fact comes from. In Arabic, right-to-left, on any device.
What I built#
- A continuous timeline of 84+ events across five eras, each documented with its source.
- Navigation that respects the subject: scroll the whole journey, jump between eras, search, or filter by event type, with a progress indicator and a light and dark mode.
- A structured, sourced dataset underneath, so events can be added and verified without touching the interface.
- A fast, static build that loads instantly and works offline-ish on slow connections.
How#
React with a custom timeline engine and a structured dataset, Arabic typography and right-to-left layout done carefully, and a static deployment. Solo design and development, with restraint in the design: the content carries the page.
Outcome#
A live educational site used by people learning the Seerah, and a reference build for content-heavy, bilingual, right-to-left interfaces — the kind of work that carries straight into Arabic-first products for the Middle East.
More work
