Agent Skills
› 10xChengTu/input0
10xChengTu/input0
GitHub用于将现有设计适配到不同屏幕尺寸、设备或平台，实现响应式布局。涵盖断点设置、流体布局和触摸目标优化，适用于移动端、平板及跨设备兼容性场景。
安装全部 Skills
npx skills add 10xChengTu/input0 --all -g -y
集合内 Skills (21)
用于将现有设计适配到不同屏幕尺寸、设备或平台，实现响应式布局。涵盖断点设置、流体布局和触摸目标优化，适用于移动端、平板及跨设备兼容性场景。
响应式设计
多端适配
断点调整
npx skills add 10xChengTu/input0 --skill adapt -g -y
用于为前端功能添加动画、微交互和动效，提升可用性与体验。触发场景包括提及动画、过渡、悬停效果或使UI更生动时。
用户提到添加动画或过渡效果
需要增强微交互或悬停效果
希望使界面更具活力和反馈感
npx skills add 10xChengTu/input0 --skill animate -g -y
优化UI布局、间距与视觉层次，解决单调网格、对齐及密度问题。通过评估当前设计并制定系统性改进计划，提升界面节奏感与结构清晰度。
用户提到布局感觉不对
间距不一致或混乱
视觉层次弱
UI拥挤或对齐问题
npx skills add 10xChengTu/input0 --skill arrange -g -y
执行前端技术质量审计，涵盖无障碍、性能、主题、响应式及反模式检查。生成带严重等级评分的报告与改进计划，仅记录问题不修复。
用户要求进行代码质量审查
需要评估可访问性或性能指标
获取前端技术债务报告
npx skills add 10xChengTu/input0 --skill audit -g -y
用于增强过于保守或平淡的设计，通过调整排版、色彩和层级来提升视觉冲击力与个性，同时保持可用性和品牌一致性。
用户觉得设计太安全、平庸或缺乏个性
用户希望增加视觉冲击力和角色感
npx skills add 10xChengTu/input0 --skill bolder -g -y
优化界面文案、错误提示及微交互文本，提升用户理解度与体验。适用于澄清混淆文本、改进标签和指令等场景。
用户提到困惑的文本或标签
需要改进错误消息
希望优化UX写作
npx skills add 10xChengTu/input0 --skill clarify -g -y
为单调或缺乏视觉吸引力的界面策略性引入色彩，提升界面的参与度与表现力。通过分析现状、制定配色计划并系统性地应用语义和强调色，解决界面灰暗问题。
用户提到设计看起来灰色或沉闷
需要增加色彩的活力或表现力
npx skills add 10xChengTu/input0 --skill colorize -g -y
从UX视角评估设计，涵盖视觉层次、信息架构、情感共鸣及认知负荷等维度，提供量化评分与可执行反馈。用于审查界面是否真正可用且体验良好，识别AI生成痕迹并给出改进建议。
用户要求评审或批判某个设计/组件
用户请求对界面进行UX评估或提供反馈
npx skills add 10xChengTu/input0 --skill critique -g -y
为界面添加惊喜、个性和微交互，将功能转化为愉悦体验。适用于优化成功/空/加载状态及错误提示，提升用户情感共鸣与品牌个性，同时确保不干扰核心任务与可用性。
请求增加界面趣味性或个性化
需要添加微交互或动画以提升用户体验
优化空状态、加载状态或错误提示的情感化设计
npx skills add 10xChengTu/input0 --skill delight -g -y
用于简化UI设计，去除冗余元素和视觉噪音，通过渐进式披露和信息架构优化，聚焦核心用户目标，打造简洁、清晰且高效的设计方案。
用户要求简化界面或减少复杂性
需要清理杂乱的设计元素
优化UI以去除视觉噪音
npx skills add 10xChengTu/input0 --skill distill -g -y
用于识别、提取并整合可复用的 UI 组件、设计令牌和模式到设计系统中，提升一致性与维护性。
创建组件
重构重复的 UI 模式
构建设计系统
提取设计令牌
npx skills add 10xChengTu/input0 --skill extract -g -y
指导创建独特且生产级的前端界面，避免通用AI美学。通过收集目标受众、用例和品牌调性等上下文，确立大胆的设计方向，并生成具有视觉冲击力和高设计质量的代码实现。
构建Web组件或页面
设计海报或应用程序界面
需要项目上下文的任何设计任务
npx skills add 10xChengTu/input0 --skill frontend-design -g -y
提升前端界面健壮性，处理文本溢出、国际化适配及异常状态，确保生产环境稳定性。
加固界面
处理边缘情况
添加错误状态
修复溢出和国际化问题
npx skills add 10xChengTu/input0 --skill harden -g -y
审计并重构UI以对齐设计系统标准，修复样式漂移、硬编码值及组件不一致问题。通过发现设计文档、分析当前偏差并执行规范化计划，确保排版、颜色、间距、组件和可访问性符合规范，提升UX一致性。
用户提到设计一致性或设计漂移
需要修复不匹配的样式或Token
希望将功能对齐到设计系统
npx skills add 10xChengTu/input0 --skill normalize -g -y
设计并优化新用户引导流程、空状态及首次运行体验，帮助用户快速实现产品价值。涵盖需求评估、核心原则（如展示而非告知、最小化信息收集）及具体场景设计指南。
用户提到 onboarding（引导）
涉及 first-time users（首次使用用户）
处理 empty states（空状态）
关注 activation（激活）或 getting started（上手）
npx skills add 10xChengTu/input0 --skill onboard -g -y
诊断并修复前端UI性能问题，涵盖加载速度、渲染效率、动画流畅度及包体积优化。通过测量核心指标识别瓶颈，实施图片、JS、CSS等策略提升用户体验。
用户提到页面加载慢、卡顿或延迟
需要优化Core Web Vitals指标
请求减小JavaScript/CSS包体积
希望提升动画流畅度和渲染性能
npx skills add 10xChengTu/input0 --skill optimize -g -y
专注于前端极致体验的 Skill，通过 Shader、物理动画及高性能渲染突破界面常规限制。要求先评估上下文并提案，再经浏览器自动化验证迭代，实现令人惊叹的交互效果。
用户希望实现极具视觉冲击力的界面效果
需要处理复杂的高性能前端交互或动画
npx skills add 10xChengTu/input0 --skill overdrive -g -y
在发布前执行最终质量检查，修复对齐、间距、一致性及微细节问题。用于将作品从良好提升至完美，确保视觉、交互和排版的精细度。
用户提到 polish 或 finishing touches
进行 pre-launch review
感觉界面不对劲
希望从 good 提升到 great
npx skills add 10xChengTu/input0 --skill polish -g -y
用于降低视觉设计强度，将过于大胆、刺眼或复杂的设计调整为更精致、柔和且易读的风格。通过优化色彩饱和度、对比度、排版层级和留白，在保持设计有效性的同时提升高级感与舒适度。
用户觉得设计太 Bold 或 Aggressive
设计看起来 Overwhelming 或 Garish
需要更 Calm 或 Refined 的美学风格
npx skills add 10xChengTu/input0 --skill quieter -g -y
一次性设置技能，通过扫描代码库和询问用户来收集项目设计上下文（品牌、美学、无障碍等），并持久化保存至配置文件，为后续AI生成UI提供指导。
需要建立或更新项目设计规范时
初始化新项目的设计上下文配置时
npx skills add 10xChengTu/input0 --skill teach-impeccable -g -y
用于评估和改善排版设计，通过优化字体选择、层级、大小和可读性，解决文本杂乱或默认外观问题，提升视觉专业度与阅读体验。
用户提到字体、排版、可读性或文本层级
希望改善文本外观使其更专业
npx skills add 10xChengTu/input0 --skill typeset -g -y
