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
优化界面文案、错误提示和微交互文本，提升用户体验。用于解决标签不清、指引困难或语气不当等问题，通过结构化分析改善用户理解与操作效率。
用户提到界面文案不清晰
需要改进错误提示信息
优化按钮或表单标签
提升微复制可读性
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美学。需先收集受众、用例及品牌调性等上下文，确定大胆的美学方向后生成高质量代码。
构建网页组件
设计页面或应用
需要项目上下文的UI设计任务
npx skills add 10xChengTu/input0 --skill frontend-design -g -y
提升界面鲁棒性，处理文本溢出、i18n适配及边缘情况。通过增强错误处理和极端输入测试，确保界面在生产环境中稳定可靠。
用户要求硬化（harden）或使产品就绪（production-ready）
处理文本溢出、国际化（i18n）或边缘情况问题
npx skills add 10xChengTu/input0 --skill harden -g -y
审计并重构UI以对齐设计系统规范，修复样式漂移和不一致问题。通过分析当前实现与设计原则的差异，制定计划将组件、颜色、间距等替换为设计令牌或标准组件，确保视觉与交互的一致性。
提到一致性或设计漂移
样式不匹配
使用令牌
需要对齐设计系统
npx skills add 10xChengTu/input0 --skill normalize -g -y
设计并优化新用户引导流程、空状态及首次运行体验，帮助用户快速实现产品价值。适用于涉及新手引导、激活或新用户路径的场景。
用户提到 onboarding（引导）
用户提到 first-time users（首次用户）
用户提到 empty states（空状态）
用户提到 activation（激活）
用户提到 getting started（开始使用）
用户提到 new user flows（新用户流程）
npx skills add 10xChengTu/input0 --skill onboard -g -y
诊断并修复UI性能问题，涵盖加载速度、渲染、动画及包体积。通过测量核心指标定位瓶颈，提供图片、JS、CSS优化方案，旨在提升用户体验与加载效率。
用户提到慢、卡顿或性能差
需要优化包体积或加载时间
追求更流畅的用户体验
npx skills add 10xChengTu/input0 --skill optimize -g -y
用于实现突破常规极限的高技术含量前端交互效果，如60fps动画、着色器和滚动驱动揭示。要求先提案再构建，并通过浏览器自动化迭代验证视觉效果，确保体验非凡。
用户希望界面效果令人惊叹或印象深刻
需要实现高性能复杂动画或视觉特效
npx skills add 10xChengTu/input0 --skill overdrive -g -y
用于在发布前对前端设计进行最终质量审查，修复对齐、间距、一致性及微细节问题。通过系统化的视觉、排版、色彩和交互状态检查，确保产品从良好达到卓越，提升用户体验和交付质量。
用户提到 polish
用户想要 finishing touches
用户提及 pre-launch review
用户表示 something looks off
用户希望 go from good to great
npx skills add 10xChengTu/input0 --skill polish -g -y
用于降低视觉设计强度，处理过于 bold、aggressive 或 overstimulating 的设计，通过调整色彩饱和度、对比度、排版层级和简化元素，打造更精致、舒适且不失效果的审美风格。
用户提到设计太 bold、loud、overwhelming、aggressive、garish
用户希望获得更 calm、refined 的视觉效果
npx skills add 10xChengTu/input0 --skill quieter -g -y
收集项目设计上下文并持久化保存，用于确立AI辅助开发的设计规范。
建立项目设计规范
初始化AI设计上下文
npx skills add 10xChengTu/input0 --skill teach-impeccable -g -y
用于评估并优化前端界面的排版设计，包括字体选择、层级结构、字号比例及可读性。旨在解决默认或混乱的文本样式，建立系统化的类型规范，使界面文字更清晰、专业且符合品牌调性。
用户提到字体、排版、可读性或文本层级问题
希望改善界面文字的视觉精致度和专业性
npx skills add 10xChengTu/input0 --skill typeset -g -y
