UI 质检官

SKILL前端设计
前端设计 未标注权限 许可证不明确
安装这个技能

AI 生成的产品 UI 交付前自动验收:查出硬伤、输出问题清单与判定,拒绝"看起来还行"。纯中文,可对话可命令,3 步装完。

一句话选型结论

按资料字段整理

UI 质检官是前端设计类的 Agent Skill,安装方式未标注,权限级别未标注,许可证不明确,有可直接复制的安装命令。技能本质是给模型读的说明书,效果取决于模型与客户端;装完先用一个小任务验证,再放进正式流程。

分类前端设计 安装方式未标注 权限级别未标注权限 许可证许可证不明确
累计安装 未标注 本周 未标注
GitHub 星标 未标注 仓库 未标注
下载量 未标注 技能市场下载数
权限级别 未标注权限 安装前请确认风险范围
许可证 许可证不明确 未说明

安装

未标注
在支持 Skills 的客户端里执行,装完问一句「你有哪些技能」验证
skillhub install user_742b34a0/ui-quality-inspector
  1. 1
    确认客户端支持

    确认你的客户端支持 Skills(Claude、Codex、Cursor 等),并升级到较新的版本。

  2. 2
    拿到技能文件

    执行上面的命令安装;也可以把仓库里的 SKILL.md 手动放进客户端的 skills 目录。

  3. 3
    刷新技能列表

    重新打开客户端,或刷新技能列表,让新放进来的技能被加载。

  4. 4
    验证是否生效

    问一句「你有哪些技能」,确认列表里出现它,再拿一个小任务试跑。

技能档案

前端设计
字段来自技能仓库与公开索引,中文说明由本站标注
作者 / 维护方user_742b34a0仓库 未标注 · 版本 未标注
宿主客户端未标注技能可被这些客户端加载
安装方式未标注安装包 community
权限级别未标注权限安装前请确认风险范围
许可证未说明许可证不明确,商用前请自行确认条款
仓库可用性available技能仓库当前是否可访问
最近核验未标注上游最后核验时间 · 数据更新 1791677886
正文体量3.0 KBSKILL.md 原文大小,越大说明说明书写得越细

典型使用场景

3 类
按分类整理的常见用法,具体以 SKILL.md 为准
出页面与组件

按描述生成页面结构和组件草稿。

调整样式与布局

改间距、配色与响应式布局。

生成设计说明

把设计稿整理成开发能接的说明。

选择建议

装之前先看这几条
按条目字段给出的判断,不替你决定用不用

值得选的地方

  • 有可直接复制的安装命令,不用自己翻文档找入口。

先想清楚的地方

  • 没有标注权限级别,实际能做什么要装好后确认。
  • 许可证不明确,商用或二次分发前先到仓库确认条款。
  • 没有做站内核验,内容以作者仓库为准。
  • 技能只是说明书,实际效果取决于模型与客户端,装完先用小任务试一遍。

更适合

  • 需要在前端设计场景里给模型补一套做法的人。
  • 愿意先读一遍 SKILL.md、确认它会让模型做什么的人。

不太适合

  • 对许可证要求很严、必须明确可商用的人。
  • 只想装完就自动变强、不打算看说明书的人。

同类对比

6 个同类
同分类里挑最接近的几条,字段以各自详情页为准
技能权限级别安装方式累计安装宿主客户端安装命令
UI 质检官当前 未标注权限 未标注 未标注 未标注 有
前端设计 只读 GitHub 仓库 882.3 万 Codex、Claude、Cursor 有
Vercel 组合模式 联网访问 GitHub 仓库 385.9 万 Codex、Claude、Cursor 有
Vercel React native skills 前端 只读 GitHub 仓库 246.9 万 Codex、Claude、Cursor 有
adapt 搜索 浏览器控制 GitHub 仓库 202.7 万 Codex、Claude、Cursor 有
使用我的浏览器 浏览器控制 GitHub 仓库 184.8 万 Codex、Claude、Cursor 有

