From team-skills-platform
提供公司级前端 UI/UX 设计知识库,覆盖产品类型、视觉方向、设计 token、布局、 交互、可访问性、动效与交付检查。当前端任务需要统一设计语言或体验门禁时使用。
npx claudepluginhub colin4k1024/tspThis skill uses the workspace's default tool permissions.
- 把 UI/UX 决策前置到计划和方案阶段,不把视觉和体验变成实现末端的补丁。
Generates design tokens/docs from CSS/Tailwind/styled-components codebases, audits visual consistency across 10 dimensions, detects AI slop in UI.
Records polished WebM UI demo videos of web apps using Playwright with cursor overlay, natural pacing, and three-phase scripting. Activates for demo, walkthrough, screen recording, or tutorial requests.
Delivers idiomatic Kotlin patterns for null safety, immutability, sealed classes, coroutines, Flows, extensions, DSL builders, and Gradle DSL. Use when writing, reviewing, refactoring, or designing Kotlin code.
tech-lead、frontend-engineer、qa-engineer 在同一套设计语言下协作。检查项目根目录是否存在 DESIGN.md:
npx getdesign@latest add <brand> 或直接填写 DESIGN.md 模板 生成,放置于项目根目录。先阅读 frontend-ui-ux-standards.md 和 frontend-quality-gates.md 明确硬性门禁。
用 product-style-map.md 与 design-tokens.md 锁定产品类型、视觉方向和 token 策略。
对新界面或大改版先补齐 design-system-brief.md,对进入实现的任务补齐 ui-implementation-plan.md。
在交付评审前使用 interaction-accessibility.md、delivery-checklist.md 与 ui-review-checklist.md 做闭环检查。
tech-lead 需要判断某个需求的 UI 范围、设计约束和体验门禁是否已经足够明确。frontend-engineer 需要在多种视觉方向和交互模式中选定统一方案。qa-engineer 需要把视觉、交互、无障碍和性能检查标准从“主观观感”变成一致规则。