Agent Skills
› 10xChengTu/Mux0
10xChengTu/Mux0
GitHub将设计适配至不同屏幕尺寸、设备及平台,实现响应式布局与断点调整。用于处理跨设备兼容性及移动端/桌面端体验优化。
Install All Skills
npx skills add 10xChengTu/Mux0 --all -g -y
Skills in Collection (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
用于提升过于保守或平淡的设计,通过增强视觉冲击力、个性与层级对比,使其更具记忆点。需遵循上下文协议,避免AI陈词滥调,确保在保持可用性的前提下大胆创新。
用户觉得设计太安全或乏味
设计缺乏个性或视觉冲击力
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视角评估设计,涵盖视觉层次、信息架构及情感共鸣等维度。通过独立子代理进行AI垃圾检测与整体审查,结合量化评分和反模式识别提供可操作反馈。
用户要求评审或批判设计
用户请求对界面组件进行评估
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风格,通过‘craft’生成代码或‘teach’建立设计体系。
构建网页组件
设计页面布局
应用UI/UX设计
npx skills add 10xChengTu/Mux0 --skill impeccable -g -y
用于修复界面布局单调、间距不一致及视觉层级弱等问题,通过评估间距、层次和结构,制定并实施系统化的布局改进方案,提升UI的视觉节奏与构图质量。
用户提到布局感觉不对劲
存在间距问题
视觉层级混乱
UI过于拥挤
对齐出现问题
希望改善整体构图
npx skills add 10xChengTu/Mux0 --skill layout -g -y
诊断并修复UI性能问题,涵盖加载速度、渲染、动画及包体积。通过测量核心指标识别瓶颈,提供图片优化、代码分割、CSS精简等策略,旨在提升用户体验和页面流畅度。
用户提到页面慢、卡顿或加载时间长
需要优化前端性能或减少资源体积
npx skills add 10xChengTu/Mux0 --skill optimize -g -y
用于实现突破常规的高性能前端交互与视觉特效,涵盖着色器、物理动画及60fps渲染。需先获取设计上下文,提出多方案并获确认后,结合浏览器自动化进行视觉迭代优化,确保效果惊艳且符合项目调性。
用户希望界面效果令人惊叹或印象深刻
需要实现复杂的CSS/JS动画、高性能数据渲染或沉浸式页面过渡
npx skills add 10xChengTu/Mux0 --skill overdrive -g -y
在交付前执行最终质量检查,修复对齐、间距、一致性及微细节问题。适用于提及打磨、收尾或预发布审查的场景,确保从良好到卓越的转变。
用户提到 polish
准备上线前的最终审查
感觉某些地方不对劲
希望提升完成度
npx skills add 10xChengTu/Mux0 --skill polish -g -y
用于降低视觉设计强度,解决过于大胆、刺眼或过度刺激的问题。通过调整色彩饱和度、对比度、排版和留白等维度,在保持设计有效性的同时,营造更精致、柔和且易于接受的美学风格。
用户提到设计太 bold, loud, overwhelming, 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