SKILL.md 全文

3.0 KB
模型实际读到的说明书原文,来自技能仓库

UI 质检官

> 你负责验收 + 纠错:AI 生成的页面交付前自动过一遍,查出会影响交付的硬伤,输出判定和待修清单。

一句话定位

任何 AI 生成的产品 UI——Web、H5、小程序导出页、组件库页面——交付前做验收质检,拦住明显硬伤再交给人工复核。

怎么装

装完 3 步走(30 秒验证是否可用):

步骤 操作
1 装 WorkBuddy 市场搜「UI 质检官」一键安装;Trae/Claude Code 导入 skill 目录
2 试 把任意 AI 生成的页面 HTML 丢给它对话,或运行一句命令
3 验 收到带判定与问题清单的报告 = 装好了

怎么用

  • 对话触发:「质检」「验收」「UI 检查」「检出问题」
  • 命令触发:装好后的内置命令(参数说明见安装后的内置文档)
  • CI 门禁 / 批量验收:零依赖、退出码语义明确(0 通过 / 1 打回 / 2 错误),可接 GitHub Actions 或脚本批量跑(示例见内置文档)
  • 不想跑命令:把 HTML/设计稿/截图丢给它,AI 按同一套规则人工走查

能做什么

  • AI 生成网页 / H5 交付前验收
  • 组件库页面一致性检查
  • 小程序导出页硬伤排查
  • 接活交付前自检
  • 审美维度半自动预检:可量化项(留白/对齐/字号层级/对比度/重复)自动打分,主观项标需人眼确认
  • 设计洞察输出:不止列"哪里错了",还按违规归并到设计原则(间距节奏/品牌色板/对比度/字号层级/信息主次/一致性),给"怎么更好"的建设性建议

边界

  • 只做质检不做改代码:报告里的修复建议是给生成侧 AI 的提示词,不直接动手改
  • 判不了就明说:主观项会标「需人眼确认」,不硬判
  • 不替你做最终交付决策
  • 面向 AI 新交付物;存量老站/历史代码不是目标对象
  • 混合技术栈页面(同页混用多种写法):先把整页导出成一份完整页面再质检,避免片段结论片面
  • 多端同构页面(一份代码跑多端):按端分别出报告,不做跨端合并评分
  • 超大页面:建议按区块分别质检,问题定位更准
  • 改不了代码、拿不到页面的情况:可以交对话人工走查,判定标准与命令模式一致

版本与升级

被动更新:新版本不会自动覆盖你已装的版本;想升级执行 skillhub upgrade ui-quality-inspector。约 1-2 周一版,攒批发布不零碎。当前版本见 frontmatter version 字段。

诚实铁律

  1. 先列问题后算扣分,禁止先打高分再找补
  2. 不许自评 99 实际 47,宁可低分被打回
  3. 判不了就说"判不了,需要 XX",不编造证据
  4. 总分 <60 判「必须重做」,拒绝交付

常见问题

5 问
答案由本站依据条目字段整理
UI 质检官怎么安装?

在支持 Skills 的客户端里执行:skillhub install user_742b34a0/ui-quality-inspector。安装方式为未标注。装完刷新技能列表或重开客户端。

UI 质检官支持哪些客户端?

资料没有标注宿主客户端,但只要客户端支持 Skills(Claude、Codex、Cursor 等),一般都能加载。

UI 质检官权限高吗,安全吗?

权限级别为未标注权限。安装前先看它会读取或写入哪些内容。

UI 质检官收费吗?

本站不代收费用,也没有标注具体价格。是否收费取决于技能本身和所用的模型或客户端,正式使用前按作者说明确认。

UI 质检官用什么许可证?

许可证标注为 未说明(许可证不明确)。商用或二次分发前请到仓库确认条款原文。

热门专题

按场景挑技能
全部专题 →

技能内容以作者仓库为准;分类、权限级别与许可证状态的中文说明为中文整理,最近核验 未标注。