Standardize UI bug reports with a structured screenshot protocol.
npx skills add https://github.com/ChinchillaEnterprises/ChillSkills --skill ui-debugging
Please help me install this Agent Skill. Skill: ui-debugging Source: https://github.com/ChinchillaEnterprises/ChillSkills/tree/main/ui-debugging Command: npx skills add https://github.com/ChinchillaEnterprises/ChillSkills --skill ui-debugging
Describing visual UI/layout bugs in screenshots often leads to ambiguity, requiring multiple rounds of clarification and slowing down the debugging process. This Skill provides a standardized, structured protocol for communicating visual problems, ensuring clarity on the first try and accelerating bug resolution.
Use the ui-debugging skill to describe this screenshot of a broken page layout.
High-intent search queries and answers about installing and using this skill.
Use a standardized screenshot protocol that includes the URL, platform, what you see versus what you expected, the specific problem, layout layers, and viewport information. This structured approach eliminates ambiguity and accelerates bug resolution by providing developers all context on the first report.
Take full-page screenshots to show layout issues across the entire document, and viewport-specific screenshots to capture responsive design problems or localized visual bugs. The ui-debugging protocol guides you on which to use based on whether the issue spans the whole page or appears in a specific viewing context.
Report layout issues by documenting the URL, platform (web or mobile), what you see, what you expected, the specific problem, layout layers involved, and viewport dimensions. A standardized template ensures developers receive complete defect descriptions without follow-up clarification.
Yes, the ui-debugging protocol applies to both web and mobile responsive design problems. It covers full-page and viewport-specific scenarios, helping you document visual bugs consistently whether testing on desktop, tablet, or mobile platforms.
A structured template with fixed sections—URL, platform, visual state, expectations, problem description, and layout context—eliminates back-and-forth questions. Developers receive complete information immediately, allowing them to reproduce and fix the issue faster without requests for clarification.
metabenchLaunch demo servers and verify UI rendering in live browsers.
Happy-Technologies-LLCAggregate ITSM changes into categorized release notes documents.
gsarmaonlineAutomate full-page screenshots across viewports using Puppeteer or Playwright for frontend applications.
samjhechtCompare UI component screenshots against baselines to detect visual regressions.
