skills.rest
unthinkmedia
unthinkmediaCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ux-annotation-generator

Generate structured UI screenshot annotations with location markers and severity levels.

Updated Feb 6, 2026
Search Tags:#ui#usability#ux#screenshot#annotation#design feedback
One-click install
npx skills add https://github.com/unthinkmedia/DesignExploration --skill ux-annotation-generator
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ux-annotation-generator
Source: https://github.com/unthinkmedia/DesignExploration/tree/main/.claude/skills/ux-annotation-generator
Command: npx skills add https://github.com/unthinkmedia/DesignExploration --skill ux-annotation-generator

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines the process of providing detailed, actionable feedback on UI designs by allowing users to annotate screenshots with specific pain points, strengths, and suggestions, complete with precise location markers.

Core Features & Use Cases

  • Detailed Annotations: Generate annotations for issues, strengths, and suggestions with severity levels and categories.
  • Precise Location Referencing: Use grid-based, component-based, or coordinate hints to pinpoint elements.
  • Structured Output: Create single annotations or comprehensive annotation sets for screens or entire user flows.
  • Use Case: A UX designer can upload a mockup, use this Skill to mark up usability issues with clear descriptions and recommendations, and then share these annotated visuals with the development team for efficient implementation.

Quick Start

Use the ux-annotation-generator skill to create a critical issue annotation for the top-right corner of the screenshot, noting that the logout button is missing.

Frequently Asked Questions about ux-annotation-generator

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I annotate UI screenshots to provide usability feedback?▼

Annotate UI screenshots by generating detailed markers for pain points, strengths, and suggestions. The tool categorizes issues by severity and uses grid-based or component-based referencing to pinpoint exact locations on the mockup.

What types of design feedback can I generate for a mockup?▼

You can generate design feedback categories including critical issues, good patterns, quick fixes, and accessibility suggestions. Each annotation includes severity levels and structural recommendations for efficient team implementation.

How do I pinpoint specific elements on a screenshot for design feedback?▼

Pinpoint specific elements using grid-based, component-based, or coordinate-hinting location referencing. This ensures precise location markers are attached to every usability issue and strength identified on the screenshot.

Can I create annotation sets for multi-screen user flows?▼

Yes, you can create structured annotation sets for single screens or entire multi-screen user flows. This allows you to map out comprehensive usability issues and design feedback across a complete user journey.

Does this tool support accessibility suggestions for UI designs?▼

Yes, the tool supports accessibility suggestions as a specific annotation category. It generates actionable feedback alongside visual and structural recommendations to help improve overall UI usability.

What is the best way to mark up usability issues on a UI mockup?▼

The best way to mark up usability issues is by generating structured annotations with severity levels and precise location hints. This produces clear, actionable feedback for development teams to implement.

Related Skills

Explore More Design & Creative Skills→
twiced-technology-gmbhtwiced-technology-gmbh

redline

Annotate UI elements in running web or Tauri applications and fix flagged code issues.

Official
Advanced
NONEitnonameNONEitnoname

pdf-engineering-review

Annotate engineering PDFs at exact coordinates and export JSON review reports.

Community
Advanced
parhummparhumm
25

frontend-component-fix

Diagnose frontend UI bugs and generate patch artifacts for React-like components.

Community
Advanced
slgoodrichslgoodrich
121

usability-frameworks

Plan and evaluate usability testing for user interfaces using Nielsen's heuristics.

Community
Basic