UI/UX Pro Max 是一个面向网页与移动应用的 UI/UX 设计智能技能，核心是一个可检索的设计数据库，按优先级给出设计建议。资料称其包含 50+ 风格、97 种配色方案、57 组字体搭配、99 条 UX 准则和 25 种图表类型，覆盖 9 种技术栈。
适用时机：设计新的 UI 组件或页面、选择配色方案与排版、审查代码中的 UX 问题、构建落地页或仪表盘、实现无障碍（accessibility）要求。
规则按优先级分为 8 类：1）无障碍（CRITICAL）；2）触控与交互（CRITICAL）；3）性能（HIGH）；4）布局与响应式（HIGH）；5）排版与色彩（MEDIUM）；6）动画（MEDIUM）；7）风格选择（MEDIUM）；8）图表与数据（LOW）。快速参考中的要点包括：正文文本对比度至少 4.5:1、交互元素需有可见焦点环、图片需有描述性 alt 文本、仅图标按钮需 aria-label、Tab 顺序与视觉顺序一致、表单使用 label 及 for 属性；触控目标最小 44x44px、异步操作时禁用按钮、错误反馈靠近问题位置、可点击元素加 cursor-pointer；图片优化（WebP、srcset、懒加载）、检查 prefers-reduced-motion、为异步内容预留空间；设置 viewport meta、移动端正文最小 16px、内容不超出视口宽度、定义 z-index 层级（10、20、30、50）；正文行高 1.5–1.75、每行限制 65–75 字符、标题与正文字体气质匹配；微交互时长 150–300ms、用 transform/opacity 而非 width/height、使用骨架屏或加载动画；风格与产品类型匹配并保持全站一致、用 SVG 图标而非 emoji；图表类型与数据类型匹配、使用可访问的配色、为图表提供表格替代。
使用前需确认 Python 已安装（python3 --version 或 python --version），未安装时按操作系统安装：macOS 用 brew install python3；Ubuntu/Debian 用 sudo apt update && sudo apt install python3；Windows 用 winget install Python.Python.3.12。
工作流程：第一步，从用户请求中提取产品类型、风格关键词、行业和技术栈（未指定时默认 html-tailwind）。第二步，必须先用 --design-system 生成设计系统：python3 skills/ui-ux-pro-max/scripts/search.py "<product_type> <industry> <keywords>" --design-system [-p "Project Name"]，该命令并行检索 product、style、color、landing、typography 五个领域，依据 ui-reasoning.csv 中的推理规则选出最佳匹配，返回完整设计系统（模式、风格、配色、排版、效果）并附应避免的反模式。可加 --persist 持久化设计系统：生成 design-system/MASTER.md 作为全局事实来源，以及 design-system/pages/ 目录存放页面级覆盖；加 --page "dashboard" 还会生成 design-system/pages/dashboard.md 记录该页面对 Master 的偏离。层级检索规则：构建某页面时先查对应页面文件，存在则其规则覆盖 Master，不存在则只用 Master。--design-system 支持两种输出格式：默认 ASCII 框（适合终端显示），加 -f markdown 输出 Markdown（适合文档）。第三步，按需用领域检索补充细节：python3 skills/ui-ux-pro-max/scripts/search.py "<keyword>" --domain <domain> [-n <max_results>]。可用领域包括 product（产品类型建议）、style（UI 风格、颜色、效果）、typography（字体搭配、Google Fonts）、color（按产品类型的配色）、landing（页面结构与 CTA 策略）、chart（图表类型与库建议）、ux（最佳实践与反模式）、react（React/Next.js 性能）、web（Web 界面准则）、prompt（AI 提示与 CSS 关键词）。第四步，获取技术栈实现规范：python3 skills/ui-ux-pro-max/scripts/search.py "<keyword>" --stack html-tailwind。可用栈包括 html-tailwind（默认）、react、nextjs、vue、svelte、swiftui、react-native、flutter、shadcn、jetpack-compose。
提高效果的技巧：关键词尽量具体（如 "healthcare SaaS dashboard" 优于 "app"）；多次用不同关键词检索；组合多个领域（风格 + 排版 + 颜色）形成完整设计系统；常查 UX 常见问题（animation、z-index、accessibility）；使用 --stack 获取实现层建议；首次检索不匹配时迭代关键词。
专业 UI 的常见规则：不用 emoji 作图标，改用 SVG 图标（Heroicons、Lucide、Simple Icons）；悬停用颜色/透明度过渡，不用导致布局位移的 scale 变换；品牌 logo 从 Simple Icons 获取官方 SVG；图标统一使用固定 viewBox（24x24）配 w-6 h-6；所有可点击/可悬停卡片加 cursor-pointer 并提供悬停反馈；过渡使用 transition-colors duration-200；浅色模式玻璃卡片用 bg-white/80 或更高不透明度，正文文字用 #0F172A（slate-900），次要文字至少 #475569（slate-600），边框用 border-gray-200；浮动导航栏加 top-4 left-4 right-4 间距并为固定导航栏高度预留内容 padding；容器宽度保持一致（如统一 max-w-6xl 或 max-w-7xl）。
交付前检查清单：视觉质量（无 emoji 图标、图标集一致、品牌 logo 正确、悬停不引起布局位移、直接用主题色如 bg-primary 而非 var() 包装）；交互（可点击元素均有 cursor-pointer、悬停有清晰反馈、过渡平滑 150–300ms、键盘焦点可见）；明暗模式（浅色模式文字对比度至少 4.5:1、玻璃/透明元素在浅色模式可见、边框两种模式均可见、交付前两种模式都测试）；布局（浮动元素与边缘留有间距、内容不被固定导航遮挡、在 375px/768px/1024px/1440px 响应式正常、移动端无横向滚动）；无障碍（图片有 alt、表单输入有 label、颜色不是唯一指示、尊重 prefers-reduced-motion）。
限制：资料未说明该技能的收费、价格或平台支持细节，相关事实暂未提供；主要依赖 Python 脚本运行，需本地具备 Python 环境。