← ClaudeAtlas

ui-screenshotslisted

Capture screenshots and short clips of any web application's UI for visual review, documentation, or pull requests. Use for screenshot requests, before/after comparisons, recording UI interactions, and preparing or attaching visual evidence of a UI change. Adapt to the application's framework, authentication, tooling, and delivery destination.
itsjavi/skills · ★ 1 · Web & Frontend · score 77
Install: claude install-skill itsjavi/skills
# UI screenshots and clips Capture the actual running web UI with enough context to assess the requested surface or behaviour. Support standalone screenshots, before/after comparisons, and motion clips. A reachable application and a browser capture tool are sufficient; a repository, test runner, account, or hosting service is needed only when the task requires one. ## Establish the capture scope - Identify the application URL, relevant pages, and interaction states from the request. For a code change, inspect the diff or implementation plan to find affected surfaces without assuming particular directories, file extensions, or component libraries. - Determine whether the user wants a current-state capture, a comparison, or a clip. For comparisons, capture the baseline before editing when possible. For UI-change PRs, prefer before/after pairs for the affected surfaces. A standalone screenshot needs no baseline. - Use the requested viewport, device, theme, and locale, or the project's established capture settings. Otherwise use the desktop defaults below. Record the settings and include relevant mobile breakpoints or alternate themes when the change affects them. - Determine the delivery destination from the request and project conventions. Local files are a valid deliverable. Capturing screenshots does not itself require a ticket, PR, asset branch, or upload. If assessing a change, decide whether it affects visible content or interaction. Backend changes can a