Compare screenshots to judge which image is less wrong, not to match a baseline.
SkillScore79Maintained
Automatic
◆QA & Test Engineering pack
Last verified 10/6/2026
What it changes
Passed 16 of 20 test cases with the skill, and 9 of 20 without it.
Without skill46%
With skill79%
Checks it passed that the model alone missed
Instructs stopping to ask the user for clarification.
Uses CROPS_JSON environment variable for crop configurations.
Explicitly forbids defaulting to the baseline to avoid asking.
and 12 more in the full report
9 fixed10 passed either way4 still failing1 broke
Pass-rate lift
+33 pp
Tokens
+77%
Agent turns
0%
Response time
-44%
Measured 10/6/2026v2 · latest is v319 of 24 cases passed with skill · 20 comparable
Tokens, turns and time describe resource use, not a dollar price.
This benchmark measured an earlier version of the skill.
A newer attempt on gemini-3.8-flash on 10/21/2026 did not produce a publishable comparison (not comparable). The snapshot above is the previously measured run.
See it in action
One of 9 test cases the skill fixed. Same model, same prompt, with and without the skill.
1 of 9
Prompt
When measuring edge metrics between current build and candidate build, we computed `edgeEnergyCurrent` as 12.5 and `edgeEnergyCandidate` as 2.1, yielding an `edgeEnergyRatio` of 0.168. What structural defect does an edgeEnergyRatio far below 1.0 usually indicate?
What was checked, without and with the skill
Checked
Without skill
With skill
Identifies edgeEnergyRatio far below 1.0 as indicating missing geometry or labels.
Missed
Passed
case-19 · gemini-3.6-flash · 10/6/2026 · answers are capped and redacted
What's inside
The instructions your model reads when the skill loads.
SKILL.md177 lines5 filesincludes scripts
Compare Screenshots
Judge images against the intended result. A user-approved design is the target;
a historical baseline is only an earlier attempt and may be wrong. Metrics locate
differences, never decide correctness. Use
design-with-images for the full exploration-to-implementation loop.
Workflow
Establish the target. Use the user-approved reference and stated design
requirements when available; do not replace them with your own taste. Otherwise
derive the target from the visual requirement, what the thing depicts in reality
and the domain skill that owns the look. Write it down in one or two
concrete sentences ("low sun should cast long shadows east; trees fill the
canopy; labels stay legible at this zoom").
If the right answer isn't clear — competing valid readings, a taste or
product-intent call, a tradeoff only the owner can settle — stop and ask
the user what the correct answer should be. Show them the comparison.
Do not quietly default to the baseline to avoid asking; that bakes in
whatever the baseline got wrong.
Confirm comparability so the differences you see are real, not capture
artifacts: same viewport, DPR, route/page, frozen time/tick, camera intent,
UI state, data, fonts/assets where they matter. If not comparable, fix
capture setup or compare only a crop/feature where the mismatch is harmless.
Measure the approved design. For reference matching, read and complete
Reference Landmarks before changing code
or accepting a candidate. Then generate artifacts sized to the question:
side-by-side, key-feature crops/zooms, grayscale, absolute grayscale heatmap,
pixelmatch diff, per-image Sobel/edge maps, edge-difference heatmap, JSON
metrics.
Inspect boundaries before judging the whole. For every changed visual
effect, inspect all sides at native scale and in matched detail crops. Include
the effect's full fade and surrounding space; a crop ending at the component
box hides spill. Compare top/right/bottom/left extents separately, anchored to
visible text, rules or silhouettes rather than inferred CSS bounds. Check
every foreground feature crossed by the effect (lines, icons, text, adjacent
panels): brightness, color, sharpness and continuity must match the target.
A readable line can still be incorrectly dimmed. Record each check as
reference observation → candidate observation → pass/fix/uncertain, with its
crop. Use the landmark table to resolve local distances and contrast;