Qarta

Client
- Qarta
Project type
- Digital Encyclopedia
What I did
- React 19
- TypeScript
- Vite
- three.js
- Web Audio API
- Groq
- EN / FR / AR — RTL
Year
- 2026
Qarta is a reference work rather than a search box. Fifteen volumes stand on a shelf; four are written and readable, each a real book with chapters, articles, running heads, folios and pages that turn. Every article can be read at four depths, from a paragraph a child can follow to the expert account, and every plate is an instrument rather than an illustration — an orrery, a globe that spins, the periodic table, a black-hole merger you can hear. It ships as a static site in three editions, English, French and Arabic, on three runtime dependencies.
- 01
A search result answers the question you asked and tells you nothing about the question beside it. The encyclopedia's real gift was adjacency — the article you were not looking for — and the search box threw it away.
- 02
Reference sites have converged on one undifferentiated column of text. Nothing tells the reader how deep they are, how much is left, or where this sits inside a larger body of knowledge.
- 03
The same article has to serve a curious eleven-year-old and someone who needs the actual figure. Most sites pick one and lose the other, or split into a children's edition nobody maintains.
- 04
When a generative model writes a reference answer, the reader has no way to separate curated fact from plausible invention, and no page to check it against.
- 05
The illustrated plates were the part children remembered. A flat image of a diagram is not that — it is a photograph of something that used to be explorable.
- 06
Arabic reference works online are usually a left-to-right layout with Arabic poured into it, which is not how an Arabic book is read.
- 01
The book as the interface, taken literally: a shelf, closed volumes, spreads that turn, running heads, folios, a table of contents — with definitions, instruments and notes laid over the page rather than replacing it.
- 02
Four reading depths on every article, so one body of content serves the child and the specialist without forking into two products.
- 03
An order of trust enforced by the architecture rather than promised in the copy: curated editorial content first, identified external sources second — each carrying its source, licence and retrieval date — machine interpretation last, each a separate service the interface cannot confuse.
- 04
A reference desk that answers immediately and prints the page it answered from; where the book has no answer it says so and marks the outside source as outside. Every answer ends by offering somewhere to go next.
- 05
Margin notes written by a language model from the cited pages only, each note stating how it was written. With no key configured the note is composed locally instead, so the feature degrades rather than disappears.
- 06
Plates built on reusable engines — an orrery, a chart engine, a timeline, a globe — so a new plate is a configuration rather than new code. three.js loads only when a reader asks for three dimensions; molecules are drawn in SVG.
- 07
Photographs fetched from Wikimedia Commons at read time and shown only where the metadata records a free licence, with author and licence displayed beside them.
- 08
A full Arabic edition in which the book itself is mirrored — the cover hinges on the right, pages turn the other way, the index reorders by the Arabic alphabet — rather than an interface with its margins flipped.
Looking something up
A question typed at the door returns an answer taken from a page of the book, the page reference printed under it, and a short row of places to go next. That is the whole first door, and most visits should be able to end there.
Reading a volume
A volume comes off the shelf and opens as a book. Pages turn, chapters and folios sit where they belong, and the depth control rewrites the article rather than moving the reader somewhere else.
Opening a plate
Mars is a labelled plate on the right-hand page. Asking for three dimensions turns it into a globe that spins under the pointer, with its volcanoes and canyons listed beside it, each one a way back into the text.
Reading it in Arabic
The whole book flips. The spine moves to the right, the article takes the right-hand page, the running heads and folios follow, and the index reorders by the Arabic alphabet — the same encyclopedia, set as an Arabic book.

Two front doors on one screen: a question box that answers at once, and fifteen volumes to take down and open. Four are written and readable; the shelf says plainly that the others are still being set.
AgriSmart





