【深度解析】Open Code Skills 工作流：用知识图谱、Spec 驱动与 UI 设计系统提升 AI Coding Agent 生产力

摘要

本文基于 Open Code Skills 工作流，拆解知识图谱、设计规范、Spec 驱动开发、Agent 安全扫描与 UI 生成优化，并给出可落地的 Python 实战示例。

---

背景介绍

如果你已经在真实项目中使用过 Open Code、Claude Code 或类似 AI Coding Agent，会很快发现一个问题：模型能力很重要，但工作流决定上限。

单纯把一个大型仓库丢给 Agent，让它每轮对话都重新读取几十个文件，不仅 Token 成本高，还容易出现上下文污染、构建失败、UI 风格泛化等问题。

视频中提到的核心机制是 Skills：它将指令、脚本、参考资料、规范文档打包到一个目录中，Open Code 只暴露 Skill 的名称和描述，真正需要时再按需加载完整内容。

这种方式有几个明显优势：

• 避免每次对话都塞入大段 Prompt；
• 保持上下文窗口干净；
• 将专业能力模块化；
• Cloud Code 生态中的 Skill 基本可无改动迁移到 Open Code；
• 可以组合多个 Skill，形成稳定工程化流程。

从工程视角看，Skills 本质上是给 Agent 增加了一层"可调用的专家系统"。

---

核心原理

1. Graphify：为代码仓库构建知识图谱记忆层

Graphify 的核心价值是：把任意文件夹转换为可查询的知识图谱。

它可以处理：

• 源代码；
• Markdown 文档；
• PDF；
• 截图；
• 白板照片；
• 音频与视频；
• YouTube 内容。

首次构建时，它会做三类处理：

1. 使用 tree-sitter 解析代码 AST，提取类、函数、import、调用关系；
2. 使用 Whisper 在本地转录音视频，避免敏感数据外泄；
3. 将文档、图片、PDF 交给配置的大模型抽取概念与关系。

最终输出通常包括：

• graph.json
• 交互式 HTML Viewer
• Markdown 关系报告

这样后续提问时，Agent 不需要反复打开 50 个源文件，而是读取压缩后的图结构。对于小上下文模型或自费 API 用户，这类机制可以显著降低 Token 消耗。

2. Awesome Design.md：让 AI 生成稳定 UI

AI Agent 直接读取 Figma 导出、设计 Token JSON 的效果通常不稳定，但 Markdown 是大模型最擅长理解的格式之一。

design.md 可以描述：

• 品牌情绪；
• 色板与 HEX 值；
• 字体系统；
• 组件状态；
• 间距规则；
• 响应式断点；
• Do / Don't 规范。

这类文件的价值在于：把设计系统变成 Agent 可读、可复用、可继承的纯文本规范。

当你切换不同模型时，只要设计规范不变，生成的 UI 风格就能保持一致。

3. Get Shit Done：用 Spec 驱动修复上下文衰退

长期 AI Coding 会遇到 Context Rot：上下文越聊越乱，Agent 开始忘记最初目标，甚至重复修改已经完成的代码。

Get Shit Done 类 Skill 的思路是使用六指令 Spec 工作流，把任务拆成：

• 需求定义；
• 计划生成；
• 任务分解；
• 实现；
• 校验；
• 复盘沉淀。

这非常适合和 Open Code 的 Plan Mode / Build Mode 组合使用。Plan Mode 负责方案推理，Build Mode 负责代码落地，中间用 Spec 作为稳定契约。

4. Everything Claude Code：生产级 Agent Harness

视频中提到的 Everything Claude Code 更像是一个生产化运行框架，包含：

• Agents；
• Hooks；
• 构建失败诊断；
• 依赖版本检查；
• 配置漂移分析；
• 会话模式自动提取；
• Agent Shield 安全扫描。

其中 Agent Shield 会对 Agent 配置进行大量测试，识别 Prompt Injection 风险、泄露密钥、危险命令等问题。

这类能力对企业内 AI Coding 尤其重要，因为 Agent 一旦拥有文件系统、Shell、Git 操作权限，就必须纳入安全治理。

5. UI UX Pro Max：解决 AI 默认 UI 泛化问题

很多模型默认生成的页面都有类似问题：

