# Rebuilding a textbook page in InDesign — an AI automation journey

A self-contained data story (in the spirit of the Blender design journey) documenting
how an AI agent reproduced 5 pages of an OpenStax chapter in **Adobe InDesign 2026**
five different ways — recorded **live on the real InDesign canvas**, with every failure
and fix.

## View it
Open **`index.html`** in any modern browser (Chrome/Edge recommended for the embedded
PDF). It's a single **self-contained HTML file** (all CSS + JS inline) plus an `assets/`
folder — no build step, no server.

### What's interactive
- **Stage timeline** (top): tracks where you are as you scroll; click a stage to jump.
- **Full-viewport sections** with explanation on one side and the live video / comparison
  on the other; tall pages are fit to the viewport.
- **Click-to-zoom**: click any clip to play it large with sound; click a page filmstrip
  thumbnail to see **source vs rebuilt** side-by-side. (Esc or click to close.)
- **Embedded PDF viewer** ("Output" section): scroll/zoom the actual rebuilt PDF, with a
  toggle to compare against the source.
- Per-track live clips autoplay muted; every one also exists as a GIF in `assets/`.

## What you're looking at
The clips are **genuine screenshots of the live Adobe InDesign 2026 document**, captured
frame-by-frame as each element is placed. Nothing is mocked up. Capture method: attach to
a visible InDesign instance over COM, build element-by-element with redraw enabled, and
screenshot the layout window after every placement.

## Folder structure
```
indesign-journey/
├── index.html          the data story (hand-authored, light editorial design)
├── README.md           this file
├── PROCESS.md          the exact steps we followed, with the real failures
└── assets/             all media used by the page (7.7 MB)
    ├── b1_pywin32_live.mp4 / .gif      Track B1 live build (COM)
    ├── b2_extendscript_live.mp4 / .gif Track B2 live build (ExtendScript)
    ├── b3_uxp_live.mp4 / .gif          Track B3 live build (UXP)
    ├── b5_simpleidml_live.mp4 / .gif   Track B5 template → filled
    ├── b4_mcp_live.mp4 / .gif          Track B4 loop rounds 0→1→2
    ├── poster_b*.png                   video poster frames
    ├── reproduction.pdf                the actual InDesign export (embedded viewer)
    ├── source.pdf                      the original 5 source pages (for comparison)
    ├── source_p1..5.png / repro_p1..5.png   source vs reproduction, all 5 pages
    ├── overlay_p1.png                  extraction overlay
    ├── heat_p1.png                     diff heatmap
    ├── indesign_live.png               the real InDesign app, document open
    ├── fail_units.png / fail_noimages.png   reproduced failure states
    └── b1_units / b1_images / b2_baseline / b4_loop / b5_fill .gif  fail→fix toggles
```

## The numbers (all measured, not estimated)
| Track | Engine | Composite | Pages | Note |
|---|---|---|---|---|
| **B7** | **Precision pass (vectors fixed)** | **93.3** | 5/5 | best — the one fix that broke the ceiling |
| B1 | PyWin32 COM | 90.9 | 5/5 | reference build |
| B2 | ExtendScript | 90.9 | 5/5 | identical DOM, easiest setup |
| B3 | UXP | 90.9 | 5/5 | identical DOM, modern runtime |
| B6 | Block reflow | 80.7 | 5/5 | experiment — regressed (kept for honesty) |
| B5 | simpleidml | 59.6 | 1/5 | template-fill, not a layout engine |
| B4 | MCP visual loop | 43.5 | 1/5 | agentic loop — QA, not generation |

Two experiments past the scripted baseline: **B6** (threaded-story reflow) regressed
91→81; **B7** (re-classify vector graphics — borders as strokes, not solid blocks)
broke through 90.9→93.3, peak SSIM 0.994. A third, **B8** (fit-to-width via horizontal
scale), also regressed (distorted glyphs, wrapped headings) and was kept internal — both
negatives confirm the ~93% ceiling holds with these tools.

Composite weighting: 0.30·SSIM + 0.25·text-IoU + 0.15·colour ΔE2000 + 0.15·image-IoU +
0.15·AI-judge.

## Credits & licence
- Source: OpenStax *Concepts of Biology*, **CC BY 4.0** — reproductions are shareable.
- Fonts: IBM Plex Sans & Mulish (SIL OFL), installed to resolve the substitution issue.
- Visual judge: Google Gemini 2.5 Flash.
- Built by an AI agent (Claude) on Windows 11.