---
title: "3.2.2 S.C.A.F.F. 框架（推荐框架）"
---


![03-technique_3.2-structured-frameworks_3.2.2-scaff-framework.png](/images/Basic/03-technique_3.2-structured-frameworks_3.2.2-scaff-framework.png)
# 3.2.2 S.C.A.F.F. 框架（推荐框架）

## 经过本节学习，你将掌握

- S.C.A.F.F. 框架的五个要素及其含义
- 如何用这个框架描述一个技术开发任务
- 框架的精简版，适合日常快速使用
- 获得可直接复制的提示词模板


## 框架结构

S.C.A.F.F. 是五个英文单词的首字母缩写：

| 字母 | 英文 | 中文 | 核心问题 |
|-----|------|------|---------|
| **S** | Situation | 情境 | 你在做什么项目？当前状态如何？ |
| **C** | Challenge | 挑战 | 当前要解决的具体问题是什么？ |
| **A** | Audience | 受众 | 代码/产出给谁用？谁来维护？ |
| **F** | Format | 格式 | 期望 AI 输出什么格式？ |
| **F** | Foundations | 基础 | 必须遵守的约束和原则是什么？ |

这个框架的设计逻辑是：**先给背景，再说问题，然后明确对象，最后约束边界**。


## 五要素详解

### S - Situation（情境）

回答：**你在做什么？当前进展如何？**

填写内容：
- 项目类型和目标
- 使用的技术栈
- 当前的开发阶段
- 已有的代码结构或设计决策

**填写技巧**：想象你在向一个刚加入项目的同事介绍情况。

### C - Challenge（挑战）

回答：**当前具体要解决什么问题？**

填写内容：
- 要实现的功能或要修复的问题
- 输入是什么，输出是什么
- 具体的业务逻辑

**填写技巧**：一句话说清楚"做完这件事，什么状态变成什么状态"。

### A - Audience（受众）

回答：**产出给谁用？**

填写内容：
- 代码的使用者是谁（用户？其他开发者？）
- 代码的维护者是谁（你自己？团队？）
- 使用者/维护者的技术水平

**填写技巧**：这决定了代码复杂度和注释详细程度。

### F - Format（格式）

回答：**期望 AI 输出什么形式的结果？**

填写内容：
- 完整代码还是代码片段
- 需要什么文件格式
- 是否需要注释
- 是否需要使用说明

**填写技巧**：越具体越好。"给我代码"不如"给我一个完整的 React 组件文件，包含 TypeScript 类型定义"。

### F - Foundations（基础）

回答：**有什么必须遵守的约束？**

填写内容：
- 技术约束（必须/不能用某个库）
- 性能约束（响应时间、内存限制）
- 风格约束（命名规范、代码风格）
- 安全约束（敏感数据处理）

**填写技巧**：用第二章的"不做清单"思维——明确告诉 AI 什么不能做。


## 完整示例：登录页面

来看一个具体案例：你需要 AI 帮你实现一个登录页面。

### ❌ 差提示词

```
帮我做一个登录页面
```

**问题**：AI 不知道用什么技术、什么风格、要哪些功能、有什么限制。结果大概率是一个"通用模板"，和你的项目格格不入。

### ✅ 用 S.C.A.F.F. 框架改写

```markdown
【Situation - 情境】
我正在开发一个个人博客系统的管理后台。
技术栈：Next.js 16 + TypeScript + Tailwind CSS
当前进度：首页和文章列表页已完成，现在需要添加登录功能。
设计风格：极简风格，参考 Notion 的登录页面。

【Challenge - 挑战】
实现管理员登录页面：
- 表单包含：邮箱输入框、密码输入框、登录按钮
- 点击登录后，验证格式（邮箱格式、密码不为空）
- 格式错误时，在对应输入框下方显示红色提示
- 暂时不需要真正的后端验证，先做前端界面和交互

【Audience - 受众】
- 用户：只有我一个人（博客管理员）
- 代码维护者：我自己，React 初学者
- 请在关键逻辑处添加注释，帮助我理解

【Format - 格式】
请提供：
1. 完整的登录页面组件代码（单文件）
2. 包含 TypeScript 类型定义
3. 样式使用 Tailwind CSS
4. 文件命名：LoginPage.tsx

【Foundations - 基础约束】
- 不使用任何 UI 组件库（如 shadcn/ui、Ant Design）
- 不使用第三方表单库（如 React Hook Form）
- 状态管理用 React 原生的 useState
- 响应式设计：移动端和桌面端都要适配
```