• 紫色渐变 Hero；
• 相同 Tailwind 按钮；
• 模板化 Dashboard；
• 缺少行业差异。

UI UX Pro Max 的做法是引入行业推理规则，例如金融、医疗、美容、B2B SaaS、Web3、游戏等，再结合：

• 产品类型；
• 样式库；
• 调色板；
• Landing Page Pattern；
• 字体组合；
• BM25 排序；
• 反模式过滤。

例如金融 App 会避免过度炫酷动画和 AI 紫色渐变；美容 SPA 会避免暗黑模式和霓虹色。这比让模型"凭审美生成 UI"更可控。

---

技术资源与工具选型

在多模型开发场景中，我个人常用 薛定猫AI（xuedingmao.com） 做统一模型接入层。它的技术价值主要体现在：

• 聚合 500+ 主流大模型，包括 GPT-5.4、Claude 4.6、Gemini 3.1 Pro 等；
• 新模型实时首发，便于开发者第一时间验证前沿 API；
• OpenAI 兼容接口，统一 base_url + api_key + model 调用方式；
• 在多模型 A/B 测试、Agent 路由、成本控制场景中，可以减少大量适配代码。

下面实战代码使用 claude-opus-4-6。该模型在复杂推理、代码理解、长上下文分析和工程方案生成方面表现很强，适合用于仓库摘要、架构分析、代码审查等任务。

---

实战演示：用 Python 构建简化版代码知识图谱

下面示例演示一个轻量 Graphify 思路：扫描项目目录，提取 Python 函数、类、import 关系，生成 graph.json，并调用大模型输出架构报告。

安装依赖

pip install openai python-dotenv

完整代码

import ast
import json
import os
from pathlib import Path
from typing import Dict, List, Any

from openai import OpenAI
from dotenv import load_dotenv


load_dotenv()


class CodeGraphBuilder:
    """
    简化版代码知识图谱构建器：
    1. 扫描 Python 文件
    2. 提取 class/function/import 节点
    3. 构建文件到符号、文件到依赖的关系
    """

    def __init__(self, root_dir: str):
        self.root_dir = Path(root_dir).resolve()
        self.nodes: List[Dict[str, Any]] = []
        self.edges: List[Dict[str, Any]] = []

    def build(self) -> Dict[str, Any]:
        for py_file in self.root_dir.rglob("*.py"):
            if self._should_skip(py_file):
                continue
            self._parse_python_file(py_file)

        return {
            "root": str(self.root_dir),
            "nodes": self.nodes,
            "edges": self.edges,
        }

    def _should_skip(self, file_path: Path) -> bool:
        skip_parts = {".git", ".venv", "venv", "__pycache__", "node_modules"}
        return any(part in skip_parts for part in file_path.parts)

    def _parse_python_file(self, file_path: Path) -> None:
        relative_path = str(file_path.relative_to(self.root_dir))

        file_node_id = f"file:{relative_path}"
        self.nodes.append({
            "id": file_node_id,
            "type": "file",
            "name": relative_path,
        })

        try:
            source = file_path.read_text(encoding="utf-8")
            tree = ast.parse(source)
        except Exception as e:
            self.nodes.append({
                "id": f"error:{relative_path}",
                "type": "parse_error",
                "name": relative_path,
                "message": str(e),
            })
            return

        for node in ast.walk(tree):
            if isinstance(node, ast.ClassDef):
                class_id = f"class:{relative_path}:{node.name}"
                self.nodes.append({
                    "id": class_id,
                    "type": "class",
                    "name": node.name,
                    "file": relative_path,
                    "lineno": node.lineno,
                })
                self.edges.append({
                    "source": file_node_id,
                    "target": class_id,
                    "relation": "defines",
                })

            elif isinstance(node, ast.FunctionDef):
                func_id = f"function:{relative_path}:{node.name}"
                self.nodes.append({
                    "id": func_id,
                    "type": "function",
                    "name": node.name,
                    "file": relative_path,
                    "lineno": node.lineno,
                })
                self.edges.append({
                    "source": file_node_id,
                    "target": func_id,
                    "relation": "defines",
                })

            elif isinstance(node, ast.Import):
                for alias in node.names:
                    dep_id = f"module:{alias.name}"
                    self._add_dependency(file_node_id, dep_id, alias.name)

            elif isinstance(node, ast.ImportFrom):
                if node.module:
                    dep_id = f"module:{node.module}"
                    self._add_dependency(file_node_id, dep_id, node.module)

    def _add_dependency(self, source_file_id: str, dep_id: str, module_name: str) -> None:
        self.nodes.append({
            "id": dep_id,
            "type": "module",
            "name": module_name,
        })
        self.edges.append({
            "source": source_file_id,
            "target": dep_id,
            "relation": "imports",
        })


