希望大家支持一下俺新做的两个小程序：偶然去水印 和发圈防折

好久不见，假期快乐，今天教大家使用 AI 编程，几小时内开发一款小程序。

自从 24 年大学毕业后，我就一直从事着产品经理的工作，工作所需，所以我也一直在研究需求。

在做小程序前，我想先讲解一点关于需求方面的基础知识（个人观点哈）。

做一个产品之前我们一定要先进行调研，需要找到那个愿意为产品买单，愿意为需求买单的用户。

他到底存不存在，如果存在，那在哪里可以找到他们。

看清楚我说的话，需求不是重点，买单才是重点。

现在很多教 AI 编程做产品的博主都说，找需求很重要。

但他们既没教你怎么去找需求，也没教你怎么辨别需求，只说一句找需求很重要。

事实上我认为需求还不是最重要的，而是用户愿意买单的需求才是最重要的。

比如炒菜这个需求，毫无疑问了，妥妥的真需求，但我现在出了一个炒菜机器人，你买不买？

再比如洗碗这个需求，都不用说，也是真需求，但我现在出一个自动洗碗机，你买不买？

所以我们考虑需求的时候，还需要考虑，用户是否愿意为这个需求买单。

你要知道，做一个软件，功能做错了还可以改，但一旦需求错了，那你后面就白搭了。

那你可能会问了，那我刚刚说的洗碗机，炒菜机器人也有人买单啊，为什么你又拿出来举例论证你这个观点呢？

这就是下一步需要考虑的事情了，当你做出了哪个有人愿意买单的产品后，你还要找到哪个愿意为你产品买单的那个人。

他在哪里？你要怎么找到他？你要怎么做他才会买单？这是你做出产品之前或者之后要考虑的事情，而且很重要。

好了，牛就吹到这里了，接下来我们看看今天小程序的效果吧吧。

需求调研

由于我教的是个人开发者，开发小程序，所以是以广告收益为主，不涉及支付的哈。

所以接下来我们要考虑的不再是用户愿意买单的产品，而是考虑用户愿意使用产品就够了，因为使用了，就会有广告收益。

毕竟有的产品，你愿意使用，但不代表你愿意付费。

那么怎么样判断用户愿意使用呢？

比较简单的方法就是，看用户怎么做，而不是看用户怎么说。

因为嘴上说不要，身体却很诚实，这句话在需求这上面，那是真有用。

毕竟大家都成年人，不会让你难堪，你出新产品的时候，他会说些场面话夸你说：我~草，牛，但是我不想用，更不想买。

那最简单判断一个用户身体很诚实的方法就是看用户有没有主动去寻找解决方案。

（由于是第一篇教学 AI 编程说多了点，但都是干货）

那我们直接去看一下关于用户搜索的数据就好了，我们直接看微信指数中的搜一搜，一旦搜索比例较高，那么证明用户是真需要。

由于本期我教学的是【更改图片背景】小程序，灵感源于有些时候，我们需要更改图片背景，比如证件照把蓝色底变成白色底这种。

那么我们根据需求的解决方案，去看几个相关【关键词】的数据就知道能不能做了。

这里我在微信指数上找了几个关键词【图片背景】，【头像背景】，【照片背景】，【更换背景】，【去除背景】一共五个关键词，均与图片背景有关。

整体来看，搜索的数据还是比较不错的，那么证明有需求，接下来开干就好了。

前置条件

1、下载好 CodeBuddy / trae / Google Antigravity 任选一个就行了，我用的是腾讯的 CodeBuddy，下载教程可以看这篇文章：

因为是腾讯旗下的AI编程工具对微信小程序开发做了深度优化，直接集成了微信云开发后端服务。

2、下载好微信开发者工具：

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

3、注册好微信小程序：

https://mp.weixin.qq.com/cgi-bin/wx?token=&lang=zh_CN

正式开发

第一步，新建文件夹

这里我们打开编程软件，然后新建一个文件夹，名字自己取一个就行了。

第二步，梳理需求

我们一定要记住，开发任何项目之前，都需要先把需求梳理清楚，不是直接开发。

先梳理需求再开发，本质是用前期 10% 的时间，规避后期 90% 的返工、风险、成本浪费与目标偏离，是软件工程里投入产出比最高的前置动作。

而直接跳过需求梳理就动手开发，看似省了前期时间，其实会让项目陷入 “边做边改、越改越乱、无限延期、最终偏离核心目标” 的恶性循环。

这里我直接和 AI 进行协助，让它帮我梳理需求，我选择的是 Minimax 模型。

在这几个模型当中 DeepSeek-V3.2 是纯代码能力最强的，而 MiniMax-M2.7 是工程化项目交付能力最强的，所以我选择它。

我想做一个去除图片背景，更换图片背景的小程序，请你帮我梳理下需求

