# Diagram Pixel V2 Review

Task: DIAGRAM-PIXEL-REGEN-V2

## Generated Artifacts

- `output/diagram-experiments/pixel-v2/roadmap/preview-v2.png`
- `output/diagram-experiments/pixel-v2/sfdc-implementation/preview-v2.png`
- `output/diagram-experiments/pixel-v2/swimlane/preview-v2.png`
- `output/diagram-experiments/pixel-v2/timeline/preview-v2.png`

## Evaluation Method

The v2 candidates were rendered from the current SVG sources with Playwright to
create fresh screenshots for visual review. Each render was compared against the
downloaded source reference at the diagram level: page framing, primary
containers, typography scale, element order, connector behavior, spacing, and
semantic completeness.

## Roadmap Findings

Source: `output/diagram-experiments/sources/roadmap-tech-1.png`

- Not pixel-perfect. The current output omits the source page chrome, footer URL,
  and top timestamp line. That is acceptable only if the contract is diagram-only,
  not full-page recreation.
- Title and legend placement are close, but the title text is too large and too
  high compared with the source.
- The source roadmap grid starts lower and uses a taller body; the generated
  grid is compressed vertically.
- Initiative cards do not match the source y positions and several month spans
  are visually shifted.
- The source uses real component icons; the generated output uses text/dot
  abstractions. For pixel recreation this must be declared as a deviation or
  replaced with icon-equivalent symbols.

Prompt corrections needed:

- Declare whether page chrome must be recreated or intentionally cropped out.
- Include exact grid bounds, lane label bounds, and month column width before
  drawing cards.
- Re-evaluate each card against start/end dates using the month grid as a hard
  placement constraint.

## SFDC Implementation Findings

Source: `output/diagram-experiments/sources/sfdc-impl-1.png`

- Not pixel-perfect. The output is a simplified architecture approximation; the
  source has many more internal cards, badges, side rails, external systems, and
  integration bars.
- Layer count and high-level reading direction are correct, but the density and
  semantic completeness are much lower than the source.
- The source has a right-side marketing platform rail in the application layer;
  the output omits that structure.
- Several source connectors run through intermediate bars and external data
  systems; the output collapses them into broad vertical lines.
- The source left rail labels are taller and align exactly with source layer
  bands; the output is visually clean but not faithful.

Prompt corrections needed:

- Split architecture recreation into inventory first, then render. The inventory
  must list every lane, system card, internal subcard, external rail, and
  connector group before drawing.
- Add a density mode: `faithful recreation` keeps small labels and badges;
  `readable abstraction` may simplify them but must not be called pixel-perfect.
- For source matching, connectors must be grouped by source/target layer and
  validated against visible landing points.

## Swimlane Findings

Source: `output/diagram-experiments/sources/swimlane-def-01.png`

- The current output is not recreating the visible source. The source image is a
  website page with an embedded monitor illustration, while the output is an
  independent swimlane process diagram.
- This is acceptable as a source-free diagram experiment, but not as a
  recreation.
- The output itself has readable lane structure and mostly orthogonal routing.
  It still needs a stricter source-free contract for lane count, process steps,
  decision labels, and unused whitespace.

Prompt corrections needed:

- Classify the source as `page screenshot`, `embedded diagram`, or
  `source-free inspiration` before generation.
- If the source contains an embedded diagram inside another illustration, crop or
  isolate the embedded diagram before asking for pixel recreation.
- If source-free, define acceptance criteria for visual quality independent of
  the source.

## Timeline Findings

Source: `output/diagram-experiments/sources/timeline-steps-01.png`

- The current output is a clean source-free timeline, not a recreation. The
  source is a web page screenshot with a small preview image and Vecteezy chrome.
- The timeline pattern is plausible, but it does not match the reference
  preview's tiny scale, web chrome, typography, or content.
- This confirms the rule gap: downloaded marketplace PDFs/pages need source
  region extraction before diagram generation.

Prompt corrections needed:

- Extract or define the diagram region before generation.
- If the source only shows a tiny preview, mark pixel-perfect recreation as
  blocked until a higher-resolution diagram region is available.
- For source-free timelines, validate even milestone spacing, vertical stem
  alignment, text fit, and balanced top/bottom annotation density.

## Overall Result

The v2 renders are useful baseline artifacts, but none should be accepted as
pixel-perfect recreation. The next implementation pass should update the master
diagram prompt/rules to force:

- source classification before rendering;
- element inventory before drawing;
- explicit recreation mode versus source-free mode;
- post-render screenshot review before delivery;
- connector landing-point validation;
- text fit and container bounds validation;
- page-crop or diagram-region extraction for downloaded web/PDF sources.