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
用于增强视觉平淡或保守设计的冲击力与个性,通过优化排版、色彩和层级使其更具记忆点,同时保持可用性与品牌一致性。
用户反馈设计过于安全、平庸或缺乏个性
用户希望提升视觉冲击力和角色感
npx skills add 10xChengTu/Mux0 --skill bolder -g -y
优化界面文案、错误提示及标签,提升用户体验。通过识别术语滥用、歧义等问题,提供清晰、友好的改写建议。
用户提到混淆的文本或标签
需要改进错误消息或微文案
npx skills add 10xChengTu/Mux0 --skill clarify -g -y
为单调或缺乏视觉吸引力的界面添加战略性色彩,提升界面的参与度与表现力。适用于用户提及设计灰暗、缺乏温暖或需要更鲜艳配色方案时。
设计看起来灰色或沉闷
缺乏视觉兴趣
需要增加色彩或活力
npx skills add 10xChengTu/Mux0 --skill colorize -g -y
从UX视角评估设计质量,涵盖视觉层级、信息架构及情感共鸣等维度。支持量化评分、反模式检测与认知负荷分析,提供可执行反馈,适用于设计审查与评估场景。
用户要求审查或批判设计
需要评估界面组件的UX质量
npx skills add 10xChengTu/Mux0 --skill critique -g -y
用于在界面设计中添加惊喜、个性和微交互,提升用户体验的愉悦感与记忆点。适用于用户请求增加打磨、动画或趣味性的场景。
用户请求增加界面打磨或个性
需要添加动画或微交互以提升体验
npx skills add 10xChengTu/Mux0 --skill delight -g -y
用于简化设计、去除冗余元素和视觉噪音,通过 ruthless simplification 提升 UI 的清晰度与专注度。适用于用户请求简化界面、减少杂乱或优化信息架构的场景。
用户要求简化设计
需要去除 UI 中的冗余元素
请求减少视觉噪音
希望让界面更清晰聚焦
npx skills add 10xChengTu/Mux0 --skill distill -g -y
指导创建独特且生产级的前端界面,避免通用AI美学。通过收集受众、用例和品牌语境确定设计方向,强调大胆的美学选择和细节打磨,生成高质量、视觉突出的前端代码。
构建Web组件或页面
需要高设计质量的UI开发
提取可复用组件和设计令牌
npx skills add 10xChengTu/Mux0 --skill impeccable -g -y
用于评估和改善用户界面布局、间距及视觉层次,解决网格单调、对齐混乱等问题。通过系统性规划间距系统和结构,提升界面节奏感与可读性。
用户提到布局感觉不对劲
存在间距问题
视觉层次不清
UI过于拥挤
需要对齐或改善构图
npx skills add 10xChengTu/Mux0 --skill layout -g -y
诊断并修复UI性能问题,涵盖加载速度、渲染、动画及包体积优化。通过测量Core Web Vitals等指标定位瓶颈,实施图片压缩、代码分割、CSS优化等策略,提升页面响应速度与用户体验。
用户提到页面慢、卡顿或加载时间长
需要优化前端性能或减小包体积
询问如何提升渲染流畅度
npx skills add 10xChengTu/Mux0 --skill optimize -g -y
用于实现突破常规的极致前端交互效果,如60fps动画、着色器及复杂滚动特效。需先通过/impeccable收集上下文,提出多种方案供用户选择,并利用浏览器自动化进行视觉迭代优化,确保体验惊艳且符合项目语境。
需要实现令人惊叹的视觉效果或极致交互
用户希望界面感觉非凡或超越常规限制
npx skills add 10xChengTu/Mux0 --skill overdrive -g -y
在交付前执行最终质量审查,修复对齐、间距、一致性及微细节问题。通过发现设计系统并评估功能完整性,确保从良好到卓越的转变,适用于预发布审查和收尾工作。
用户提到 polish 或 finishing touches
感觉作品看起来不对劲 (something looks off)
希望从良好提升到卓越 (go from good to great)
准备上线前的最终检查 (pre-launch review)
npx skills add 10xChengTu/Mux0 --skill polish -g -y
用于降低视觉设计强度,解决过于 bold、aggressive 或 overstimulating 的问题。通过调整色彩饱和度、对比度、排版层级和简化装饰元素,打造更精致、柔和且不失影响力的美学风格,适用于需要更内敛设计的场景。
用户提到设计太 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


