| 项目 | 内容 |
|---|
| 文档版本 | v1.3（本轮定稿） —— 2026-10-09 按产品给的截图定稿：只在「基础信息」里加一行「原名」，顶部一个字不动。v1.0–v1.2 的「顶部加一行小字 / 顶部括注 / 大标题换成原名」三个方案均已废弃 |
| 功能模块 | 用户详情页（单聊资料页 / 群成员资料页 / Web「用户信息」抽屉）的「基础信息」区增加一行 原名 |
| 适用端 | iOS / Android ＋ Web（三端同一套规则） |
| 现状 | 整页里出现的名字只有 我给他设的备注名（顶部「鹭周」）—— 他本人叫「凯撒大帝」，页面上没有任何位置 |
| 演示与逐屏 | 同目录 index.html（11 屏：现状 1 ＋ 方案 1 ＋ 边界与长度 6 ＋ 三端 3） |
| 设计稿 | 版式照产品给的截图（Web「用户信息」抽屉的「基础信息」区：备注（虚线框）/ 原名 / 生日 / 账号名）；移动端同一套排法。最终以 UI 为准 |
| 口径来源 | 2026-10-09 产品拍板：① 这个字段叫「原名」（不叫「姓名」）；② 只在「基础信息」里加一行 —— 改动小、页面也不丑；③ 顶部一个字不动；④ 要考虑原名很长 / 备注名很长 / 两个都很长的情况（→ 第六章） |
本演示与 PRD 都是「UI 设计之前的输入」：作用是讲清楚「这一行放哪儿、四种情况各显示什么、名字很长怎么办」。最终视觉以 UI 为准。
一、背景与目标
1.1 背景
U8 支持给联系人设备注名，而且备注名是"主角"：会话列表、聊天页标题、资料页顶部显示的都是备注名。
这本身没问题（我认这个名字），但它带来一个盲区：在详情页里，我看不到"这个人自己叫什么"。
真实的麻烦：
- 对方改了名字我不知道 —— 我看到的永远是备注名；
- 备注名多了会对不上人 —— 我给一堆人起了「张总」「王哥」「客户A」，隔一段时间想确认"这到底是哪一位"，没有地方看；
- 刚加的联系人、群里的成员 —— 想核对一下他本人是谁，更没地方看。
1.2 目标
- 在用户详情页能看到对方自己设置的原名（以最新的为准）。
- 主次分明、改动最小：顶部（备注名）完全不动，只在「基础信息」里加一行。
- 名字再长也不撑坏版式：这一行是标准的信息行，值单行截断，行高永远不变。
- 改动只发生在详情页；会话列表、聊天页标题、群成员列表一个字不改。
1.3 不做什么
不把原名放到顶部（大标题 / 第二行小字 / 括注都不做）、不做「备注名与原名合并」、不做「原名自动覆盖备注名」、不在会话列表 / 聊天页标题 / 群成员列表里显示原名（见待确认 ④）、不做「查历史曾用名」。
二、范围
2.1 本期做
| # | 模块 | 内容 |
|---|
| ① | 移动端 · 用户详情页 | 「基础信息」里新增一行 原名（排在「备注」下面、「账号名」上面） |
| ② | 群成员资料页 | 同一套规则（群里点某人的头像打开的那一页） |
| ③ | Web「用户信息」抽屉 | 同一套规则（「基础信息」里同一位置） |
| ④ | 显示规则 | 4 种情况各有明确表现（见 5.2） |
| ⑤ | 长度规则 | 原名很长 / 备注名很长 / 两个都很长时的处理（见 6.2） |
| ⑥ | 原名的时效性 | 打开详情页时拉一次最新资料；拉到前用缓存渲染，不出现「加载中」 |
2.2 本期不做
| 不做的事 | 说明 |
|---|
| 顶部任何改动 | 大标题仍是备注名、第二行仍是在线状态 |
| 改会话列表 / 聊天页标题 / 群成员列表的显示名 | 那些地方继续以备注名为主（待确认 ④） |
| 原名与备注名合并、或自动同步 | 两个字段各自独立（见第三章） |
| 「曾用名 / 历史名字」 | 需要服务端留历史，另开需求 |
| 实名认证信息 | 本 PRD 的「原名」指他自己设置的名字，不是实名 |
| 点一下 / 长按看全名 | 见 6.4 与待确认 ③ |
| 我的资料页 | 自己看自己不存在这个盲区 |
三、名词（两个名字，别混）
| 词 | 含义 | 谁设的 | 谁能看到 | 本次怎么显示 |
|---|
| 备注名 | 我给这个联系人起的名字（如「鹭周」） | 我 | 只有我自己 | 顶部大标题（不动）＋ 基础信息「备注」行（不动） |
| 原名 | 对方自己设置的名字（如「凯撒大帝」） | 对方 | 所有人 | ★ 基础信息里新增的一行 |
| 账号名 | U8 账号（如 @sv8I8EjwN） | 系统 | —— | 不动（它不是名字） |
术语（产品 2026-10-09 定名）：用户可见的叫法就是「原名」—— 全文不再用「姓名」。它取的是对方自己设置的那个名字，具体对应 U8 的哪个字段由开发对齐（见待确认 ①）。
四、方案（已定：基础信息里加一行）
4.1 定稿
只在「基础信息」区新增一行：
基础信息
[备注] 鹭周 ← 虚线框，可点编辑（既有入口，不动）
原名 凯撒大帝 ← ★ 本次新增的一行（标签在左、值在右）
账号名 @sv8I8EjwN ← 不动
- 位置：紧跟在「备注」下面 —— 这两个正好是一对：上面是我给他起的名字，下面是他自己的名字。
- 版式：与「账号名」「生日」等既有信息行完全一样（标签在左、值在右），不新增区块。
- 顶部：一个字不动。
4.2 为什么选这个方案（产品理由）
| 理由 | 说明 |
|---|
| 改动小 | 就是现有「基础信息」列表里多一行，不占新的版面高度、不影响照片区与按钮行 |
| 页面也不丑 | 与「备注」「账号名」同一套版式，看起来本来就该有它 |
| 含义无歧义 | 字段名直接写着「原名」—— 不需要靠位置或颜色去暗示"这是他自己叫的名字" |
| 长度问题被限制在一行里 | 见 6.2：不管名字多长，都只是这一行文字截断，不牵动其它任何排版 |
4.3 已废弃的方案（v1.0–v1.2）
| 废弃的方案 | 为什么不采用 |
|---|
| 顶部名字下面加一行小字（「鹭周」下面写「凯撒大帝 · 10:44 今天」） | 要重新安排顶部两行的宽度预算、还要防折行（折行会把按钮行顶下去），改动比现在这个大 |
| 顶部括注「鹭周（凯撒大帝）」 | 两个名字挤一行，主语不清；备注名一长就截断 |
| 大标题换成原名（备注名降为小字） | 与会话列表 / 聊天页标题 / 群成员列表相反（那些都是备注名），进详情页突然换名字会让人懵 |
五、显示规则
5.1 一行两列
| 列 | 内容 | 样式 |
|---|
| 标签 | 原名 | 灰色，固定宽度、不收缩（与「备注」「账号名」「生日」同款） |
| 值 | 对方自己设置的名字 | 深色，右对齐，单行 + 超出省略号（见 6.2） |
5.2 四种情况
| 情况 | 顶部（不动） | 基础信息区里的「原名」行 |
|---|
| 我设了备注，对方也有原名 | 大标题＝备注名（「鹭周」） | 显示（「凯撒大帝」） |
| 我没设备注，对方有原名 | 大标题＝原名（「凯撒大帝」） | 照常显示 —— 原名的显示与有没有备注完全无关 |
| 对方没设置原名 | 大标题＝备注名 | 这一行不渲染（不显示「未设置」「加载中」「未知」） |
| 原名拉取失败 | 大标题＝备注名 | 同上，不渲染（名字不是关键信息，不出现占位块） |
两条容易搞混的规则：
- 「没设备注」≠「没有原名」 —— 前者「原名」行照常显示，后者这一行才消失。
- 值撞上备注名也照常显示（见 5.3）。
5.3 不做去重
如果我把备注名起成了和他原名一样的「凯撒大帝」，两处显示同一个值 —— 照常显示，不去重、不做特殊处理。
理由：字段就是字段。一旦做了「相同就隐藏」，用户会以为这一行时有时无、像是出了问题。
5.4 时效性（「最新的」原名）
| 项 | 规则 |
|---|
| 打开详情页时 | 拉一次对方的最新资料（对方可能刚改过名字） |
| 拉到之前怎么显示 | 先用本地缓存渲染（不出现「加载中…」占位，避免页面跳一下） |
| 拉到之后 | 静默替换成最新值 |
| 拉取失败 | 保持缓存值，不报错、不提示；如果连缓存都没有，就不渲染这一行 |
| 页面已打开时对方改名 | 本期不做实时推送，下次进页面更新（待确认 ⑥） |
六、长度与排版规则
前提：原名和备注名都可能很长（中文名 ＋ 公司 / 职务、中英混排）。本方案下，长度问题只影响「一行文字」 —— 不会把页面撑高、不会影响照片区。
6.1 宽度预算
| 对象 | 可用宽度 | 换算 |
|---|
| 一行（整行） | 339pt | 375 − 左右各 18pt |
| 标签「原名」 | 约 30pt | 固定，不收缩 |
| 间距 | 约 14pt | —— |
| 值可用 | 约 295pt | 16pt 字号 → 约 18 个汉字 |
6.2 三种情况怎么处理
| 情况 | 处理 |
|---|
| 原名很长 | 这一行的值单行截断（末尾 …）。与备注行、账号名行互不影响，行高不变 |
| 备注名很长 | 顶部大标题截断 ＋ 基础信息里「备注」虚线框里的值截断 —— 这是现有表现，本次一个字不改 |
| 两个都很长 | 三处各自独立截断（顶部大标题 / 备注行的值 / 原名行的值），页面高度一行都不变 |
6.3 两条硬规则
- 每行都只占一行：值一律
单行 + 省略号，绝不折行 —— 折行会让基础信息区变高、连带把整个资料页的滚动位置与照片区比例都改掉。 - 标签不收缩、值可收缩：值让位（截断），标签「原名」永远完整显示 —— 保证这一行的含义始终可读。
6.4 值被截断时，怎么看全名？
本期不做。可选做法（供产品选，见待确认 ③）：① 点一下弹完整名字；② 长按复制；③ 不做。
七、影响面（哪里改、哪里一个字都不动）
| 位置 | 本次 |
|---|
| 用户详情页（单聊 / 联系人 / 群成员）· 基础信息区 | ★ 改：加一行「原名」 |
| Web「用户信息」抽屉 · 基础信息区 | ★ 改：同一行 |
| 顶部（大标题、在线状态） | 不改 |
| 资料页的「备注」「账号名」「生日」「成员资料」 | 不改 |
| 会话列表 | 不改 |
| 聊天页标题 | 不改 |
| 群成员列表 | 不改 |
| @提及 / 搜索结果 / 转发选人页 / 消息选择 | 不改 |
| 我的资料页 | 不改 |
八、各端
| 端 | 做法 |
|---|
| iOS | 「基础信息」区：备注（虚线框）→ 原名 → 账号名 |
| Android | 与 iOS 同一套规则，只差系统壳（状态栏 / 返回方式） |
| Web | 「用户信息」抽屉的「基础信息」：备注（虚线框）→ 原名 → 生日 → 账号名（＝产品截图里的样子） |
九、文案
| 位置 | 文案 | 说明 |
|---|
| 字段名 | 原名 | 与「备注」「账号名」「生日」同级的标签 |
| 值为空时 | 整行不显示 | 不写「未设置」「未知」「—」 |
| 值被截断时 | 只加省略号 | 不加「原名叫…」这类说明文字 |
| 拉取失败时 | 不显示、不提示 | 不给用户任何错误提示 |
十、边界与异常
| 场景 | 表现 |
|---|
| 对方刚改了名字 | 进详情页拉最新；拉到前用缓存渲染，拉到后静默替换（5.4） |
| 原名很长 / 中英混排 | 值单行截断，行高不变（6.2） |
| 备注名很长 | 顶部与备注行各自截断（现有表现，本次不改） |
| 两个都很长 | 三处各自独立截断（6.2） |
| 原名里有 emoji / 空格 | 原样显示，不做特殊处理 |
| 原名值 == 备注名 | 照常显示，不去重（5.3） |
| 对方没设置原名 / 拉取失败 | 这一行不渲染 |
| 对方已注销 / 账号异常 | 按既有规则（该页还能不能打开），本次不新增 |
| 群成员资料页 | 与单聊资料页同一规则；该页原有的「成员资料」区（入群时间 / 群内备注）不动 |
十一、待确认
| # | 待确认 | 影响 | 建议 |
|---|
| ① | 「原名」取的是 U8 里的哪个字段（他设置的昵称 / 别的字段）？服务端字段名是什么？ | 取数 | 文案已定为「原名」；请开发给出对应的数据字段 |
| ② | 「原名」行放在「备注」下面是否合适（是否要放到「账号名」下面 / 更靠后） | 版式 | 建议紧跟「备注」——两个名字挨着，语义成对 |
| ③ | 原名很长时，点一下能不能看全名 | 交互 | 本期建议不做 |
| ④ | 确认「只在详情页显示、列表与聊天页标题不变」这个范围 | 范围 | 若希望列表也显示，是另一个需求（会影响列表行高与信息密度） |
| ⑤ | 「我的资料页」（自己看自己）要不要也显示原名 | 范围 | 建议不动 |
| ⑥ | 对方改名后，已打开的页面要不要实时更新 | 技术 | 建议本期不做（下次进页面更新） |
| ⑦ | Web 抽屉里「生日」这一行是否在所有场景都显示 | 版式 | 照截图保留；由 UI / 开发确认字段可用性 |
附：演示屏清单（同目录 index.html，共 11 屏）
| # | 屏 id | 端 | 内容 | 优先级 |
|---|
| 1 | E_A1 | iOS | 现状：详情页看不到「原名」（问题在哪） | P1 |
| 2 | E_B1 | iOS | 已定方案 · 基础信息里加一行「原名」 ★ | P0 |
| 3 | E_C1 | iOS | 边界 · 他没设备注（原名行照常显示） | P0 |
| 4 | E_C2 | iOS | 边界 · 原名和备注名一模一样（不去重） | P1 |
| 5 | E_C3 | iOS | 长度 · 原名很长（值单行截断） | P1 |
| 6 | E_C4 | iOS | 边界 · 他还没设置原名（这一行不出现） | P1 |
| 7 | E_C5 | iOS | 长度 · 备注名很长（现有表现，本次不改） | P1 |
| 8 | E_C6 | iOS | 长度 · 两个都很长（最坏情况） | P1 |
| 9 | E_D1 | iOS | 群成员资料页 · 同一行 | P0 |
| 10 | E_D2 | Web | 「用户信息」抽屉 · 同一行（＝产品截图的样子） | P0 |
| 11 | E_D3 | 安卓 | 资料页 · 同一行（安卓版式） | P1 |