用途：本技能讲解一套演示背后的概念模型，说明开发者如何从低层次、无结构的 Vibe Coding 逐步演进到高层次的 Agentic Engineering（智能体工程）。
核心概念：Vibe Coding（低层次）指使用 Claude Code 时没有项目上下文、约定或可复用知识，每次提示都像掷硬币，代码库不断走向混乱；Agentic Engineering（高层次）指 Claude Code 作为一个完整配置的工程系统运行，了解项目架构（CLAUDE.md）、遵循分路径约定（Rules）、按需加载领域知识（Skills）、委派给专门智能体（Agents）、编排多步工作流（Commands）、自动化生命周期事件（Hooks）并连接外部工具（MCP Servers）。
四阶段旅程：Low（红橙色，25%）、Medium（黄色，50%）、High（浅绿，75%）、Pro（深绿，100%）。旅程条在第2张幻灯片起出现，通过 data-level 属性设置并在后续幻灯片继承，level-badge 由 JS 注入到 h1，不要硬编码。
讲解顺序：Part 0 引言；Part 1 安装与首次会话（即体验 Vibe Coding）；Part 2 更好的提示（@files、上下文窗口与 /compact、/plan）；Part 3 项目记忆（CLAUDE.md 与 /init、Rules）；Part 4 结构化工作流（任务列表、模型选择）；Part 5 领域知识（Skills 的创建、frontmatter 与调用）；Part 6 智能体工程（前后端工程师 Agent、Commands 编排、Hooks 与 MCP，核心架构为 Command → Agent → Skills）。
示例项目：TodoApp 单体仓库，后端 FastAPI（Python），前端 Next.js（TypeScript），展示从无配置到包含 .claude/、CLAUDE.md、.mcp.json 的完整配置的转变。
限制：本演示主体最高只到 High 级别，不使用 data-level="pro"；视频版最高到 Medium。Pro 仅作为旅程条上的理论顶点标记。安装、认证、收费与具体命令细节等暂未提供。