Agent Skills › raphaelmansuy/edgequake › ux-ui-analyze-single-page

ux-ui-analyze-single-page

GitHub

分析单个UI页面截图并生成描述性文档。用于在捕获截图后立即撰写或更新页面分析，避免上下文过载，专注于结构层级且不做主观评判。

.github/skills/ux-ui-analyze-single-page/SKILL.md raphaelmansuy/edgequake

Trigger Scenarios

需要描述已存在的截图用户要求立即输出页面分析结果

Install

npx skills add raphaelmansuy/edgequake --skill ux-ui-analyze-single-page -g -y

More Options

Non-standard path

npx skills add https://github.com/raphaelmansuy/edgequake/tree/edgequake-main/.github/skills/ux-ui-analyze-single-page -g -y

Use without installing

npx skills use raphaelmansuy/edgequake@ux-ui-analyze-single-page

指定 Agent (Claude Code)

npx skills add raphaelmansuy/edgequake --skill ux-ui-analyze-single-page -a claude-code -g -y

安装 repo 全部 skill

npx skills add raphaelmansuy/edgequake --all -g -y

预览 repo 内 skill

npx skills add raphaelmansuy/edgequake --list

SKILL.md

Frontmatter

{
    "name": "ux-ui-analyze-single-page",
    "license": "Proprietary (repository internal)",
    "metadata": {
        "area": "ux-ui-mapping",
        "repo": "raphaelmansuy\/edgequake"
    },
    "description": "Analyze exactly one captured UI page (from ux_ui_map screenshots + request JSON) and immediately write\/update ux_ui_map\/pages\/{page}.md in neutral descriptive language. Use when asked to analyze screenshots, rewrite corresponding analysis immediately, or avoid memory\/context saturation.",
    "compatibility": "Designed for Copilot agent mode; can be used without running the app if screenshots already exist."
}

Single-Page UI Analysis (Write Immediately)

When to use

Use this skill when:

screenshots already exist and need describing
the user wants analysis written out immediately after each page capture
you must avoid carrying multi-page context

Inputs

ux_ui_map/requests/{page}.json
ux_ui_map/screenshots/{page}/desktop.png
ux_ui_map/screenshots/{page}/tablet.png
ux_ui_map/screenshots/{page}/mobile.png

Output

ux_ui_map/pages/{page}.md (created/updated immediately)

Rules

Descriptive only: do not judge, do not recommend, do not assign severity.
Focus on the hierarchy: page → regions → containers → components → elements.
If information is uncertain from the screenshot, say so plainly (e.g., “Text is not legible at this resolution”).
Do not reference previous pages unless explicitly asked.

Procedure

Load the request JSON to confirm route and expected screenshot paths.
Inspect desktop screenshot first (structure), then tablet/mobile (responsive changes).
Write/update the page doc using the template at ux_ui_map/pages/{page}.md:
- Overview (route/title)
- ASCII layout diagram (approximate)
- Screenshot table
- Regions/containers/components
Stop after writing this one page.