Files
meida/docs/试衣间与发型设计-产品方案.md
xsl d9868fb4f7 feat(tryon): 试衣间 + 发型设计(Phase A 直连线上 API)
- TryonApi.ets:直连 meida.xiangsilian.com——换装 /change_cloth_base64(JSON+Base64,超时 320s)、发型 /hair/api/*(multipart,实测 5~10s)
- ImageCodec.ets:相册选图→解码→缩放→Base64 的公共链路
- TryonPage(模特/服装双图换装)+ HairDesignPage(60 款发型试戴/换发色),首页两张入口卡
- docs/试衣间与发型设计-产品方案.md:Phase A 直连内测 / Phase B 服务端代理 + 合规纳管的分工结论
- 待补:真机实测耗时(T-P0-13/14 基线);Phase B 迁服务端时代码改动集中在 TryonApi 一处
2026-08-30 13:18:15 +08:00

123 lines
8.4 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# 试衣间与发型设计 · 产品与技术方案
> 2026-08-29 | 状态:Phase A 已交付(客户端直连内测版)| 关联:《产品方案》§2.1/§10.1、《技术架构文档》§4.4/§7.3/§9.3、《合规与安全方案》
## 1. 背景与调研结论
新增两个 P0 功能:**试衣间(换装试穿)** 与 **发型设计(试戴 + 换发色)**。开发前完成四路调研,结论如下。
### 1.1 对接目标:自有线上服务(唯一正确选择)
| 候选 | 结论 |
|---|---|
| `meida.xiangsilian.com`(换装 + 发型) | ✅ **采用**。《产品方案》§2.1 明确指定;接口实测可用;发型 60 款在线 |
| `puton.huimeimeta.com`(老 H5 试衣间) | ❌ 素材 81% 失效(OSS 桶转私有),接口体系不同,放弃 |
| `puton-master` 代码(桌面 Web 试衣间) | 仅作交互参考:品类互斥选择、批量模式、「上衣+下装」组合逻辑可借鉴;UI 与接口层不可复用 |
### 1.2 线上服务实测契约(2026-08-29 实测)
**换装** `POST https://meida.xiangsilian.com/change_cloth_base64`(JSON,图片 Base64):
| 字段 | 说明 |
|---|---|
| `human_img` | 必填,人物照片 Base64 |
| `cloth_img` | 上衣图 Base64(仅传 human=单图编辑) |
| `kuzi_img` | 裤子图;**传了必须同时传 cloth_img** |
| `change_desc` | 提示词,空=工作流默认 |
- 同步返回 `{ret:0, data:"<OSS签名URL>"}`,须 `ret===0 && data` 判成功;**耗时几十秒~几分钟,客户端超时须 ≥320s**;建议图片长边压到 1024~2048。
- 健康检查 `GET /health`;Swagger 在线试调 `/docs`。
**发型**(同源 `/hair/api` 前缀,multipart/form-data,**全部实测通过**):
- `GET /hair/api/hairstyles` → 60 款 `{id, name, image_url}`(image_url 为同源相对路径);
- `POST /hair/api/change-hair`:`image`(File) + `hairstyle_id` → 结果**直接内嵌 Base64 Data URL**,实测 1056×1584 约 **5.3s**;
- `POST /hair/api/change-hair-color`:`image` + `rgb`(**字符串化数组** `"[255, 0, 0]"`,不是 hex)+ `ratio`(0~1,默认 0.9),实测 ~6s;
- ⚠️ 发型接口**不收 WebP**(换装接口收)。App 侧统一转 JPEG 再传。
### 1.3 素材盘点
- **发型库:60 款在线可用**(`GET /hair/api/hairstyles` 直接拉,无需内置);
- **服装库:不可用**——fitting-room-assets 里服装仅 2 张且是模特上身图;`reference/cloth_pic` 15 张平铺图格式标准但有品牌 logo,只做开发联调、不内置发布。Phase A 服装图**由用户现场上传/拍摄**;内置服装库依赖素材生产管线(抠图标准化 + `tryon_ready` 审核,见 §6);
- **模特:不用内置**——按合规要求「仅限本人照片」,用户上传/拍摄自己的全身照。
### 1.4 与架构文档的冲突与裁决
《技术架构文档》§10.1.4 要求「接口无认证,**禁止客户端直连,必须服务端代理**」;但后端 tryon 域目前**只有骨架**(无 `tr_task` 表、无路由、无 GPU worker)。裁决为两阶段:
- **Phase A(本次交付,内测版)**:客户端直连线上服务。边界:仅限内测/调试构建,不公开放量;结果图不落库、不提供分享出口;不接入配额扣减(个人页配额卡保持只读展示)。目的是先把功能与体验跑起来、验证效果与耗时基线(T-P0-13/14)。
- **Phase B(正式版前置)**:后端补齐 tryon 域(表 + 5 个 §9.3 端点 + gpu worker + 八步链路),App 切到 `/api/v1/tryon/*` 代理,届时接入配额三段式、IMS 审核、AI 水印 + 内容编号、COS 转存。Phase B 未完成的构建**不得对外发布**(合规红线:结果图必须带显式 AI 水印 + 隐式标识)。
## 2. 功能设计
### 2.1 入口
首页新增两张入口卡:「试衣间」(换装试穿)、「发型设计」(试戴 + 换发色),与「生成我的形象报告」「AI 穿搭顾问」并列。
### 2.2 试衣间流程(对齐产品方案 §2.1.1 七步)
1. 上传/拍摄**本人正面全身照**(页面明示合规提示:仅限本人照片);
2. 上传/拍摄**上衣图**(必选)、**裤子图**(可选;选了裤子才走上下装流程);
3. 可选提示词(高级,默认折叠);
4. 点「开始试穿」→ 长等待态(显示已等待秒数 + 阶段文案,超时 320s);
5. 结果页:原图/结果左右对比(点按切换)、保存到相册、再来一次。
Phase A 不做:内置服装库、批量模式、专题试衣间、购买链接(这些依赖素材管线与电商对接,见 §6)。
### 2.3 发型设计流程(对齐产品方案 §2.1.2)
1. 上传/拍摄**面部特写**(肩部以上,正对镜头);
2. 发型网格(在线拉 60 款,缩略图 + 名称);
3. 点选即试戴(5~10s,进度条);结果与原图点按切换对比;
4. 满意后可继续「换发色」:预设色板(自然黑/深棕/栗色/蜜茶/亚麻灰/酒红等 8 色)+ 强度滑杆(0~1,默认 0.9),换色作用于当前结果图;
5. 保存到相册 / 换一张重试。
### 2.4 异常与降级
- 换装:400 参数错误提示重拍/换图;502/503/504 提示「服务繁忙稍后重试」;超时(>320s)主动中止并提示;
- 发型:HTTP 400 按服务端 `message` 原样提示(「请上传图片」「请选择发型」等);失败保留当前图不覆盖;
- 两页均在生成前校验:已选照片、已选单品/发型,不满足则按钮禁用。
## 3. App 技术方案(Phase A 已实现)
```
ets/core/TryonApi.ets # 线上服务直连封装(换装 JSON+Base64 / 发型 multipart)
ets/core/ImageCodec.ets # 选图 → 压长边 ≤1600 → JPEG(85%) → Base64/ArrayBuffer
ets/pages/TryonPage.ets # 试衣间
ets/pages/HairDesignPage.ets # 发型设计
HomePage.ets # +2 入口卡;main_pages.json +2 路由
```
- **图片压缩**:解码时按 desiredSize 缩到长边 1600,重编码 JPEG quality=85,Base64 体积可控(~300KB 级);
- **超时**:换装 readTimeout=320000ms;发型 readTimeout=120000ms;
- **结果展示**:换装返回 OSS URL 直接 `Image` 加载;发型返回 Base64 Data URL 解码为 PixelMap 展示;
- **保存相册**:结果先写 cacheDir,再 `photoAccessHelper.showAssetsCreationDialog`(免权限弹系统确认);
- **不在 Phase A 做**:配额扣减、任务中心、水印、分享、历史记录(线上服务无客户端可用的历史接口)。
## 4. 验收标准(Phase A)
1. 构建绿(assembleHap);真机两页全流程可跑通;
2. 换装:全身照 + 上衣(±裤子)出图,等待有秒数反馈,失败有明确提示;
3. 发型:60 款列表加载、试戴 ≤15s 出图、换发色生效、可保存相册;
4. 两页均有「仅限本人照片」合规提示;
5. 实测数据回填:换装 P50 耗时、发型试戴 P50 耗时(喂给 T-P0-13/14 基线)。
## 5. Phase B 清单(正式版前置,未做)
1. 后端 tryon 域:`tr_task`/`tr_favorite` 表、`POST /api/v1/tryon/tasks` 等 5 端点(架构 §9.3)、gpu 队列 worker、八步链路(§7.3);
2. 线上服务八项改造(§4.4:鉴权、任务化、幂等键、并发上限、gpu_seconds 埋点、OSS→COS、前置校验、版本号);
3. App 切代理接口,接入配额三段式(tryon 3/3/8、hairstyle 3/2/6)与消耗前剩余提示;
4. 合规出口:IMS 审核 + 「AI 生成」显式水印 + EXIF 隐式标识 + 27 位内容编号 + COS 用户桶转存(《合规与安全方案》CR-05/06);
5. 素材管线:服装抠图标准化 → `tryon_ready` 审核 → 内置服装库;60 款发型人工打适配标签(1~2 人日,T-P0-24);
6. Agent 联动(P1/V2):对话卡片「试穿此搭配」「试戴此发型」带参跳转本两页(参数预留见 §7)。
## 6. 素材生产需求(给运营/算法)
- 内置服装库目标 ≥300 件 `tryon_ready`(架构风险线):拍摄 SOP(平铺白底、单品完整、无 logo 遮挡)→ matting-svc 抠图 → 运营审核;
- 模特图不需要生产(合规限定本人照片);
- `reference/cloth_pic` 仅作开发联调测试集,禁止内置(品牌 logo 版权风险)。
## 7. 预留:Agent 联动参数(Phase B 用,本次已留口子)
两页 `aboutToAppear` 读取 `router.getParams()`:`TryonPage` 支持 `{cloth_img?, kuzi_img?, change_desc?}`(base64/本地路径);`HairDesignPage` 支持 `{hairstyle_id?}`。当前 Agent 卡片按钮未做(V2),参数先留。