Agent Skills
› 10xChengTu/input0
10xChengTu/input0
GitHub将现有设计适配至不同屏幕尺寸、设备或平台，实现响应式布局与跨设备兼容。
Install All Skills
npx skills add 10xChengTu/input0 --all -g -y
Skills in Collection (21)
将现有设计适配至不同屏幕尺寸、设备或平台，实现响应式布局与跨设备兼容。
用户提到响应式设计
需要适配移动端布局
涉及断点调整
要求视口适配
跨设备兼容性需求
npx skills add 10xChengTu/input0 --skill adapt -g -y
用于为功能特性添加动画、微交互和运动效果，提升可用性和用户体验。分析静态区域，制定动画策略并实施入场动画及微交互，同时尊重用户偏好。
用户提到添加动画
需要增强UI交互体验
npx skills add 10xChengTu/input0 --skill animate -g -y
评估并优化界面布局、间距及视觉层级，解决单调网格、间距不一致和层次弱等问题，通过建立一致的间距系统和结构化策略提升视觉节奏与用户体验。
用户提到布局感觉不对
存在间距问题
视觉层级混乱
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写作场景。
用户提到混淆的文本
需要改进错误消息
希望优化UX写作
npx skills add 10xChengTu/input0 --skill clarify -g -y
为单调或缺乏视觉吸引力的界面策略性引入色彩，提升设计的参与度与表现力。通过评估现状、制定配色计划并系统性地应用语义及强调色，解决界面灰暗问题，同时确保符合品牌规范与无障碍标准。
用户提到设计看起来灰色或沉闷
用户希望增加界面的色彩丰富度或活力
需要改善界面的视觉吸引力
npx skills add 10xChengTu/input0 --skill colorize -g -y
用于从UX视角评估界面设计，涵盖视觉层次、信息架构、情感共鸣及AI生成痕迹检测，提供量化评分与可执行反馈。
用户要求审查或批判设计
请求对组件进行可用性评估
需要获取设计改进建议
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 模式或构建设计系统的场景。
创建可复用组件
重构重复的 UI 模式
构建设计系统
提取设计令牌
npx skills add 10xChengTu/input0 --skill extract -g -y
指导创建具有独特美学和高质量的前端界面，避免通用AI风格。通过强制收集项目上下文（受众、用例、品牌调性）并确立大胆的设计方向，生成生产级、视觉引人注目的前端代码。
构建Web组件或页面
设计海报或应用程序界面
需要特定项目语境的前端设计任务
npx skills add 10xChengTu/input0 --skill frontend-design -g -y
提升前端界面健壮性，处理文本溢出、国际化适配及异常状态。用于修复UI边界情况，确保生产环境稳定可用。
加固界面
处理文本溢出
添加错误状态
支持国际化
修复边缘情况
npx skills add 10xChengTu/input0 --skill harden -g -y
审计并重构UI以对齐设计系统标准，解决样式漂移、间距和Token不一致问题。
用户提到一致性或设计漂移
需要修复不匹配的样式或Token
要求功能回归设计系统规范
npx skills add 10xChengTu/input0 --skill normalize -g -y
用于设计和优化产品引导流程、空状态及首次运行体验，帮助用户快速实现价值。涵盖需求评估、设计原则（如渐进式披露）及具体场景实现。
用户提及 onboarding（引导）
涉及 first-run experiences（首次运行体验）
讨论 empty states（空状态）
关注 activation（激活）或 getting started（入门）
npx skills add 10xChengTu/input0 --skill onboard -g -y
诊断并修复UI性能问题，涵盖加载速度、渲染、动画及包体积优化。指导测量核心指标如Core Web Vitals，实施图片压缩、代码分割、懒加载等策略，提升页面加载与交互流畅度。
用户提到页面慢、卡顿或加载时间长
需要优化JavaScript/CSS包体积
希望改善前端渲染性能或动画流畅度
npx skills add 10xChengTu/input0 --skill optimize -g -y
专注于前端极致体验的 Skill，通过着色器、弹簧物理、60fps 动画等高级技术打造非凡界面。强调先提案后实现，利用浏览器自动化进行视觉迭代，确保效果惊艳且符合项目语境。
用户希望界面令人惊叹或印象深刻
需要实现高性能动画或复杂交互效果
npx skills add 10xChengTu/input0 --skill overdrive -g -y
执行最终质量审查，修复对齐、间距、一致性及微细节问题。适用于上线前的收尾阶段，旨在将作品从良好提升至卓越，确保视觉与交互的完美呈现。
用户提到 polish
准备上线前的最终检查
感觉效果不够完美
想要提升完成度
npx skills add 10xChengTu/input0 --skill polish -g -y
用于降低视觉设计强度，解决过于 Bold、Aggressive 或过刺激的问题。通过调整色彩饱和度、对比度、排版层级和简化元素，在保留设计效果的同时提升精致感与舒适度。
用户反馈设计太 Bold 或 Aggressive
用户希望获得更 Calm 或 Refined 的美学风格
npx skills add 10xChengTu/input0 --skill quieter -g -y
一次性收集项目设计上下文并持久化保存，通过扫描代码库和询问用户明确UX、品牌及美学偏好，生成设计原则指导后续工作。
需要建立或更新项目设计规范
初始化AI助手的设计上下文配置
npx skills add 10xChengTu/input0 --skill teach-impeccable -g -y
评估并优化排版，通过改进字体选择、层级、尺寸和可读性，将默认文本转化为精心设计的视觉体验。适用于处理字体、排版层级及阅读体验问题。
用户提到字体或排版问题
需要提升文本可读性或层级清晰度
npx skills add 10xChengTu/input0 --skill typeset -g -y
