Agent Skills
› 10xChengTu/Mux0
10xChengTu/Mux0
GitHub指导将设计适配至不同屏幕尺寸、设备及平台，涵盖断点设置、流体布局及触控目标优化。用于响应式设计、移动端布局及跨设备兼容性场景。
安装全部 Skills
npx skills add 10xChengTu/Mux0 --all -g -y
集合内 Skills (17)
指导将设计适配至不同屏幕尺寸、设备及平台，涵盖断点设置、流体布局及触控目标优化。用于响应式设计、移动端布局及跨设备兼容性场景。
响应式设计
移动端布局
断点适配
视口适配
跨设备兼容性
npx skills add 10xChengTu/Mux0 --skill adapt -g -y
分析功能并战略性地添加动画与微交互，以增强用户体验、提供反馈并提升愉悦感。涵盖入口动画、按钮反馈及表单交互等实现细节。
用户提到添加动画或过渡效果
需要优化UI交互体验
npx skills add 10xChengTu/Mux0 --skill animate -g -y
对前端代码进行技术质量审计，涵盖无障碍、性能、主题、响应式及反模式检查。生成带严重等级评分的报告和行动计划，用于识别问题而非修复。
用户要求进行无障碍检查
用户要求性能审计
用户需要进行技术质量审查
npx skills add 10xChengTu/Mux0 --skill audit -g -y
增强过于保守或平淡设计的视觉冲击力与个性，在保持可用性的前提下通过排版、色彩和层级对比提升设计表现力。
用户认为设计过于安全或无聊
希望增加设计的视觉冲击力和个性
npx skills add 10xChengTu/Mux0 --skill bolder -g -y
优化界面文案、错误提示和微交互文本，解决歧义与术语问题，提升用户体验清晰度。
用户提到困惑的文本或标签
需要改进错误消息
想要更好的UX写作
npx skills add 10xChengTu/Mux0 --skill clarify -g -y
为单调或灰暗的界面策略性引入色彩，提升视觉吸引力与表达力。通过评估现状、制定配色计划及语义/强调色应用，确保色彩具有明确目的性，增强层次、状态指示与情感氛围。
用户提到设计看起来灰色、沉闷或缺乏视觉趣味
用户希望增加色彩、温暖感、活力或更丰富的调色板
npx skills add 10xChengTu/Mux0 --skill colorize -g -y
用于从UX视角评估设计质量，涵盖视觉层级、信息架构及认知负荷等维度。通过量化评分、反模式检测及独立双盲评估机制，提供针对界面组件或整体设计的批判性反馈与改进建议。
用户要求审查设计
用户要求对设计或组件进行批评
npx skills add 10xChengTu/Mux0 --skill critique -g -y
用于为界面添加惊喜、个性和微交互，提升用户体验的愉悦感。适用于需要增加动画、情感化设计或彩蛋的场景。
用户要求增加界面趣味性或个性
用户希望优化成功、加载或错误状态下的交互体验
用户请求添加微交互动画或彩蛋
npx skills add 10xChengTu/Mux0 --skill delight -g -y
用于简化设计、去除冗余元素和视觉噪音，通过精简信息架构和视觉风格提升界面清晰度与专注度。适用于用户要求简化、去杂乱或优化UI的场景。
用户要求简化设计
用户要求去除冗余元素
用户要求清理界面杂乱
用户希望使UI更简洁聚焦
npx skills add 10xChengTu/Mux0 --skill distill -g -y
用于创建独特、生产级的高质量前端界面，避免通用AI美学。通过收集受众、用例和品牌语境，制定大胆的设计方向并实现代码。
构建网页组件或页面
设计海报或应用界面
需要项目上下文的任何设计任务
npx skills add 10xChengTu/Mux0 --skill impeccable -g -y
用于评估和改善界面布局、间距及视觉节奏，解决网格单调、层级不清等问题，通过系统化规划提升UI构图与结构。
用户反馈布局感觉不对或拥挤
需要优化间距和视觉层级
处理对齐问题或改善构图
npx skills add 10xChengTu/Mux0 --skill layout -g -y
诊断并修复前端UI性能问题，涵盖加载速度、渲染、动画及包体积优化。通过测量Core Web Vitals等指标定位瓶颈，提供图片、JS/CSS优化策略，提升用户体验流畅度。
用户提到页面慢、卡顿或加载时间长
需要优化Bundle大小或首屏加载速度
希望提升渲染帧率或交互响应速度
npx skills add 10xChengTu/Mux0 --skill optimize -g -y
用于实现超越常规的浏览器界面特效，如高性能动画、复杂交互和视觉冲击效果。强调在实施前通过上下文分析确定“非凡”的定义，提出多种方案并征求用户意见，随后利用浏览器自动化工具进行视觉迭代验证，确保效果既惊艳又符合项目调性。
需要实现令人惊叹的视觉效果或高级交互
构建高性能动画、滚动驱动揭示或物理模拟
优化界面体验以产生‘wow’感
npx skills add 10xChengTu/Mux0 --skill overdrive -g -y
执行发布前的最终质量审查，修复对齐、间距、一致性及微细节问题。需先调用/impeccable获取设计原则，发现并纠正偏离设计系统的硬编码值或样式偏差，确保视觉完美与交互流畅。
polish
finishing touches
pre-launch review
something looks off
go from good to great
npx skills add 10xChengTu/Mux0 --skill polish -g -y
降低设计视觉强度，解决过于激进或刺眼的问题，通过调整色彩、排版和留白提升精致感与舒适度。
用户反馈设计太 bold, loud, aggressive, garish
用户希望获得更 calm, refined 的美学风格
npx skills add 10xChengTu/Mux0 --skill quieter -g -y
在编码前规划UX/UI，通过结构化发现访谈深入理解需求，生成指导实施的设计简报。专注于设计方向、约束和策略，确保实现精准，不编写代码。
需要规划新功能或模块的界面与用户体验时
在开发前希望明确设计方向和约束条件时
npx skills add 10xChengTu/Mux0 --skill shape -g -y
用于评估和改进排版设计，解决字体选择、层级、大小及可读性问题，将默认文本转化为有意图的精致排版。
用户提到字体、排版或可读性
文本层级混乱或大小不当
需要更精致或有意图的排版设计
npx skills add 10xChengTu/Mux0 --skill typeset -g -y