第三步，需求文档

我们和 AI 进行多轮对话，沟通好需求之后，我们让它出一份需求文档。

我们看看需求文档是否符合我们的需求，如果不符合，再通过对话的方式，让 AI 进行更改，如果没有问题，我们就进入下一步开发。

用户明确了需求：
1. 主要场景是证件照换底
2. 从免费角度考虑
3. 需要先出需求文档，确认后再开发

我需要出一份详细的需求文档，涵盖：
- 项目概述
- 功能需求
- 技术方案（免费）
- 界面设计
- 数据流
- 成本分析
- 实现计划

让我写一份完整的需求文档。
好的，我先为你出一份详细的**需求文档**，你确认后再开发。

---

# 证件照换底小程序 - 需求文档

## 一、项目概述

| 项目名称 | 证件照换底助手 |
|---------|---------------|
| 项目类型 | 微信小程序 |
| 核心功能 | 一键去除证件照背景并更换为指定颜色 |
| 目标用户 | 需要办理证件、简历照片等人群 |
| 预算范围 | 免费（利用现有免费资源） |

---

## 二、功能需求

### 2.1 核心功能

| 功能 | 描述 | 优先级 |
|------|------|--------|
| 相册选图 | 从手机相册选择证件照 | P0 |
| 拍照上传 | 拍照获取证件照 | P0 |
| 智能抠图 | 自动去除背景，保留人像 | P0 |
| 换背景色 | 替换为白、蓝、红等常用色 | P0 |
| 图片保存 | 保存处理后的图片到相册 | P0 |

### 2.2 背景颜色选项

| 颜色 | 用途 | 色值 |
|------|------|------|
| 白色 | 简历、身份证 | #FFFFFF |
| 蓝色 | 证件照（最爱） | #2956B3 |
| 红色 | 护照、签证 | #E8372B |

### 2.3 用户操作流程

```
┌─────────┐    ┌─────────┐    ┌─────────┐    ┌─────────┐    ┌─────────┐
│  选择图片 │ → │  自动抠图 │ → │  选择颜色 │ → │  预览效果 │ → │  保存图片 │
└─────────┘    └─────────┘    └─────────┘    └─────────┘    └─────────┘
   相册/拍照      AI处理        点击切换       确认满意       保存到相册
```

### 2.4 边界情况处理

| 情况 | 处理方式 |
|------|----------|
| 图片中人像过小 | 提示"请选择人像清晰的证件照" |
| 非证件照类型 | 提示"请选择证件照" |
| 网络异常 | 提示"网络异常，请重试" |
| 处理失败 | 提示"处理失败，请尝试其他图片" |

---

## 三、技术方案（免费）

### 3.1 整体架构

```
┌─────────────────┐      ┌─────────────────┐
│   微信小程序端   │ ──── │   腾讯云云开发   │
│                 │      │                 │
│  • 页面交互      │      │  • 云函数       │
│  • 图片选择      │      │  • 图像处理API   │
│  • 预览/保存     │      │  • 存储          │
└─────────────────┘      └─────────────────┘
```

### 3.2 免费资源利用

| 资源 | 来源 | 免费额度 |
|------|------|----------|
| 云开发 | 微信小程序 | 每月1000次调用 |
| 图像处理 | 腾讯云AI抠图 | 每月500张 |
| 存储 | 云开发存储 | 5GB |
| 云函数 | 云开发 | 每月10000次 |

> **备注**：腾讯云AI抠图有免费额度，超出后可考虑本地颜色替换算法作为补充。

### 3.3 核心算法

#### 方案一：腾讯云AI抠图（推荐）
```
输入图片 → 腾讯云API → 透明背景PNG → 叠加背景色 → 输出图片
```
- ✅ 效果好，自动识别人像
- ✅ 开发简单，API调用
- ⚠️ 依赖网络

#### 方案二：本地颜色替换（备选）
```
输入图片 → 颜色范围检测 → 背景替换 → 输出图片
```
- ✅ 完全免费，离线可用
- ⚠️ 效果一般，适合纯色背景证件照

**建议**：优先使用方案一，方案二作为备选/降级方案。

---

## 四、界面设计

### 4.1 页面结构

```
pages/
├── index          # 首页（选择图片）
├── result         # 结果页（预览+保存）
└── ...            
```

### 4.2 首页布局

```
┌────────────────────────────┐
│      证件照换底助手          │  ← 标题栏
├────────────────────────────┤
│                            │
│    ┌──────────────────┐    │
│    │                  │    │
│    │   上传证件照       │    │  ← 上传区域
│    │   （点击选择）     │    │
│    │                  │    │
│    └──────────────────┘    │
│                            │
│  支持格式：JPG/PNG         │
├────────────────────────────┤
│  常用背景色                 │
│  [白] [蓝] [红]            │  ← 背景色选择
├────────────────────────────┤
│                            │
│  ┌────────────────────┐   │
│  │   处理进度/状态     │   │  ← 状态提示
│  └────────────────────┘   │
│                            │
└────────────────────────────┘
```

