| name | sandian |
|---|---|
| description | Compare a UI design screenshot with an implementation screenshot locally in the Sandian browser app. Use when a designer needs visible-difference review, annotated implementation screenshots, severity-filtered repair checklists, or JSON issue groups. Keep images on the local device; use the tool as visual-review evidence, not as a substitute for DOM or CSS inspection. |
Sandian
Launch the bundled loopback app with an available Python 3 interpreter:
- Windows:
py -3 scripts/launch.py - macOS/Linux:
python3 scripts/launch.py
Read the printed loopback URL instead of assuming a port. Open it in the in-app browser when the user asks to launch, open, demonstrate, or use the tool. Keep the service running while the page is in use.
Review workflow
- Upload a design image and its implementation screenshot. Accept PNG, JPEG, and WebP only.
- Confirm that the pair shows the same page, state, scroll position, and data. Use the overlay mode to check alignment first.
- If content is intentionally dynamic, draw a dynamic region before analysis. Sandian excludes the whole selected region because a screenshot alone cannot reliably separate dynamic copy from its typography.
- Run the inspection only in
精确像素or响应式归一mode. In保守比较mode, use overlay for manual review and supply a better-aligned pair before exporting automated findings. - Treat every result as an observable visual difference. Do not infer font names, CSS declarations, DOM structure, hidden elements, or functional correctness from pixels.
Outputs and limits
- The app groups related findings and exports only
严重and中等groups to PNG, Markdown, and JSON. - Read
references/inspection-protocol.mdbefore a direct audit or interpreting JSON output. - Read
references/comparison-contract.mdbefore changing comparison, grouping, exporting, or confidence behavior. - The app processes image pixels in the local browser and the server listens on loopback only. Do not replace it with a hosted image service or claim cloud analysis.