### 输出差异对比

| 方面 | 差提示词的可能输出 | S.C.A.F.F. 的可能输出 |
|-----|------------------|---------------------|
| 技术栈 | 可能是纯 HTML 或 Vue | 确定是 Next.js + TS + Tailwind |
| 功能范围 | 可能包含注册、忘记密码 | 只有登录，符合当前需求 |
| 代码复杂度 | 可能用了你不熟悉的库 | 用 useState，初学者友好 |
| 注释 | 可能没有 | 关键逻辑有注释 |
| 风格 | 随机风格 | 极简风格，参考 Notion |


## 待办清单案例：添加任务功能

延续第二章小李的项目，用 S.C.A.F.F. 框架描述"添加任务"功能：

```markdown
【Situation - 情境】
我在做一个个人待办清单网页应用。
技术栈：React + TypeScript + Tailwind CSS
目标用户：像我一样容易忘事的职场新人
设计原则：极简，打开就是今日待办，添加任务 3 秒内完成
当前进度：项目刚初始化，还没有任何功能代码

【Challenge - 挑战】
实现"添加任务"功能：
- 用户在输入框输入任务内容
- 按回车键或点击添加按钮，任务添加到列表
- 添加成功后自动清空输入框并聚焦
- 空内容不能添加，输入框轻微抖动提示

【Audience - 受众】
- 用户：我自己，希望操作越简单越好
- 维护者：我自己，React 初学者
- 请解释为什么用这种实现方式

【Format - 格式】
请提供：
1. AddTask 组件代码（处理输入和添加）
2. TaskList 组件代码（展示任务列表）
3. 简单的组件使用说明

【Foundations - 基础约束】
- 任务数据暂存在组件 state，不需要持久化
- 不用任何状态管理库（Redux、Zustand 等）
- 样式用 Tailwind，保持简洁
- 每个任务只需要：内容文本 + 完成状态
```


## 精简版：S.C.F. 三要素

日常快速使用时，可以只保留三个核心要素：

| 要素 | 必填原因 |
|-----|---------|
| **S** - Situation | 没有背景，AI 只能猜 |
| **C** - Challenge | 这是你要解决的问题 |
| **F** - Foundations | 约束决定了输出边界 |

**精简版模板**：

```markdown
【背景】
[项目类型] + [技术栈] + [当前状态]

【任务】
[具体要做什么]

【约束】
- [必须遵守的限制1]
- [必须遵守的限制2]
```

**精简版示例**：

```markdown
【背景】
React + TS 的待办清单项目，已完成基础结构

【任务】
实现删除任务功能：点击任务右侧的删除图标，该任务从列表中移除

【约束】
- 删除前显示确认提示
- 用 Tailwind CSS
- 删除动画：淡出效果
```


## 可复制的完整模板

```markdown
【Situation - 情境】
项目类型：
技术栈：
当前进度：
设计风格/原则：

【Challenge - 挑战】
要实现的功能：
- 
- 
- 
输入：
输出：

【Audience - 受众】
用户是谁：
维护者是谁：
技术水平：

【Format - 格式】
期望输出：
- [ ] 完整代码文件
- [ ] 代码片段
- [ ] 包含注释
- [ ] 包含使用说明
文件命名：

【Foundations - 基础约束】
必须：
- 
- 
不能：
- 
- 
```


## 常见填写误区

| 误区 | 问题 | 正确做法 |
|-----|------|---------|
| Situation 写太长 | AI 会迷失在细节中 | 只写与当前任务相关的背景 |
| Challenge 不具体 | "优化代码"太模糊 | 说清楚优化什么方面 |
| 忘记写 Audience | AI 不知道代码给谁看 | 初学者要求注释，高手可以省略 |
| Format 只写"给我代码" | 输出格式随机 | 指定文件类型、是否要注释 |
| Foundations 只写"要做什么" | AI 可能"加戏" | 同时写清楚"不要什么" |


## 本节要点

✓ **S.C.A.F.F. 五要素**：Situation（情境）、Challenge（挑战）、Audience（受众）、Format（格式）、Foundations（基础）

✓ **填写逻辑**：先给背景 → 再说问题 → 明确对象 → 约束边界

✓ **精简版 S.C.F.**：日常快速使用，保留背景、任务、约束三要素

✓ **关键技巧**："不做清单"和"做清单"同样重要


下一节，我们学习一个更轻量的框架：R.G.C.——适合快速提问和简单任务。
