菜单
一站式 UI/UX 优化专家，自动执行完整的设计优化流程。Invoke when user wants comprehensive UI/UX improvements, full page optimization, or 'make this look professional'.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Enforce form validation before submit. Validate first, return early on failure, and only then run the async submit logic inside try/catch so validation errors aren’t swallowed and misreported.
强制遵循Element Plus开发规范：使用CSS变量而非硬编码值、不修改组件自带样式、不使用内联样式、使用标准CSS类和scoped样式。在涉及Element Plus样式修改时必须调用此技能。
Set up and run end-to-end (E2E) tests for web applications using Playwright. Invoke when user wants to create E2E tests, set up testing framework, or run automated browser tests.
强制遵循Y-SSO前端开发规范：Vue组件规范、CSS变量使用、BEM命名、导入顺序、文件结构等。仅在修改 frontend/src/ 目录下文件时调用。
YWeb DDD 分层架构与 API 设计规范。在创建或修改 API 路由、Service 层、领域模型、DTO 时使用。涵盖瘦 API 原则、服务层拆分、Model 设计、DTO 转换、响应格式等。
YWeb ORM 使用规范。在编写数据库模型定义、CRUD 操作、查询过滤、分页、软删除、事务管理、批量操作、关系定义等数据层代码时使用。基于 SQLAlchemy 的 Active Record 模式。
| name | ui-ux-pro-max |
| description | 一站式 UI/UX 优化专家，自动执行完整的设计优化流程。Invoke when user wants comprehensive UI/UX improvements, full page optimization, or 'make this look professional'. |
一站式 UI/UX 优化专家，自动执行完整的设计优化流程，从诊断到最终交付。
当用户说以下话时调用：
第一阶段：诊断和准备（自动执行）
├── 1. 检查 teach-impeccable 是否已运行
│ └── 如果未运行，提示用户先运行 teach-impeccable
├── 2. web-design-guidelines
│ └── 根据 Vercel Web Interface Guidelines 审查代码
└── 3. audit
└── 全面审查界面质量
第二阶段：结构性优化
├── 4. normalize
│ └── 规范化到设计系统
├── 5. distill
│ └── 简化不必要的复杂性
└── 6. arrange
└── 优化布局和间距
第三阶段：视觉优化
├── 7. typeset
│ └── 优化字体排版
├── 8. colorize（谨慎使用）
│ └── 仅在界面过于单调时添加战略性颜色
└── 9. bolder/quieter（按需）
└── 根据当前设计强度调整
第四阶段：交互优化
├── 10. animate
│ └── 添加动画和微交互
├── 11. clarify
│ └── 优化文案
└── 12. delight（可选）
└── 添加惊喜时刻
第五阶段：健壮性和适配
├── 13. harden
│ └── 错误处理和边缘情况
├── 14. adapt
│ └── 响应式适配
└── 15. onboard
└── 优化空状态和引导
第六阶段：最终交付
├── 16. extract
│ └── 提取可复用组件
├── 17. optimize
│ └── 性能优化
└── 18. polish
└── 最终润色
ui-ux-pro-max
自动优化当前文件或整个项目。
ui-ux-pro-max src/pages/users/Index.vue
ui-ux-pro-max src/pages/
ui-ux-pro-max --quick
跳过 bolder/quieter、delight 等可选步骤。
ui-ux-pro-max --visual-only
只执行视觉相关优化（normalize、arrange、typeset、colorize、animate、polish）。
执行完成后会生成：