Skill UI

A powerful Python skill for adding professional callouts, arrows, and labels to various images, including screenshots, diagrams, and architecture documents. It allows users to visually highlight specific areas or changes. The advanced `annotate.py` module provides algorithmic label placement, optimizing for readability and preventing overlaps. Ideal for creating clear PR descriptions, documenting changes, or building annotated demo assets.

A comprehensive guide on embedding before-and-after screenshots directly into pull request descriptions. This skill helps reviewers visualize UI changes, layout adjustments, and data visualizations instantly, without needing to check out the branch. Includes best practices for image sizing, structured Markdown patterns, and specific API/upload guidance for Azure DevOps and GitHub.

A comprehensive skill for capturing and documenting web application and graphical UI states during the development cycle. It supports full-page captures using Playwright, reliable post-processing cropping with PIL, capturing interactive states (hovers, selections), and even handles non-web desktop applications using mss/ctypes.