Agent Skills
› classroomio/classroomio
classroomio/classroomio
GitHub规范 ClassroomIO 帮助中心文章的截图添加流程，涵盖前置阅读、首图与步骤图放置位置、隐私合规校验、尺寸裁剪及 WebP 优化输出路径。
Install All Skills
npx skills add classroomio/classroomio --all -g -y
Skills in Collection (24)
规范 ClassroomIO 帮助中心文章的截图添加流程，涵盖前置阅读、首图与步骤图放置位置、隐私合规校验、尺寸裁剪及 WebP 优化输出路径。
需要为帮助文档添加产品截图
需替换或优化现有文章配图
需对截图进行标注或裁剪
npx skills add classroomio/classroomio --skill add-docs-image -g -y
用于在 ClassroomIO monorepo 中新增组织落地页模板。通过原型、UI组件和仪表盘集成三阶段工作流，确保设计锁定与代码实现的质量，支持自定义主题样式。
创建新的着陆页模板
为组织落地页添加类似X的模板
构建组织落地页的新主题
提供新视觉风格的设计参考
npx skills add classroomio/classroomio --skill add-landing-template -g -y
将模糊的动效描述反向查找为精确术语，辅助用户准确命名或向AI/设计师提问。专注于名词定义与辨析，不涉及动效的设计或代码实现。
询问特定动效的名称
描述视觉效果但不知道专业术语
npx skills add classroomio/classroomio --skill animation-vocabulary -g -y
提供Apple风格Web界面设计规范，涵盖手势交互、弹簧动画、拖拽及物理动效实现。指导开发者构建流畅、响应迅速且符合直觉的用户体验，重点解决延迟、直接操作和中断性过渡等技术难点。
构建或审查手势驱动的UI组件
实现弹簧动画、拖拽/滑动/面板交互
优化移动端触摸反馈与动效性能
设计具有物理质感和深度感的界面
npx skills add classroomio/classroomio --skill apple-design -g -y
用于在GitHub仓库中创建Issue的自动化技能。通过确认问题细节、检查重复项、选择类型及严重性，利用gh CLI工具生成标准Bug或Feature报告并返回链接，提升工单流转效率。
用户要求创建bug ticket
用户要求提交issue
用户要求打开缺陷报告
npx skills add classroomio/classroomio --skill create-issue -g -y
基于品牌规范生成1920x1080 ClassroomIO缩略图。通过HTML+CSS构建设计，利用无头Chrome渲染PNG，确保字体、Logo及配色符合品牌标准，支持多样化布局以避免重复。
创建缩略图
制作封面图片
生成视频或博客横幅
npx skills add classroomio/classroomio --skill create-thumbnail -g -y
基于 Emil Kowalski 的设计工程哲学，提供 UI 打磨、组件设计、动画决策及隐形细节优化的指导。专注于通过培养品味和关注 unseen details 提升界面质感与用户体验，辅助前端开发实现更细腻、流畅的交互效果。
UI 代码审查
CSS 动画优化
组件交互设计咨询
前端体验提升
npx skills add classroomio/classroomio --skill emil-design-eng -g -y
用于在代码库或UI中扫描适合添加动画的交互点，并基于频率、目的等严格标准筛选出高价值机会。该技能仅负责分析和提出精确的运动建议方案，不进行代码修改或现有动画审查，旨在提升界面生动感同时避免过度动画。
用户询问当前界面有哪些地方可以添加动画
用户希望让界面感觉更生动活跃
npx skills add classroomio/classroomio --skill find-animation-opportunities -g -y
指导创建独特、生产级的前端界面，避免通用AI审美。在用户要求构建Web组件、页面或应用时使用，强调设计思维与美学方向，生成高质量代码。
用户要求构建前端组件
用户要求开发网页或应用界面
npx skills add classroomio/classroomio --skill frontend-design -g -y
用于检测和消除文本中AI生成痕迹的写作编辑技能。通过识别并修复夸大象征、被动语态等模式，使内容更自然人性化，同时保留原意且严禁捏造事实。
需要去除AI写作特征的文本编辑
审阅文章以提升自然度和人类风格
npx skills add classroomio/classroomio --skill humanizer -g -y
为ADHD用户定制输出格式，强调行动优先、步骤编号和状态重置，以提升执行力和专注度。
需要帮助执行具体任务时
处理多步骤工作流时
npx skills add classroomio/classroomio --skill i-have-adhd -g -y
作为高级动效顾问，对代码库进行只读分析，识别高杠杆动效问题并生成自包含的实施计划。用于提升应用手感，不直接修改代码或审查单个差异，而是为其他代理提供可执行的优化方案。
improve the animations
audit the motion
make this app feel better
想要动画修复路线图
npx skills add classroomio/classroomio --skill improve-animations -g -y
根据前端任务需求，从精选库中推荐最合适的UI组件、动画、图表或状态管理库。需检查现有依赖，避免重复安装，提供明确建议并协助集成。
询问特定前端功能（如通知、拖拽）的库选择
需要为已知任务匹配技术栈中的最佳实践库
npx skills add classroomio/classroomio --skill pick-ui-library -g -y
用于快速构建多个不同风格的UI组件原型，通过可视化选择器让用户实时预览并挑选最佳方案。强调设计发散性、高完成度及与产品风格的一致性，支持独立探索后集成选定版本。
需要生成多种UI设计方案时
进行前端界面视觉探索时
npx skills add classroomio/classroomio --skill prototype -g -y
用于设计、审查公开 API、自动化端点或 MCP 工具的安全性与授权模型，确保 API 契约质量及与 Dashboard 的功能对等性。
添加新的公开 API 路由
审查 API 契约
实现自动化端点
开发 MCP 工具
npx skills add classroomio/classroomio --skill public-api-review -g -y
专注于动画代码审查的专项技能，依据Emil Kowalski的设计工程哲学，对动效进行高标准审核。默认标记问题，确保运动自然、性能优异且符合无障碍标准，不处理功能开发或非动效代码。
用户请求审查前端动画或动效代码
需要评估UI过渡效果的质量与性能
npx skills add classroomio/classroomio --skill review-animations -g -y
端到端功能交付技能，涵盖从实现、验证构建测试、创建草稿PR到基于反馈迭代的全流程。确保代码符合规范并通过检查后提交PR，全程保持草稿状态直至用户确认。
要求实现新功能
修复并推送变更
对现有功能PR进行迭代修改
npx skills add classroomio/classroomio --skill ship-feature -g -y
指导如何按仓库规范暂存变更文件并提交，包括运行翻译、格式化、预检查及遵循Conventional Commits规范创建提交。
用户要求暂存文件
用户要求创建提交
用户要求同时暂存和提交
npx skills add classroomio/classroomio --skill stage-and-commit -g -y
按日期范围汇总工程活动，生成包含已合并PR、进行中和演示视频的Markdown报告。用于回答工作进展或周报需求。
用户询问特定时间段内完成了哪些功能
请求生成工程工作摘要或周报
npx skills add classroomio/classroomio --skill summarize-activity -g -y
用于根据上周已发布的功能，生成面向客户的简短邮件和详细的变更日志文章。包含范围设定、事实核查及特定写作风格指南。
需要撰写每周客户更新邮件
需要发布产品变更日志文章
npx skills add classroomio/classroomio --skill write-changelog -g -y
用于撰写、修订或审核 ClassroomIO 帮助中心文档，面向最终用户。确保内容准确、独立可分享且易读，严格区分于开发者 API 文档。
需要编写帮助指南
审查现有文档准确性
拆分或重组文章结构
npx skills add classroomio/classroomio --skill write-docs -g -y
用于撰写产品需求文档并构建可点击HTML原型。通过多轮问答明确功能边界，审计现有代码库，生成规范文档及作为UX真理的原型文件。
用户要求编写PRD
用户要求规范新功能
用户要求规划新产品或特性
用户要求端到端原型设计
npx skills add classroomio/classroomio --skill write-prd -g -y
规定代码编写规范，核心为默认不写注释，仅允许记录外部约束的注释；函数文档仅使用JSDoc描述契约而非实现细节，禁止解释设计选择或叙述代码逻辑。
编写新代码时
编辑现有代码时
提交代码前检查
npx skills add classroomio/classroomio --skill writing-code -g -y
ClassroomIO营销品牌系统规范，定义色彩、排版及动效组件。用于生成视频、缩略图、社交媒体素材等营销内容，确保视觉一致性，禁止复用产品端设计令牌。
创建营销类视觉资产如缩略图或视频帧
决定营销内容的配色方案
构建营销页面或社交媒体海报
npx skills add classroomio/classroomio --skill brand-system -g -y
