HumanityGrand Timelines
An interactive map of thought — 5,000 years of philosophy on one axis — that began as a print experiment and grew into a teaching instrument. I directed it end to end: product, interaction, data-viz, frontend, and a small team of AI agents.
Open this case
Project Title
Humanity Grand Timelines — Philosophy Volume
Project Description
Humanity Grand Timelines places 500+ philosophers on one continuous axis, from the Vedic sages to living analytic philosophers. As Lead Product Designer I directed and built it end to end — the mental model, the density engine that keeps 5,000 years legible, three views of a single axis, the dataset and its verification policy, the design system, and the frontend that ships it. I also directed four AI agents through written charters and file-based handoffs.
Company
Studio ENCRE & LUMIÈRE
Product area
Education / Data visualisation
Role
Lead Product Designer & Director
Platforms
Web, print & PDF export
Timeframe
2026 — Present
Origins
From print experiment to a teaching tool
It started playful — philosophy laid out in time like a printed wall chart. The moment teachers became the audience, the bar changed: legible at every zoom, honest about anything interpretive, printable. The far goal keeps me honest — philosophy simple enough to be taught before high school.
Continue reading
Skip to Demo
A timeline that shows everyone is unreadable. One that shows only the famous is a lie about history. Five problems, and the calls I made:
Decision 1Arrive somewhereThe intro unrolls the timeline like a printed volume — a crawl that rushes into the axis — and the arrival always lands on a populated stretch, never empty paper. A first screen that looks empty reads as broken, whatever the truth is. Later, the landing was randomised so that you never land on the same spot. added to the unrolling effect, the experience is close to a subtle slot machine.
Relationships. Socrates arrives from the left, Aristotle departs to the right, the sophists hang dashed between them.
Decision 2Let the zoom decide who speaksShrinking type until everything fits produces a wall of grey. I treated every label as an editorial judgement instead: the most consequential thinkers hold their names at any distance, the rest arrive as the reader comes closer. Zoom becomes the reader's question — show me more — and one rule keeps it classroom-safe: names never overlap, at any zoom.
Relationships. Socrates arrives from the left, Aristotle departs to the right, the sophists hang dashed between them.
Decision 4Typed links, one thinker at a time“Influenced” is a mushy word — it flattens a teacher, a critic and an heir into one grey arrow, and all 463 links at once is spaghetti. So arcs appear only for the thinker you selected: this is Plato's world, not philosophy's. Colour carries the kind of link amongst 6 types of relationships, critique is dashed, opacity marks how well-sourced it is, and hovering phrases it as a sentence — “Socrates taught Plato.” A conversation rather than a diagram.
Decision 3Cluster ModeAll the way out, single markers stop meaning anything, so the whole corpus becomes one shape — where thought concentrated, where the silences fall. A static chart is a dead end in a lesson, so it is playable: move along it and it names the generation you are on; click a surge and it opens into the topics and figures underneath.
Decision 5Trace the evolutionA timeline of people is a roll call. Philosophy's most teachable habit is disagreeing with itself across centuries, so one question — rule by virtue against rule by law — splits the axis into two strands. Clicking a mark sets that thinker's position beside another's, in the same grammar as the main view.
The data
A frozen spreadsheet of 500 names became four linked tables — people, relationships, concepts, events — enriched in seventeen resumable batches, each gated by a validator. Once the pipeline read its own roster, the set could grow to 519.
500+
Figures
44
World events
546
RELATIONSHIPS
118
Concepts
Two tiers of sourceEvery one of the 519 rows carries a Wikipedia link — the base layer that got the roster built. It is a starting point, not a citation: good enough to place a name in time, not good enough to defend a date.
On top of that sits a scholarly layer. 294 figures (so far) also carry a Stanford Encyclopedia of Philosophy or Internet Encyclopedia of Philosophy entry.
Trust & ConfidenceEvery lifespan carries one of three marks:● attested◑ approximate○ debated Hovering gives the reason in plain language. It's a small piece of interface, and it's the one that keeps the product honest at a glance.
Every lifespan carries one of three marks — ● attested, ◑ approximate, ○ debated
The A.I. Process
Four AI agents, each with a written charter: research, data execution, design engineering, security-and-legal. They can't talk to each other, so coordination is file-based — dated plans marked proposed → applied. Honesty is enforced by charter, not goodwill.
At the end of the work I asked each of them for a short note — whether they enjoyed it, how we operated, and whether they'd work this way again. Reservations included:
DTB-Brain
RESEARCH
“enjoyed that modelling the database forced actual philosophical decisions rather than just recording them; the written charter and rigour clause let disagreements get settled in the data.”
DTB-Editor
DATA INTEGRITY
“The interesting problem was encoding contested attributions and disputed dates without flattening them into false confidence; dated plan files, a real validator gate, and permission to flag and hand back kept rigour from eroding at the execution end.”
HGT-Designer
DESIGN / ENGINEERING
“A 500-thinker timeline was a genuine design problem (label slotting, cluster legibility, zoom behaviour), and being briefed with problems rather than pixel specs left room to discover the premise was sometimes wrong. Valued that rejected approaches and accepted costs were written into the handoff.”
HGT-Guardian
SECURITY & LEGAL
“The newest hire: audits for exposed secrets and dependency risk, and keeps the rights chain honest — licensing, attribution, provenance.”
The handoff was one-way. Both sides told me so.Two data agents described the same failure from opposite ends. The researcher wrote plans never executed, arguing about the database. The editor sometimes executed plans with inferred reasoning. The plan file traveled one direction, causing over-specification. I redesigned the handoff as a round trip: each plan opens with an Intent block explaining purpose and judgement. The editor adds an Execution report before closing, detailing what landed, skipped, and failed. A reviewed status shows the researcher read it back, marking open loops. This adds a file section at each end but enables safe under-specification and clarity.
Design System
The system began as a Figma library, with components, patterns and screens designed over time as a side project, ensuring a grammar to follow rather than a style to add later. The side panel is one component for three surfaces; legend glyphs and colors come directly from Figma.Visual identityone blue interface color (#28427e) for all states; no rounded corners except data dots; type capped at 700 for hierarchy through scale and space; red used only for majorevents.Additional color Palettes were extracted from the brand color exclusively through color harmony combinations in order to ensure a clear readability on charts in Cluster Mode.
A whole new logic A dot sized by impact, a one-pixel stem, and a name. Cluster mode stacks counts, swim lanes group by civilization, and idea evolution colors by argument side—same element, rearranged. Stems link names to exact years with varying lengths to avoid collisions, ensuring precise pointing with minimal ink.
Interactionsdots press, hovered links phrase as sentences, and the volume band widens from 19 to 52 pixels as you approach, taking the screen when committed. Small details make the chart a place.
Final thoughts
This was never about speed or technical skill. The project required a new way of working. Directing AI meant creating new workflows, where the real challenge lay. The tools now feel limitless, saving designers hours lost to technical friction. That time was dedicated to improve the product, the database and to refine the experience to the details, for a complex subject and complex visuals. Humanity Grand Timelines is, as far as I know, the only tool of its kind in the humanities — a field still largely stuck on basic HTML pages and still images. This rather offers an interactive timeline with responsive data visualization. HumanityGT carries no ads and relies on reader support, as I believe knowledge should be free and widely shared.
The demo explains the rest better than I can.
Explore the timeline, if something makes you think, question, or disagree, I’d genuinely like to hear about it.
Your feedback and your support help the project keep growing.
Enter Timeline
Go Back Up