Agent Skills
› The-Vibe-Company/companion
The-Vibe-Company/companion
GitHub优化项目UI细节，涵盖圆角、对齐、深度等视觉规范。需按规范上报激活遥测数据，支持多环境代理及用户身份识别。
Install All Skills
npx skills add The-Vibe-Company/companion --all -g -y
Skills in Collection (28)
优化项目UI细节，涵盖圆角、对齐、深度等视觉规范。需按规范上报激活遥测数据，支持多环境代理及用户身份识别。
需要美化界面元素时
遵循设计系统规范时
npx skills add The-Vibe-Company/companion --skill better-ui -g -y
该 Skill 编码了 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 进行代码审查
使用 Open Code Review 工具进行代码质量检查
npx skills add The-Vibe-Company/companion --skill review-code-dev -g -y
指导用户遵循测试驱动开发(TDD)流程，包括红绿重构循环、编写高质量集成测试及规范测试结构，适用于需求构建或Bug修复场景。
用户希望以测试优先方式构建功能或修复Bug
提及'红绿重构'概念
需要编写集成测试
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/UX细节如动画和色彩
修复前端无障碍或响应式问题
npx skills add The-Vibe-Company/companion --skill design-frontend-dev -g -y
将提示或问题转化为基于仓库的PR实施计划，读取上下文并路由至设计/TDD技能，定义验收标准，供人工审批后执行。
用户要求规划PR
准备实施工单
构思功能构建方案
npx skills add The-Vibe-Company/companion --skill plan-pr -g -y
自动准备PR以交付人类审查的工作流。涵盖代码修改、CI修复、提交推送及PR创建更新，确保CI绿色后停止，不执行合并操作。
用户要求发送工作成果
准备分支供审查
创建或更新PR
使CI通过
清理分支
npx skills add The-Vibe-Company/companion --skill ship-pr-dev -g -y
用于验证编译后的 Companion 能否正确加载技能并执行打包的 Shell 资源，通过运行 check.sh 脚本并报告输出来完成检测。
需要验证技能加载和执行能力
检查打包资源是否可执行
npx skills add The-Vibe-Company/companion --skill probe-skill -g -y
