# 04 · Tab「在线」逆向设计（达人 Marketplace）

> Evidence: ✅ E1 双边平台描述 · 列表 UI 细节 🟡【待真机】

---

## STEP 1 — UI Analysis

| 区域 | 元素 | 证据 |
|---|---|---|
| 顶栏 | 搜索达人 · 筛选（领域/价格/好评） | 🟡 E6 |
| 运营位 | 推荐达人 Banner | 🟡 E6 |
| 列表卡片 | 头像 · 昵称 · 领域标签（星座/塔罗/命理/情感）· 评分 · 价格起 · 在线状态 | ✅ E1 类型 + 🟡 UI |
| 详情页 | 简介 · 服务项（文字/语音/连麦）· 评价 · 下单 CTA | ✅ E1 |
| 会话页 | 聊天/通话 UI · 倒计时/计费 | 🟡 E6 |

专家类型 ✅ E1：星座专家 · 塔罗师 · 命理师 · 心理/情感达人。

---

## STEP 2 — Feature Analysis

| 元素 | 点击 | 支付 | 评价 | 举报 |
|---|---|---|---|---|
| 达人卡 | 详情 | — | — | — |
| 文字咨询 | 下单→会话 | 是 | 结束后 | 是 🔵 |
| 语音/连麦 | 权限+下单 | 是 | 是 | 是 🔵 |
| 收藏达人 | Toggle | — | — | — 🟡 |
| 筛选排序 | 刷新列表 | — | — | — |

撮合：推荐排序 · 平台抽成 ✅ E1。

---

## STEP 3 — User Flow

```text
在线 → 浏览/搜索/筛选 → 达人详情
  → 选服务方式 → 创建订单 → 支付
  → 等待接单 → 服务中 → 结束 → 评价 → 复购
失败：支付取消/失败；达人拒单；超时退款；权限拒绝麦克风
```

---

## STEP 4 — 状态机（订单视角）

Created → Paying → Paid → Matched → InService → Completed → Reviewed  
旁路：Cancelled · Refunding · Refunded · Dispute  

前端页映射：列表 Loaded/Empty · 详情 · Checkout · Waiting · Chatting · Call · Rate。

---

## 达人供给运营（后台推导）🔵

入驻审核 · 培训激励 · 测测达人版工具 · 服务质量监控 · 分佣配置。