Skip to main content
Text & code prompt
ChatGPT
Claude
Gemini
Gemini 4 Argon

Compare Two UI Screenshots Against an Allowed Change

Review a before-and-after interface change without inventing runtime behavior. List intended visual differences, unexpected regressions and the smallest follow-up checks.

By Genius Forges EditorialUpdated Oct 27, 2026

Make it yours

Fill in the inputs. Your prompt updates as you type.

Before you paste

Attach two permitted screenshots clearly labeled BEFORE and AFTER, ideally from the same viewport and state. Remove private information.

Your prompt

Compare the attached BEFORE and AFTER screenshots at the supplied viewport. The only intended change is {{allowed_change}}. First identify whether scale, crop or viewport differences make comparison unreliable. Return a table: region | visible difference | intended or unexpected | evidence | follow-up check. Inspect spacing, clipping, alignment, text wrapping and image framing. Do not infer click behavior, accessibility compliance or network results from static pictures. Separate observations from hypotheses. End with the three highest-value manual or browser checks. Do not rewrite unrelated parts of the interface.

1 input still blank. Empty inputs stay as placeholders when copied.

Get one tested prompt a week

One workflow, one prompt, one tool and one quality check by email. No spam, unsubscribe any time.

Example result

Illustrative example; not tested on the listed platform. Synthetic screenshot description used for this illustrative preview: BEFORE: violet button, title on one line, 24px gap below title. AFTER: cobalt button, title on two lines, smaller gap. Result: button color INTENDED; wrapping UNEXPECTED unless viewport changed; gap difference requires a same-viewport measurement. Follow-up: reproduce viewport, inspect computed spacing, test keyboard focus separately.

Illustrative example; not tested on the listed platform. Fictional or synthetic inputs are identified in the example.

How to use this prompt

  1. 1Attach labeled screenshots in the selected AI platform.
  2. 2State exactly one allowed change.
  3. 3Confirm viewport comparability before using the table as a regression report.

Tips & limitations

Check the result: 1. Differences cite visible regions. 2. Viewport mismatch remains a possible cause. 3. Static images are not presented as proof of interactive behavior. Compatibility is for image analysis; tools are needed for runtime checks.

Did this help you complete your task?

Tell us what needs improving. No account or private output required.

Was this useful?
Report incorrect information or a broken link

Review evidence

Documentation-based review · 2026-10-27

Primary documentation and demo source reviewed on 27 October 2026. Exercises and expected results are illustrative unless an actual test is explicitly recorded. Local editorial review only; no provider-performance or audience outcome is claimed.

Keep creating

Explore the library
ChatGPT

Turn this idea into a daily skill

Practice with a small input and check the result before sharing.

We use optional cookies for analytics and referral tracking. Learn more about our privacy policy