SuperAPI AI 工具集

tool-ui-ux-pro-max

设计与创作

查看项目

更新于 10-15 21:38

技能介绍

用途:作为查表工具,快速获取具体 UI/UX 设计输入,包括调色板令牌、字体搭配、UX 约束、特定技术栈实现说明,这些输入可综合为 design-system.md、UI 重构计划或验收标准,以及“看起来对但用起来别扭”问题的评审清单。

必要用法:需先确认 Python 可用:python3 --version || python --version。核心命令为领域检索:python3 ~/.claude/skills/tool-ui-ux-pro-max/scripts/search.py "<query>" --domain <domain> [-n <max_results>],或技术栈检索:python3 ~/.claude/skills/tool-ui-ux-pro-max/scripts/search.py "<query>" --stack <stack> [-n <max_results>]。可用技术栈:html-tailwind、react、nextjs、vue、svelte、swiftui、react-native、flutter。

检索领域:product(按产品类型给风格方向)、style(风格细节,如色彩/形状/动效/复杂度)、typography(标题与正文搭配,含 Google Fonts 与 CSS 导入)、color(调色板令牌)、landing(着陆页结构与 CTA 位置)、chart(图表建议)、ux(UX 与无障碍规则及反模式)、prompt(提示/技术关键词)。

推荐流程:先明确产品类型、语调关键词、行业、技术栈(未指定默认 html-tailwind),每个领域取 1–3 条结果后综合,再按技术栈检索以贴合实现约束。

常见规则:使用一致的 SVG 图标集(Heroicons/Lucide/Simple Icons)而非 emoji 图标;悬停状态用颜色/透明度/阴影过渡避免布局偏移;使用官方 SVG 品牌标志;统一图标尺寸与容器宽度;可点击区域加 cursor-pointer 并给明确反馈;过渡保持 150–300ms 一致。

交付前清单:无 emoji 作图标、图标集一致、品牌标志正确、悬停不引起布局偏移、颜色走令牌系统;可点击面有 cursor-pointer、悬停/聚焦反馈清晰、过渡一致、键盘焦点可见;在 320/768/1024/1440px 可用、移动端无横向滚动、固定元素不遮挡内容;图片有 alt、表单有标签、颜色非唯一指示、尊重 prefers-reduced-motion。

限制:它是查表工具,不生成页面;具体内容取决于检索结果,资料未提供更多定价或平台信息。