xiao0916
- 25 skills
- 0 followers
- 6 hours ago last updated
- ▌ Dwf Coding · xiao0916 bundle当用户需要单独执行 DWF 工作流的编码阶段时必须使用本技能。它从已确认的技术方案、实现清单和可选 `.dwf/state.json` 中恢复上下文，在目标代码目录（工作流模式下为工作区根目录）按任务逐项编码、验证，并更新目标 spec 目录下 `05-实现清单/实现清单.md`。适用于“开始编码”“执行实现清单”“继续编码阶段”“根据实现清单写代码”“恢复编码”“实施本次迭代变更”等场景。可独立运行，也可作为 dwf-orchestrator 编排的工作流的一部分（state.json 中存在 `status: active` 且 `current_step: code` 的 spec 时进入工作流模式）。
- ▌ Dwf Design · xiao0916 bundle当用户需要单独执行 DWF 工作流的设计稿阶段时必须使用本技能。它从已有需求文档、用户提供的 Figma/设计链接、图片素材或简短设计要求中生成或记录目标 spec 目录下 `02-设计稿/设计稿.md`，必要时保存设计图片到 `02-设计稿/images/`，并请求用户确认。适用于“生成设计稿”“补充设计稿”“根据需求文档写设计说明”“记录 Figma 设计稿”“抽离设计稿步骤”等场景。可独立运行，也可作为 dwf-orchestrator 编排的工作流的一部分（state.json 中存在 `status: active` 且 `current_step: design` 的 spec 时进入工作流模式）。
- ▌ Dev Workflow · xiao0916 bundle结构化开发工作流，强制按步骤执行：需求文档 → 设计稿 → 需求拆解 → 技术方案（提供多个方案供用户选择）→ 实现清单 → 编码 → 需求迭代。当用户想要启动新项目、构建功能、实现需求，或需要系统化的开发流程时使用此技能。即使用户没有明确说'工作流'，只要用户表达了从零开始开发一个功能或系统的意图并希望按步骤系统化推进，就应使用此技能。触发短语包括'开始项目'、'实现这个功能'、'帮我构建'、'我需要一个工作流'、'开发这个'、'需求拆解'、'给几个技术方案选'。用户提供需求文档（飞书、markdown、纯文本）并希望转为系统化开发时也应触发。
- ▌ Animation Flow · xiao0916 bundle为网页生成可预览的动画组件，目标框架由 AI 探测项目决定。当用户需要把预置的网页动画效果落地到 React/Vue/Svelte/原生项目时使用此技能——即使没明说"动画"也要触发。覆盖五类效果：① 数字滚动/计数（数字从0跳到目标值、统计数字递增、数据成就展示）；② Hover光效（卡片扫光、鼠标跟随光晕、产品卡片悬停光线扫过）；③ 手风琴（横向折叠面板、悬停展开变大、类别展示）；④ 定屏滚动/粘性滚动（左固右滚、sticky 标题随滚动叙事、苹果官网式滚动布局）；⑤ 打字机/逐字动画（文字一个个蹦出、光标闪烁、终端式输出、标语轮播）。技能提供可预览 HTML 模板，按 component-spec.md 转换为符合规范的组件代码。不适用于：动画/动效调试（Framer Motion 卡顿、CSS 动画 bug）、路由切换过渡动画、loading spinner、数据图表、轮播图、SVG 描边、Three.js/3D 粒子，或纯后端/无前端任务。
- ▌ Dwf Development · xiao0916 bundle当用户需要单独执行 DWF 工作流的需求分析、技术方案或实现清单阶段之一时必须使用本技能。它按当前 `current_step` 或用户确认的目标阶段，只生成目标 spec 目录下对应的一个阶段文档，并请求用户确认后停止。适用于“需求拆解”“技术方案”“实现清单”“生成技术方案”“创建实现清单”“抽离某个开发阶段”等场景。可独立运行，也可作为 dwf-orchestrator 编排的工作流的一部分（state.json 中存在 `status: active` 且 `current_step` 为 `breakdown`/`plans`/`todos` 的 spec 时进入工作流模式）。
- ▌ Dwf Requirement · xiao0916 bundle当用户需要把想法、需求说明、产品需求、项目背景、Markdown、纯文本或本地文档整理成 DWF 工作流风格的需求文档时，必须使用本技能。它负责收集和澄清需求，按 references/requirements_template.md 生成目标 spec 目录下 `01-需求/需求文档.md`，并请求用户确认。适用于“生成需求文档”“整理 PRD”“先写需求文档”“把需求规范化”“抽离需求阶段”等场景。可独立运行，也可作为 dwf-orchestrator 编排的工作流的一部分（state.json 中存在 `status: active` 且 `current_step: requirements` 的 spec 时进入工作流模式）。
- ▌ Dwf Orchestrator · xiao0916 bundleUse when 用户要启动、继续、恢复或重启 DWF 开发工作流，或需要编排 .dwf/state.json、specs 队列、阶段推进、迭代新增/拆分/插队、待确认事项、state.json 重建。只要存在 .dwf/state.json 或用户要求按 DWF/开发工作流步骤推进，必须使用本技能。若用户只是单独要求生成需求文档、设计稿、需求分析、技术方案、实现清单或编码，且没有工作流状态/队列编排诉求，优先使用对应 dwf-xxx 子技能。触发短语包括开始项目、继续 dev-workflow、恢复工作流、重新开始、插队、拆分迭代、推进下一阶段。
- ▌
- ▌
- ▌ Toolchain Issue Recovery · xiao0916 bundle当开发、测试、文档生成、技能创建或修改、文件编辑、浏览器操作、截图、构建、校验、脚本运行、PowerShell/Python/Node 命令执行等过程中遇到工具链问题时必须使用本技能。适用于沙箱 helper 异常、权限或路径问题、apply_patch 失败、初始化脚本部分失败、依赖缺失、校验工具无法运行、Windows PowerShell 中文乱码、编码误判、命令参数不兼容、网络或安装失败、替代验证、以及用户要求“记录刚才的问题”“把解决方式沉淀下来”的场景。若本技能没有覆盖当前问题，解决后必须把可复用经验写回本技能或其 eval/使用说明。
- ▌ Psd Slicer · xiao0916 bundle将 Photoshop（.psd）文件的所有图层导出为独立的 PNG 图片。适用于从 PSD 文件提取图层图片、为网页开发生成切片、或为其他工具准备图层资源。自动处理图层命名、跳过不可见图层、递归导出嵌套图层组。
- ▌ Psd To Cocos · xiao0916 bundle将 Photoshop (PSD) 设计稿转换为 Cocos Creator 布局参考。 自动导出 PNG 切片并生成坐标 JSON，支持中文图层名。 触发条件：当用户提到以下关键词时激活本技能： - "PSD 转 Cocos"、"导出 PSD 到 Cocos"、"PSD 切图 Cocos" - "设计稿导入 Cocos"、"PSD 生成 Cocos 布局" - "Photoshop 转 Cocos"、"PSD 导出坐标"
- ▌ Venv Manager · xiao0916 bundle自动管理 Python 虚拟环境。当其他技能需要隔离的 Python 环境时，本技能帮助 AI 创建、激活和管理虚拟环境，确保依赖不冲突。
- ▌ Code Splitter · xiao0916 bundle智能分析 React 组件代码，识别可拆分的子组件并生成独立组件文件。使用场景：(1) psd-json-preview 生成的大组件需要优化结构，(2) 将单个复杂组件拆分为多个可复用小组件，(3) 自动生成带 Props 接口的标准化组件。
- ▌ Project Reader · xiao0916 bundle项目结构分析技能。用于快速理解陌生前端/全栈项目的技术栈、目录结构和模块依赖关系。通过分层阅读工作流，从框架检测到依赖分析，逐步深入理解项目架构。适用于需要接手新项目、分析代码库、或进行技术调研的场景。
- ▌
- ▌
- ▌ Ocr Recognition · xiao0916 bundleOCR (Optical Character Recognition) for extracting text from images. Use when user needs to: (1) Extract text from screenshots, (2) Recognize captcha codes, (3) Read text from photos, (4) Convert scanned PDFs to text, (5) Identify numbers/letters from images. Supports Tesseract OCR with Docker, Python OpenCV preprocessing, and decision flow for captcha recognition.
- ▌ Session Summary · xiao0916总结 OpenCode 会话内容，提取可复用的经验和方法论。当用户要求"总结本次会话"、"提取经验"、"复盘"、"提取可复用的方法"或类似需求时触发此技能。
- ▌ Psd JSON Preview · xiao0916 bundle从 PSD 导出的 JSON 图层树和切片图片生成 HTML/CSS 预览。默认保留 PSD 的分组嵌套结构，用 --flatten 参数可切换为平铺模式。
- ▌ Psd Layer Reader · xiao0916 bundle读取并导出 Photoshop（.psd）图层树为 JSON，包含图层元信息（名称、类型、可见性、bbox）以及详细的文本样式信息。当用户需要分析 PSD 结构、查找特定图层（如弹窗、按钮）、或准备 HTML/CSS 还原所需的数据时，务必使用此技能。即使涉及复杂的嵌套结构或需要精确的文本还原（字体、颜色、间距），此工具也能提供结构化的支撑。
- ▌ Component Analyzer · xiao0916 bundleReact/Vue 组件代码分析器 - 分析已生成组件，输出依赖图、重复代码报告和拆分建议。Use when analyzing React or Vue component code to identify optimization opportunities, detect duplicate patterns, build dependency graphs, and generate refactoring suggestions. Supports both JSON (machine-readable) and Markdown (human-readable) output formats.
- ▌ Docker First Runner · xiao0916 bundle引导 AI 使用 Docker 优先策略运行脚本。当用户需要执行 Python、Node.js 或其他脚本时，本技能帮助 AI 基于环境检测和版本兼容性决定使用 Docker 容器化（首选）还是本地执行。
- ▌ Psd Component Splitter · xiao0916 bundle将 PSD 设计稿按第一级分组拆分为独立的 React 或 Vue 组件。适用于从 PSD 设计稿生成组件化前端代码，支持自动生成 JSX/CSS Modules 或 Vue SFC 文件。
- ▌ HTML Semantic Optimizer · xiao0916 bundleHTML语义化优化工具，将通用HTML标签（div、span）自动转换为语义化HTML5标签（header、nav、main、article、button等）。基于CSS类名智能识别元素语义角色，支持自定义规则配置。