frontend-design-review
在 PR 和设计评审中快速给出可执行的改进建议与标准对照。
评估或生成高质量前端界面,覆盖设计系统与可访问性规范。
用于评估或产出高质量前端界面,既能做设计审查也能从零创建设计系统合规、可访问的 UI。适合做 PR 评审、可访问性审计、组件/响应式测试或想把界面做得更有品质和一致性时使用,不适合后台或数据库逻辑审查。核心看三个方面:从洞察到行动的流畅性、工艺质量和可信赖性,既给问题诊断也给改进建议。
▸ 展开 SKILL.md 英文原文
Review and create distinctive, production-grade frontend interfaces with high design quality and design system compliance. Evaluates using three pillars: frictionless insight-to-action, quality craft, and trustworthy building. USE FOR: PR reviews, design reviews, accessibility audits, design system compliance checks, creative frontend design, UI code review, component reviews, responsive design checks, theme testing, and creating memorable UI. DO NOT USE FOR: Backend API reviews, database schema reviews, infrastructure or DevOps work, pure business logic without UI, or non-frontend code.
帮我安装这个 skill:https://raw.githubusercontent.com/microsoft/skills/main/.github/skills/frontend-design-review/SKILL.mdcurl -fsSL "https://raw.githubusercontent.com/microsoft/skills/main/.github/skills/frontend-design-review/SKILL.md"# Frontend Design Review Review UI implementations against design quality standards and your design system **OR** create distinctive, production-grade frontend interfaces from scratch. ## Two Modes ### Mode 1: Design Review Evaluate existing UI for design system compliance, three quality pillars (Frictionless, Quality Craft, Trustworthy), accessibility, and code quality. ### Mode 2: Creative Frontend Design Create distinctive interfaces that avoid generic "AI slop" aesthetics, have clear conceptual direction, and execute with precision. --- ## Creative Frontend Design Before coding, commit to an aesthetic direction: - **Purpose**: What problem does this solve? Who uses it? - **Tone**: