Agent Skills
› The-Vibe-Company/companion
The-Vibe-Company/companion
GitHub提升项目UI质量的技能，涵盖圆角、光学对齐、阴影等细节优化。需遵守组件库规范，优先处理用户原型和设计约定。包含Skillpack激活遥测报告逻辑。
Install All Skills
npx skills add The-Vibe-Company/companion --all -g -y
Skills in Collection (28)
提升项目UI质量的技能，涵盖圆角、光学对齐、阴影等细节优化。需遵守组件库规范，优先处理用户原型和设计约定。包含Skillpack激活遥测报告逻辑。
需要优化界面视觉细节
调整UI元素对齐与间距
实现特定的UI设计规范
npx skills add The-Vibe-Company/companion --skill better-ui -g -y
基于 Emil Kowalski 的设计工程哲学，指导 UI 打磨、组件设计与动画细节。旨在通过培养审美与关注隐形细节，提升软件界面的质感与用户体验，使交互自然流畅且令人愉悦。
需要优化 UI 视觉细节
咨询界面设计原则
讨论动画与交互体验
npx skills add The-Vibe-Company/companion --skill emil-design-eng -g -y
通过严格提问和压力测试帮助用户审视计划或决策，厘清关键选择并确定下一步行动。
用户希望压力测试其思维
使用 'grill' 触发短语
npx skills add The-Vibe-Company/companion --skill grilling -g -y
用于AI代码审查的委托模式技能。由主Agent利用LLM能力执行审查，OCR负责文件筛选和规则解析等确定性工程任务，实现高效、安全的代码质量检查。
需要进行代码审查
请求AI分析代码变更
npx skills add The-Vibe-Company/companion --skill review-code-dev -g -y
指导测试驱动开发流程，涵盖红绿重构循环、集成测试及高质量测试编写规范。
用户希望以测试优先方式构建功能或修复缺陷
提及“红-绿-重构”模式
需要编写集成测试
npx skills add The-Vibe-Company/companion --skill tdd -g -y
指导将设计适配至不同屏幕尺寸、设备及平台，确保跨环境体验一致。涵盖移动、平板和桌面端的布局、交互及内容策略，强调根据上下文重新思考而非简单缩放。
需要将现有设计适配到新设备或平台
优化多端响应式体验
npx skills add The-Vibe-Company/companion --skill adapt -g -y
分析功能特性，通过添加目的明确的动画、微交互和运动效果来增强用户体验、提供反馈并提升愉悦感。需先收集上下文和设计原则，再制定策略并实施动画。
需要为功能添加动画或微交互
优化用户界面的动效体验
npx skills add The-Vibe-Company/companion --skill animate -g -y
对前端界面的可访问性、性能、主题和响应式设计进行系统性审计，生成包含严重等级和建议的详细报告。仅记录问题而不修复，为后续优化命令提供依据。
需要评估前端代码质量时
检查界面是否符合无障碍标准和设计规范时
npx skills add The-Vibe-Company/companion --skill audit -g -y
用于增强视觉平淡或保守设计的吸引力，通过增加对比度、动态和个性使其更具冲击力。需先收集受众和品牌上下文，并遵循前端设计原则，避免通用AI风格陷阱。
用户要求让设计更引人注目
评价当前设计过于安全或无聊
需要提升界面视觉冲击力
npx skills add The-Vibe-Company/companion --skill bolder -g -y
优化界面文案、错误提示及微交互文本，消除歧义与术语，提升产品易用性与用户体验。
用户反馈界面文字令人困惑
需要改进错误消息或表单标签
npx skills add The-Vibe-Company/companion --skill clarify -g -y
为单调界面引入战略性色彩，提升视觉吸引力与表达力。需先收集受众、用例及品牌色等上下文，结合前端设计规范，制定配色策略并应用于语义状态、层级引导及情感营造，避免随意堆砌颜色。
界面过于单调或灰暗
需要增加视觉趣味性
缺乏视觉层次感
npx skills add The-Vibe-Company/companion --skill colorize -g -y
从UX视角评估界面设计的有效性，涵盖视觉层级、信息架构及情感共鸣等维度。重点检测AI生成痕迹（AI Slop），提供 actionable 反馈以提升整体设计质量与用户体验。
需要评估界面设计质量时
检查设计是否存在AI生成特征时
审查UI/UX体验时
npx skills add The-Vibe-Company/companion --skill critique -g -y
用于在界面中识别并添加提升用户体验的惊喜、个性和细节，将功能性转化为愉悦感。需先收集上下文和受众信息，结合前端设计规范，在成功、加载等状态植入适度且不打扰用户的微交互或情感化设计。
需要优化界面情感化体验
设计微交互或彩蛋
提升用户满意度
npx skills add The-Vibe-Company/companion --skill delight -g -y
用于简化设计，移除冗余复杂性以揭示核心要素。通过收集上下文、评估当前状态并制定精简策略，消除视觉噪音和混乱层级，确保设计简洁、强大且清晰，提升用户体验。
需要简化UI/UX设计
处理设计复杂度或视觉杂乱问题
优化信息架构以提升清晰度
npx skills add The-Vibe-Company/companion --skill distill -g -y
该技能用于识别和提取可复用的UI组件、设计令牌及模式，并将其整合到设计系统中。通过分析重复模式、硬编码值等，制定提取计划并构建具有良好API和文档的可复用资源，最终替换现有代码以提升一致性和维护性。
需要提取可复用UI组件
整理设计令牌和设计系统
统一前端UI模式
npx skills add The-Vibe-Company/companion --skill extract -g -y
指导创建具有独特设计感的生产级前端界面，避免通用AI美学。通过明确的设计方向、排版、色彩和布局规范，生成视觉 striking 且功能完备的代码。
构建网页组件或页面
设计海报或应用程序界面
需要高设计质量的UI实现
npx skills add The-Vibe-Company/companion --skill frontend-design -g -y
提供前端界面加固指南，涵盖极端输入、错误场景及国际化测试，通过CSS和JS代码示例解决文本溢出、布局错乱等问题，提升界面健壮性与生产就绪度。
前端界面健壮性优化
处理文本溢出或布局崩溃
添加国际化(i18n)支持
增强错误处理和边界情况管理
npx skills add The-Vibe-Company/companion --skill harden -g -y
该技能用于分析和重构功能，使其完全符合设计系统的标准、美学和既定模式。通过发现设计规范、分析不一致性并执行规范化修改（如排版、颜色、组件等），确保前端界面的一致性和可用性。
需要统一前端界面风格
修复UI与设计规范不一致的问题
将硬编码样式替换为设计令牌
npx skills add The-Vibe-Company/companion --skill normalize -g -y
指导设计或优化产品引导流程、空状态及新手体验，帮助用户快速理解价值并成功上手。涵盖需求评估、核心原则（如展示而非告知、尊重用户智能）及具体场景设计（欢迎页、账户设置、首次成功引导）。
需要设计新用户引导流程
优化空状态界面
提升新手用户体验
npx skills add The-Vibe-Company/companion --skill onboard -g -y
专注于前端性能优化，涵盖加载速度、渲染效率、图片及包体积优化。通过评估Core Web Vitals等指标定位瓶颈，实施代码分割、资源压缩和懒加载策略，提升用户体验。
需要优化网页加载速度
解决前端渲染卡顿或布局抖动问题
减小JavaScript/CSS/图片包体积
npx skills add The-Vibe-Company/companion --skill optimize -g -y
用于发布前的最终质量检查，修复对齐、间距、一致性和细节问题，涵盖视觉、排版、色彩及交互状态，确保从良好到卓越的转变。
准备发布前进行最终质量审查
修复UI细节与一致性缺陷
npx skills add The-Vibe-Company/companion --skill polish -g -y
用于降低设计视觉强度，将过于激进或强烈的风格调整为更精致、柔和且易于接受的审美，同时保持设计的有效性和影响力。
用户希望减少设计的视觉冲击力
设计过于鲜艳或复杂需要简化
npx skills add The-Vibe-Company/companion --skill quieter -g -y
收集项目设计上下文并持久化保存，通过扫描代码库和询问用户明确品牌、美学及无障碍需求，生成设计指南以指导后续开发。
初始化项目设计规范
建立统一的设计上下文
npx skills add The-Vibe-Company/companion --skill teach-impeccable -g -y
将技术对话、Bug、CI失败等转化为项目持久化改进（如文档、测试、CI规则），防止重复错误。支持非技术人员，优先提出建议再编辑文件。
询问如何自动化或预防问题
需要整理复盘经验教训
希望将临时修复转为永久规范
npx skills add The-Vibe-Company/companion --skill capture-learning-tools -g -y
专注于高质量前端界面设计与审查的技能，涵盖UX、视觉层次、无障碍及响应式设计。适用于网站、仪表盘等UI的优化、重构与审计，强调生产级标准与反套路设计。
需要设计或重新设计前端界面
对现有UI进行审查、审计或优化
解决可访问性或响应式布局问题
npx skills add The-Vibe-Company/companion --skill design-frontend-dev -g -y
将需求或问题转化为基于仓库上下文的可执行实施计划，读取规则并路由至设计与TDD技能，定义验收标准，供人工审批后进入实现阶段。
用户要求规划PR
准备工单以实现功能
制定特性构建方案
npx skills add The-Vibe-Company/companion --skill plan-pr -g -y
自动化准备Pull Request的完整工作流，包括代码编辑、CI检查、PR创建及人工审查门禁，确保分支就绪供合并。
用户要求发送或准备PR
需要使CI通过
清理分支以进行PR
npx skills add The-Vibe-Company/companion --skill ship-pr-dev -g -y
用于验证编译后的 Companion 能否加载技能并执行其打包的 Shell 资源。通过运行检查脚本并报告输出来确认技能的完整性和可执行性。
需要验证技能包是否可被正确加载和执行时
进行技能集成测试或冒烟测试时
npx skills add The-Vibe-Company/companion --skill probe-skill -g -y