### 4.3 结果页布局

```
┌────────────────────────────┐
│      处理完成               │
├────────────────────────────┤
│                            │
│    ┌──────────────────┐    │
│    │                  │    │
│    │   预览图片        │    │  ← 预览区域
│    │                  │    │
│    └──────────────────┘    │
│                            │
├────────────────────────────┤
│  背景色：[蓝] [可切换]      │
├────────────────────────────┤
│  [ 保存到相册 ]             │  ← 保存按钮
└────────────────────────────┘
```

---

## 五、数据流程

### 5.1 图片处理流程

```
1. 用户选择图片
   ↓
2. 图片上传到云开发存储
   ↓
3. 调用云函数进行图像处理
   ↓
4. 云函数调用腾讯云AI抠图API
   ↓
5. 获取透明背景PNG
   ↓
6. 叠加用户选择的背景色
   ↓
7. 返回处理结果
   ↓
8. 用户预览并保存
```

### 5.2 数据存储

| 数据 | 存储位置 | 说明 |
|------|----------|------|
| 原始图片 | 云存储 | 临时存储，24h自动清理 |
| 处理结果 | 云存储 | 临时存储，用户保存后清理 |

---

## 六、费用评估

| 项目 | 费用 | 说明 |
|------|------|------|
| 微信小程序 | 免费 | 需注册（个人可注册） |
| 云开发基础版 | 免费 | 每月1000次调用 |
| 腾讯云AI抠图 | 免费 | 每月500张额度 |
| 云存储 | 免费 | 5GB额度 |

**总计**：🟢 完全免费

---

## 七、项目计划

| 阶段 | 内容 | 预计时间 |
|------|------|----------|
| 1. 需求确认 | 你确认本文档 | - |
| 2. 项目初始化 | 创建小程序、配置云开发 | 0.5天 |
| 3. 核心功能开发 | 图片选择、抠图、换底、保存 | 1-2天 |
| 4. 界面优化 | UI调整、交互动效 | 0.5天 |
| 5. 测试上线 | 真机测试、提交审核 | 0.5天 |

**预计总工期**：2-3天

---

## 八、风险与应对

| 风险 | 应对措施 |
|------|----------|
| AI抠图额度用完 | 提示用户，或切换到本地颜色替换算法 |
| 图片尺寸过大 | 前端压缩后再上传 |
| 审核不通过 | 使用正规命名，避免诱导分享 |

---

## 九、待确认事项

在开发前，请确认以下内容：

- [ ] **小程序名称**：使用"证件照换底助手"还是其他？
- [ ] **背景颜色**：白、蓝、红 是否满足需求？需要其他颜色吗？
- [ ] **是否需要水印**：处理后的图片是否添加水印？
- [ ] **最大图片数**：用户一次处理几张？（一般1张）

---

**文档版本**：V1.0
**创建日期**：2026-04-04

---

请审阅以上需求文档，如果有任何问题或需要调整的地方，请告诉我。确认后我即刻开始开发！

这里我们看到 AI 出的效果还是非常不错的，连线框图都给我们画好了。

第四步，开发

需求文档确定后，我们让 AI 进行开发。

第五步，调试

在开发完成后，会多出一些文件。

我们在微信开发者工具中打开这个小程序，这里我用的是测试账号（主要是正式的账号还在审批当中）。

选择信任并运行，然后我们就可以愉快的使用了。

这里我们发现出现了 bug ，我们只需要把 bug 复制发给 AI 让他来解决就行了。

当然，如果你选择的大模型支持图片输入的话，那你直接截图也是可以的。

如果你想更改某个页面的某些东西，那你就通过：页面+需求就可以了

比如你这样和 AI 说：请把pages/index/index页面的使用提示给删除掉。

第六步：预览&上传

感觉开发完成了，点击上传就好了，由于我这个是测试号，所以没办法上传，但是可以预览。

总结

本文到这里就差不多结束了，从需求调研->开发前的前置条件->正式开发->调试->上线，每一步都有。

如果你对小程序感兴趣，你也有自己的痛点需求，那看完本文也快去开发一个属于自己的小程序吧。

当然我是建议你发布到平台上，毕竟，你有痛点别人也有，软件解决一个人的问题和解决一群人的问题边际成本都是一样的。

之后我还会持续更新 Agent Skills 和 AI 编程快速开发相关的知识，如果你感兴趣可以持续跟我一起学习。

本期的内容就到这里了，感谢你的耐心。

如果看完喜欢，请帮忙转发分享一下，你的点赞转发，就是我更新下去的动力