def analyze_graph_with_llm(graph: Dict[str, Any]) -> str:
    """
    调用 OpenAI 兼容 API，对代码知识图谱进行架构分析。
    这里使用薛定猫AI统一接入：https://xuedingmao.com
    """

    api_key = os.getenv("XDM_API_KEY")
    if not api_key:
        raise RuntimeError("请先设置环境变量 XDM_API_KEY")

    client = OpenAI(
        api_key=api_key,
        base_url="https://xuedingmao.com/v1"
    )

    # 控制输入规模，避免超大仓库一次性塞入过多内容
    compact_graph = {
        "root": graph["root"],
        "nodes": graph["nodes"][:300],
        "edges": graph["edges"][:500],
    }

    prompt = f"""
你是一名资深软件架构师。请基于以下代码知识图谱，输出一份 Markdown 架构分析报告。

要求：
1. 总结项目模块结构；
2. 找出核心类、核心函数和高频依赖；
3. 识别潜在复杂度风险；
4. 给出后续重构建议；
5. 输出内容要适合开发团队阅读。

代码知识图谱 JSON：
{json.dumps(compact_graph, ensure_ascii=False, indent=2)}
"""

    response = client.chat.completions.create(
        model="claude-opus-4-6",
        messages=[
            {"role": "system", "content": "你擅长代码理解、架构分析和工程化重构。"},
            {"role": "user", "content": prompt}
        ],
        temperature=0.2,
    )

    return response.choices[0].message.content


def main():
    project_dir = "./your_project"  # 修改为你的项目路径
    output_graph = "graph.json"
    output_report = "graph_report.md"

    builder = CodeGraphBuilder(project_dir)
    graph = builder.build()

    with open(output_graph, "w", encoding="utf-8") as f:
        json.dump(graph, f, ensure_ascii=False, indent=2)

    print(f"知识图谱已生成：{output_graph}")

    report = analyze_graph_with_llm(graph)

    with open(output_report, "w", encoding="utf-8") as f:
        f.write(report)

    print(f"架构分析报告已生成：{output_report}")


if __name__ == "__main__":
    main()

运行前设置 Key：

export XDM_API_KEY="你的薛定猫AI API Key"
python graph_analyzer.py

---

注意事项

1. 不要把所有文件直接塞给模型

对于大型仓库，应优先构建索引、摘要、知识图谱，再让模型按需读取。直接全量输入会造成 Token 浪费，也会降低回答稳定性。

2. 设计规范要文本化

如果希望 AI 稳定生成 UI，建议维护 design.md，明确色彩、字体、间距、组件状态和反模式。不要只依赖一句"生成一个高级感页面"。

3. Spec 是 Agent 的工程契约

复杂任务不要直接进入编码阶段，应先产出 Spec、任务拆分和验收标准。这样可以减少上下文衰退，也方便回滚和审查。

4. Agent 权限必须受控

一旦 Agent 能执行 Shell、修改文件、读取环境变量，就需要安全扫描、密钥检测和命令白名单机制，避免 Prompt Injection 与敏感信息泄露。

---

总结

Open Code Skills 的价值不只是"增强 Prompt"，而是把 AI Coding 从单次对话升级为工程化工作流：

• Graphify 解决代码与资料的长期记忆；
• Design.md 解决 UI 一致性；
• Spec 工作流解决上下文衰退；
• Agent Harness 解决生产稳定性；
• UI UX Pro Max 解决默认 UI 泛化。

真正高效的 AI 开发，不是让模型一次性知道所有内容，而是让它在正确时机调用正确 Skill。

#AI #大模型 #Python #机器学习 #技术实战