SuperAPI AI 工具集

ui-ux-pro-max

设计与创作

查看项目

更新于 10-16 01:38

技能介绍

用途:在涉及界面结构、视觉设计决策、交互模式或用户体验质量把控的任务中提供基于优先级的推荐,如新页面设计、组件创建与重构、配色/排版/间距/布局体系选择、UX 与无障碍与一致性审查、导航/动画/响应式实现等。纯后端逻辑、API 或数据库设计、非视觉性能工作、基础设施与运维、非视觉脚本不适用,除非任务改变外观、感受、动效或交互方式。

主要能力:按 1 至 10 的优先级组织规则类别——无障碍(对比度 4.5:1、替代文本、键盘导航、aria 标签)、触摸与交互(最小 44×44px、8px 以上间距、加载反馈)、性能(WebP/AVIF、懒加载、预留空间 CLS<0.1)、风格选择、布局与响应式、排版与颜色、动画、表单与反馈、导航模式、图表与数据。完整规则文本位于 references/quick-reference.md,按需阅读;应用特有的打磨规则与交付前检查清单见 references/pro-rules.md。

使用方式:搜索脚本位于技能自身目录,需用完整路径调用:python "${CLAUDE_PLUGIN_ROOT}/.claude/skills/ui-ux-pro-max/scripts/search.py" "<query>" --domain <domain>。若无 python 可尝试 python3、py -3,需要 Python 3.x,无外部依赖。流程为:先分析需求(产品类型、受众与场景、风格关键词、技术栈,栈无法检测时应询问用户或默认 html-tailwind,不可硬编码假设);新页面或新项目先用 --design-system 生成设计系统,例如 python "${CLAUDE_PLUGIN_ROOT}/.claude/skills/ui-ux-pro-max/scripts/search.py" "beauty spa wellness service" --design-system -p "Serenity Spa";可用 --persist 并配合 --output-dir 指向项目根目录持久化,生成 design-system/<project-slug>/MASTER.md 与 pages/ 覆盖文件,也可加 --page "dashboard" 生成页面级覆盖;MASTER.md 已存在时 --persist 会跳过写入,除非加 --force。可选设计旋钮 --variance、--motion、--density 取值 1 至 10,分别调整风格偏移、动效复杂度与间距密度。随后可按 --domain 补充查询 product、style、color、typography、google-fonts、chart、ux、landing、icons、gsap、react、web 等,按 --stack 查询特定技术栈指南,支持 react、nextjs、vue、svelte、astro、nuxtjs、nuxt-ui、angular、laravel、swiftui、react-native、flutter、jetpack-compose、html-tailwind、shadcn、threejs、javafx、wpf、winui、avalonia、uno、uwp。--design-system 支持 -f ascii(默认)、-f markdown 和 --json 输出。

限制与注意:--domain 省略时自动检测可能误判重叠词(如 font 同时匹配 typography 与 google-fonts),结果偏离时可显式指定。若搜索返回 0 结果,不得编造输出,应先用更宽泛或不同措辞的关键词重试一次,仍为空则回退到优先级表并向用户说明该建议来自内置默认值而非数据库匹配,绝不能把 0 结果搜索当作有数据呈现。官方未提供收费、价格与平台信息。