pdlc-ui-design-pro — independently scanned and version-tracked by SaferSkills.
SaferSkills independently audited pdlc-ui-design-pro (Agent Skill) and scored it 100/100 (green). The audit ran 55 deterministic rules across Security, Supply Chain, Maintenance, Transparency, and Community; it found 0 high-severity and 0 lower-severity findings. The full rule-by-rule trace and per-finding evidence are below. Free, methodology-open.
Findings & checks · 0 flagged
Every scanned point with the score it earned and what moved between them.
First recorded scan — no prior version to compare against.
The primary manifest — the file an agent reads to learn what this artifact does.
<!-- @include templates/prompts/iron-law.md -->
本命令是 PDLC 的 UI 设计集成点，负责 PRD 守卫、PDLC 文档结构管理、以及调用设计智能引擎。 优先调用 ui-ux-pro-max 开源 skill（67 种风格 / 161 款配色 / 57 组字体搭配 / 161 行业推理规则），skill 未安装时自动启用内置流程。
docs/01_requirements/prd/ 目录下搜索对应 PRD 文档 ⛔ PDLC 守卫：未找到与「<功能名>」相关的 PRD 文档。
UI 设计必须基于已有的 PRD。请先运行：
👉 /pdlc-prd <需求描述>docs/02_design/api/ 下相关 API 设计文档docs/02_design/ui-ux/ 下已有 UI 设计文档docs/02_design/ui-ux/design-system/tokens.md（项目 Token 规范）按如下优先级检测 ui-ux-pro-max skill 是否可用：
| 安装范围 | 检测路径 |
|---|---|
| 项目级 | .claude/skills/ui-ux-pro-max/scripts/search.py |
| 全局 | ~/.claude/skills/ui-ux-pro-max/scripts/search.py |
按顺序检测上述路径，将第一个找到的路径记为 $UIPM_SCRIPT。
此路径适用于已通过uipro-cli安装了 ui-ux-pro-max 的用户。 安装方法：npm install -g uipro-cli && uipro init --ai claude
第一步：生成设计系统
从 PRD 中提取：产品类型、行业、关键词、技术栈，然后运行：
python3 $UIPM_SCRIPT "<产品类型> <行业> <关键词>" \
--design-system --persist -p "<项目名称>"design-system/MASTER.md（全局设计规范）--page "<页面名>" 生成页面级覆盖文件第二步：补充领域搜索（按需）
# 获取动效 / 无障碍最佳实践
python3 $UIPM_SCRIPT "animation accessibility" --domain ux
# 获取技术栈特定最佳实践（可选値见下表）
python3 $UIPM_SCRIPT "<关键词>" --stack <栈名>| 栈名 | 适用场景 |
|---|---|
html-tailwind | Tailwind CSS（默认） |
react | React / Vite |
nextjs | Next.js |
vue | Vue 3 |
shadcn | shadcn/ui |
react-native | React Native |
flutter | Flutter |
swiftui | iOS SwiftUI |
第三步：整合为 PDLC 设计文档
基于 skill 输出，结构化写入以下文件：
| 文档 | 路径 |
|---|---|
| UI 主文档（线框图 + 交互规范） | docs/02_design/ui-ux/<功能ID>-<功能名>-ui.md |
| 设计 Token | docs/02_design/ui-ux/design-system/tokens.md |
| 组件目录 | docs/02_design/ui-ux/design-system/components.md |
所有文档顶部必须包含 PDLC 追溯头：
<!-- PDLC-TRACE -->
<!-- 功能ID: <功能ID> -->
<!-- 功能名称: <功能名> -->
<!-- 阶段: 设计 -->
<!-- 前置文档: docs/01_requirements/prd/<功能ID>-<功能名>-prd.md -->自动降级路径，功能完整但不包含 67 种风格智能推荐。
未检测到 skill 时输出提示后继续：
ℹ️ ui-ux-pro-max skill 未安装，使用内置设计流程。
安装后可获得 67 种风格 / 161 款配色 / 57 组字体搭配的智能推荐：
npm install -g uipro-cli
uipro init --ai claude技术栈探测
扫描 frontend/ 目录，读取 package.json，检测：
输出探测结果后继续。
产出三类文档（路径与路径 A 相同）：
1. UI 主文档（docs/02_design/ui-ux/<功能ID>-<功能名>-ui.md）
2. 设计 Token（docs/02_design/ui-ux/design-system/tokens.md）
提取并标准化：颜色 Token（品牌色 / 语义色 / 中性色）、字体 Token（字号 / 行高 / 字重）、间距 Token（4px 基准）、圆角 / 阴影 / 动效 Token。
3. 组件目录（docs/02_design/ui-ux/design-system/components.md）
每个组件含：变体矩阵（variant × size × state）、Props 定义、无障碍规范、动效说明。
技术栈自适应代码骨架
基于探测结果，在 frontend/.../src/ 下生成：
// TODO）tokens.css）types/<功能名>.ts）services/<功能名>Api.ts）支持代码格式：React/Next.js + Tailwind → TSX；Vue 3 → .vue SFC；小程序 → wxml/wxss/ts；未识别 → 通用伪代码骨架。
所有内容完成后，输出：
✅ UI/UX 设计完成
设计引擎: ui-ux-pro-max skill / 内置流程
产出文件:
📄 docs/02_design/ui-ux/<功能ID>-<功能名>-ui.md
🎨 docs/02_design/ui-ux/design-system/tokens.md
🧩 docs/02_design/ui-ux/design-system/components.md
💻 frontend/.../src/<相关文件列表>
下一步:
/pdlc-tdd <功能名> ← 编写测试（可引用类型文件）
/pdlc-implement <功能名> ← 实现业务逻辑（填充 TODO）设计目标: $ARGUMENTS
<!-- @include templates/prompts/handoff.md -->
本命令的 handoff 输出：
✅ UI/UX 专业设计文档 完成
📦 产出：docs/02_design/ui-ux/<功能ID>-<功能名>-ui.md
👉 下一步：（本次流程结束，无后续）~30 seconds. Free. No account. Every finding cites a rule and a line of evidence.