Screenshot Visual Check
By Kenji · Published · Updated
Compares before and after screenshots of a UI change and lists what moved, what changed and what broke, region by region.
Prompt template
## Screenshot Visual Check Compare the screenshots of a user interface change. - Before screenshot: [text: File path or link to the earlier capture] - After screenshot: [text: File path or link to the later capture] - Page or screen: [text: Name of the view being compared] - Intended change: [textarea: What was supposed to differ] - Viewport: [dropdown: Mobile 390 wide, Tablet 768 wide, Laptop 1280 wide, Wide 1920] - Strictness: [dropdown: Pixel level, Layout level, Content level] Look at both images before writing anything. Divide the screen into regions such as header, navigation, main content, forms and footer, and compare each region in the same order. For every difference, record the region, what it was, what it is now, and whether it matches the intended change. Sort findings into Intended, Unintended and Uncertain. Unintended means an overlap, clipped text, shifted alignment, changed colour or spacing, or a missing element. Judge only what is visible, and say so when text is too small to read. Match the strictness: Pixel level reports spacing drift of a few pixels, Content level ignores it. Finish with a verdict of Ship, Fix first or Needs a closer look, and name the single most important finding.