PRD：「云书文档」App 产品设计文档

这次我将从之前的用户研究的结论出发，尝试推导出整个产品的设计过程。（「云书文档」用户研究部分见：《以在线协作文档为例的情境交互体验浅析与设计实例》）

「云书文档」产品设计文档 v1.0

历史版本记录：

概述

（1）文档说明

此篇文档的撰写目的是展示「云书文档」app 的产品设计内容，包含产品介绍、需求分析、产品结构搭建、全局定义、部分业务流程和部分页面交互说明六个部分。

（2）文档中出现的一些词汇说明与字段标注定义

• 一级页面：通知页、云端页、桌面页、星标页
• app 页面使用 【】进行标记
• 可点击字段（按钮）用 “” 进行标记

（3）项目背景

我们在平时的工作协作中会产生很多文件，比如一些文档、表格、演示文稿，传统的解决方案是基于本地化（Office 办公套件）的方式去实现：用户在本地创建文件，然后通过其他软件或者邮件的方式分享给其他用户；

然而在使用过程中会发现文件内容不能同步和实时修改，导致这种方法在多用户协作时不够高效与便捷。

所以，我尝试使用 “在线文件存储和文档协作” 的形式来解决问题，并使用情景交互方法进行设计研究，实现高效与便捷的存储和创作诉求。

（4）项目范围

本次设计项目涉及到的业务主线有：

1. 登录 / 注册「云书文档」app。
2. 创建一个在线协作文档，将文档权限设置为组内协作，通过链接分享邀请其他用户加入协作组，以及为每个用户配置相应的文档权限。
3. 多用户在文档中进行实时编辑，并为段落添加评论内容。

本次设计项目涉及到的业务支线有：

1. 使用 “团队桌面” 管理团队中的文档。
2. 将一篇文档中的标题格式（标题一、标题二、标题三……）与正文格式保存为模版，并应用到其他文档中。
3. 新建一个格式模版，设置文档标题格式和正文格式，并将其应用到文档中。
4. 在多用户编辑文档时，切换 “专注模式” 屏蔽其他用户的编辑状态。
5. 完成任务（隐藏任务）获得徽章，并将徽章分享到其他社交平台上。
6. 切换 app DarkMode 显示模式。

01 产品介绍

1.1 产品类型

「云书文档」是一款文档类在线协作平台 app。

1.2 产品定位

「云书文档」是一款创作与分享在线文档的平台，支持文件的云存储、文件的多设备同步以及文件的多用户在线协作。

1.3 产品介绍

「云书文档」是一款创作与分享在线文档的平台 app。可以帮助用户通过创建文档、表格、演示文稿、思维导图和白板等来组织想法与表达内容，并通过云端存储和多设备同步功能来随时随地查看这些文件。

其他的一些像是便签语音速记、多用户实时在线协作、OCR 文字识别、文档格式保存，成就徽章系统等拓展功能也能很好的帮助用户解决工作与生活中遇到的问题。

1.4 体验情景整理

1. “我在公司里负责的用户访谈结束后，将整理的报告通过在线协作文档很方便的分享给了产品团队，并在里面 @ 提及了相关人员，标注了需要重点关注的地方。后续在 PRD 的评审工作中，产品、设计、开发人员也可以通过实时评论功能参与讨论，同步项目进度以及收集来自各方的问题反馈。”
2. “我和男友是异地恋，有时候我会记录自己每天需要完成的任务，然后想让男友监督我，然后发现用协作文档可以两个人一起编辑，并且我们同时在线编辑时会显示我们两个人的头像，正在编辑的内容也会显示用户名和不同颜色的光标，我觉得这样超级有仪式感！有时候还能和男友在文档里聊天吵架哈哈~现在我们会经常一起使用协作文档去制定一些旅行计划啊，两个人一起要去做的事之类的，非常实用！”
3. “我是一名二次元同人文写手，我会使用协作文档来写一些动漫游戏同人小说，有时会和动漫群里的其他小伙伴一起构思情节，比赛看谁写的段落更好哈哈哈，协作文档的操作对我们很友好，评论功能也可以让我们快速的知道其他群友对某一段情节的看法。”

02 需求分析

2.1 目标用户

1. 使用在线协作文档主要是因为多设备同步功能，方便随时随地查看的用户；在他们之中输出物大多是一些个人文档。
2. 有多用户协作，实时编辑评论查看需求的用户；在他们之中输出物大多是工作文档，也有旅行计划或小说。

2.2 需求分级列表

在这次的设计研究中，我使用 KANO 模型的基本型需求、期望型需求、兴奋型需求、无差异型需求和反向性需求这五个维度来对之前用户研究中得到的需求方案进行总结整理与分级。

03 产品结构

3.1 用户工作情景设计

3.1.1 登录 / 注册 & 一级页面切换

【登录页】->【云端页】->【桌面页】->【星标页】->【通知页】

3.1.2 创建在线协作文档并分享

【新建文件选择】->【文档编辑页】->【文档分享设置】->【协作组配置】

3.2 产品结构图

3.3 产品功能结构图

3.4 产品信息结构图

04 全局定义

4.1 部分逻辑定义

4.1.1 关于云书文档登录方式的定义：

1. 移动端登陆方式为：手机号短信验证码登录、SSO 登录
2. pc & pad 端登录方式为：app 扫码登录、手机验证码登录、SSO 登录

4.1.2 关于文件 / 文件夹在文件列表 / 文件夹列表里排列默认显示顺序的逻辑：

1. 是否标记为置顶为第一优先级、更新时间为第二优先级
2. 优先排列置顶、最新更新的文件

4.1.3 关于通知的逻辑：

1. 系统通知
2. 当有用户在 “由你创建” 或 “与你协作” 的文档中进行编辑时，你会收到通知。
3. 当有用户在 “由你创建” 或 “与你协作” 的文档中 @ 提到你时，你会收到通知。
4. 当有用户在 “由你创建” 或 “与你协作” 的文档中进行评论时，你会收到通知。

4.1.4 关于文件导出类型的定义：

1. 文档可以导出为 pdf、word（.doc / .dcox） 和图片（.png / .jpg）
2. 表格可以导出为 excel（.xls / .xlsx）
3. 演示文档可以导出为 ppt（.ppt / .pptx）和多张图片（.png / .jpg）
4. 思维导图可以导出为图片（.png / .jpg）
5. 白板可以导出为图片（.png / .jpg）

4.1.5 关于文件的删除逻辑：

1. 文件的源文件只有文件创建者可以删除。
2. 非文件创建者不能删除文件的源文件，只能使其在自己的列表里呈不可见状态。
3. 在云端页，用户在最近列表下对文件进行删除操作时，弹出提示 “是否从最近列表中移除？确认移除后，该内容将在最近列表中不可见”；仅当用户是进行删除操作的文件的创建者时，提供 “是否删除源文件” 选项。
4. 在桌面页，用户在我的桌面下对文件进行删除操作时，弹出提示 “你是该文件的创建者，确认删除后该项目将进入回收站，30 天后将自动删除”。
5. 在桌面页，用户在团队桌面下对文件进行删除操作时，弹出提示 “是否从团队桌面中移除？确认移除后，该内容将在最近列表中不可见”。
6. 在星标页，没有对文件的删除操作，只有对文件的 “取消收藏” 操作。
7. 在废纸篓页，用户对文件进行删除操作时，弹出提示 “确定要删除此文件吗？”，用户确认后删除此文件。存放在回收站超过 30 天的文件会被系统自动进行删除操作。
8. 用户可以通过 “通知” 或者文档链接重新进入设置为不可见的文档，再次进入后文档在最近列表中重新变为可见状态。

4.2 交互定义

手势操作包括：

1. 在文档阅读页双击屏幕进入文档编辑状态
2. 在文档阅读页两指捏合放大缩小显示视图
3. 文件列表中上下滑动进行浏览
4. 文件列表中的文件单元向左滑动显示 “删除” 等操作选项
5. 云端页的便签列表中左右滑动进行浏览
6. 文档中的评论模块左右滑动切换上一条评论和下一条评论

其他交互方式包括：语音交互 – 语音速记

4.3 时间显示格式定义

05 业务流程

5.1 登录流程

5.2 创建在线协作文档与分享流程

5.3 加入文档协作流程

06 主要功能说明

6.1 登录 / 注册

用户任务：

1. 使用手机号登录「云书文档」app
2. 使用微信账号登录「云书文档」app
3. 使用 SSO 登录「云书文档」app

逻辑说明：

1. 点击 “服务条款” 按钮，可查看关于 app 的相关服务条款。
2. 点击 “隐私政策“ 按钮，可查看关于 app 的相关隐私政策。
3. 点击手机号码输入框和验证码输入框都将弹出数字键盘。
4. 手机号码输入框基础规则：
   • 展示格式：1XX XXXX XXXX
   • 手机号判断合法的规则: 13 / 14 / 15 / 16 / 17 / 18 / 19 开头的号码，且无除数字以外的字符
   • 手机号字符限制：当输入满 11 位数字之后，禁止再次输入字符
5. 判断手机号合法后，“下一步” 按钮变为蓝色可用状态，点击进入【验证码输入页】，同时发送验证码到所填写的手机号码上。
6. 如果判断手机号不合法，手机号码输入框外框变红，提示请输入正确的手机号码，“下一步” 按钮为灰色不可用状态。
7. 当用户输入最后一位验证码数字时，判断验证码是否正确。如果正确的话跳转【云端页】；如果错误的话验证码输入框抖动，外框变红且清除输入框内所有数字，提示验证码输入错误。
8. 用户可多次点击 “重新获取验证码” 按钮，两次验证码的发送时间间隔为 60s，在此时间间隔内 “重新获取验证码” 按钮为灰色不可用状态，同时动态显示剩余时间间隔。当时间间隔大于等于 60s 时，“重新获取验证码” 按钮变为蓝色可用状态。
9. 用户登录的账号为未注册账号时将自动注册。

6.2 一级页面

6.2.1 云端页

页面入口：app 底部标签栏

用户任务：

• 进入【个人中心】
• 使用二维码扫描登录 PC 端 / 网页端
• 使用图片 OCR 创建文档
• 搜索文档
• 快捷创建便签
• 快捷浏览置顶便签
• 浏览最近使用的文件列表
• 修改文件列表中文件排序方式
• 筛选文件列表中的文件
• 切换文件列表视图：列表视图 / 预览视图

逻辑说明：

1）用户在登录状态下打开 app 默认进入到的页面是【云端页】，用户在【云端页】下创建文件夹，创建成功成功后进入所创建的文件夹中，返回时返回到【桌面页】。

2）用户点击头像进入【个人中心】。

3）用户点击 “扫描 ICON” 弹出弹窗，用户可选择扫描二维码 or 使用 OCR 文字识别，选择后进入相应页面并调用系统摄像头。（申请摄像头权限、相册权限（本地上传图片使用 OCR））

4）用户点击 “语音速记 ICON” 使用语音速记功能（申请系统麦克风权限），录音结束后可选择新建文档，进入文档编辑状态并将此录音文件插入文档中。

5）用户点击搜索框可以搜索文档，搜索基础规则如下：

1. 搜索范围：app 全局搜索（包括废纸篓中的文件，但在结果中显示文件来自于废纸篓）
2. 搜索条件：文件类型（文档 / 表格 / 演示文档 / 思维导图 / 白板）、文件夹、文件中的文字段落。
3. 搜索结果过滤条件：时间范围（任意时间 / 最近一周 / 最近一月 / 最近一年）、文件类型（任意类型 、 文档 / 表格 / 演示文档 / 思维导图 / 白板）、文件夹、团队空间），默认过滤条件：任意时间、任意类型。
4. 搜索框内字符数限制：50 个字符。

6）在快捷便签模块，用户可以通过手写、语音输入和键盘输入三种方式新建便签。左右滑动可显示前一张后一张便签，点击 “查看全部” 进入便签列表，浏览所有便签，点击便签可查看便签具体内容。快捷便签模块基础规则如下：

1. 排列顺序因子：是否置顶（置顶标签优先排列）、创建时间（按创建时间相对于当前时间从近到远排列）其中置顶因子优先级最高
2. 便签预览内容卡片展示内容：便签内第一张图片的缩略图（如果有）、便签文字内容（限制 15 个字符，超过 15 个字符之后显示 “…”）、便签创建时间。

7）最近使用文件列表中排列用户最近打开过的文件，用户点击 “排列 ICON” 切换文件的排列方式：

1. 按最后更新时间排列（默认，时间较近在前，较远在后）
2. 按文件名音序排列（a – z）
3. 按文件类型排列（文件夹 – 文档 – 表格 – 演示文稿 – 思维导图 – 白板）

8）在最近使用的文件列表中，用户点击 “筛选 ICON” 对文件列表中的文件进行筛选：

1. 按文件类型筛选
2. 按来源筛选：由我创建的文档 / 与我协作的文档

9）在最近使用的文件列表中，用户点击 “视图切换 ICON” 切换文件列表的视图：

1. 文档列表视图（默认）
2. 文档预览视图

10）在最近使用的文件列表中，向左滑动文件单元，显示对于此文件的操作：分享文件、删除文件、置顶文件 / 取消置顶、星标文件 / 取消星标、导出文件、移动文件、创建文件副本。

11）文件列表中每个文件单元中包含文件类型 ICON、文件名、最后更新时间和最后更新用户的用户名等信息，每个文件单元中文件名最多显示 20 个字符，超出后显示 “…”。

6.2.2 通知页

页面入口：app 底部标签栏

设计说明：

作为文档协作者，用户会注意关于文档的消息提示中有没有与自己相关的内容并且，整个文档的协作过程是由文档被修改的通知，以及文档或评论中提到用户的通知来推动的，所以在这里我将 【通知页】放在优先级较高的底部标签栏中，使用户方便快捷地查看通知信息，并由此推动整个协作过程的进行。

用户任务：

1. 查看通知
2. 通过协作通知了解文档协作情况

逻辑说明：

1. 通知页分为“未读”和“全部”两个模块，点击可切换 Tab
   • “未读” Tab 下，按时间顺序（时间较近在前，较远在后）排列未读消息，同日期消息在一个模块中显示，用户点击通知可进入相应的文档。
   • “全部” Tab 下，按时间顺序（时间较近在前，较远在后）排列全部消息，同日期消息在一个模块中显示，用户点击通知可进入相应的文档。
2. 通知单元在通知列表中按时间顺序纵向排列显示，排列规则与文件在列表中按时间排序的规则保持一致，每个通知单元中包含通知类型 ICON、通知标题和通知的时间，其中通知标题最多显示 20 个字符，超出后显示 “…”。

6.2.3 桌面页

页面入口：app 底部标签栏

用户任务：

1. 浏览我的桌面上的文件
2. 切换桌面到其他的团队桌面
3. 浏览团队桌面上的文件

逻辑说明：

1. 桌面页分 “我的桌面” 和 “团队桌面” 两个模块，点击切换 Icon，弹出浮窗可切换 Tab
   1. 在 “我的桌面” Tab 下，列表中排列用户创建的文件夹、用户创建的文件
   2. 在 “团队空间” Tab 下，列表中排列用户创建的文件夹、该团队内其他用户创建的文件夹、用户创建的文件和该团队空间内其他用户创建的文件
2. 在团队桌面下创建的文件分享权限默认设置为组内协作，协作组内的用户与团队桌面中添加的用户保持一致。
3. 团队桌面名称在 Tab 上显示时限定显示 20 个字符，超出后显示 “…”

6.2.4 星标页

页面入口：app 底部标签栏

设计说明：

在文件列表中，用户左滑文件，选择更多菜单里的星标选项，即可为该文件标记星标。

在文件列表中，用户左滑已标记为星标的文件，选择更多菜单里的取消星标选项，即可为该文件取消星标。用户也可以在【文档编辑页】右上角更多菜单里为文档标记星标，或取消星标。

用户任务：

浏览标记为星标的文件

6.3 个人中心

页面入口：点击一级页面上的用户头像进入

逻辑说明：

用户点击一级页面常驻导航栏左侧的用户头像进入【个人中心】，【个人中心】分为 “我的成就”、“我的格式”、“我的账号”、“显示”、“废纸篓”、“设置”、“反馈”、“关于”和 “退出登录” 九个模块：

1. 在 “我的成就” 中，用户可查看完成的成就徽章，并分享
2. 在 “我的格式” 中，用户可新建格式样式，或编辑现有的格式样式
3. 在 “我的账号” 中，用户可查看、修改账号信息：头像、用户名、邮箱、手机、微信、更改密码以及注销账号
4. 在 “显示” 中，用户可选择 app 显示样式：日间模式、夜间模式以及跟随系统设置
5. 在 “废纸篓” 中，用户可恢复三十天之内删除的文件，在 “废纸篓” 中存在三十天以上的文件会被自动永久删除
6. 在 “设置” 中，用户可设置通知推送规则、设置加密文件打开方式：密码、Face ID
7. 在 “反馈” 中，用户可将对于 app 的建议反馈给客服，并在遇到困难时向客服发送信息求助
8. 在 “关于” 中，用户可查看 app 的版本号信息，服务条款以及隐私政策
9. 用户点击 “退出登录” 按钮，则退出当前帐号，并跳转至【登录页】

6.3.1 我的成就

页面入口：点击【个人中心】中的 “我的成就” 选项

设计说明：

用户在使用在线协作文档时，对自己会有一个高效工作者的认知，而我们可以通过设计帮助用户庆祝他们成就，分享他们的成就的这些方式，来帮助用户强化这一认知，从而提升用户对我们产品的信任。因此，我在【个人中心】中设置“我的成就”模块，当用户完成一些任务，或隐藏任务时，会获得一枚徽章，用户可以选择将这些徽章分享至社交媒体中，帮助用户表达自己工作高效、认真、可靠的形象。

后续配合运营活动可以设计一些特殊的徽章。（比如与品牌方合作的广告文案设计大赛就可以设计一些加入品牌方因素的徽章，用户可通过参与比赛获得）

用户任务：

1. 查看已获得的成就徽章
2. 将已获得的成就徽章分享到社交空间中

逻辑说明：

1. 列表显示用户获得的成就徽章，点击可查看徽章大图，并选择分享方式。
2. 已获得的徽章原色显示；未获得的徽章灰色显示

6.3.2 新建文档格式

页面入口：点击【个人中心】中的 “我的格式” 选项

用户任务：

1. 新建一个文档格式
2. 修改已有的文档格式

逻辑说明：

1. 格式名称在我的格式列表中最多显示 20 个字符，超出部分显示 “…”。
2. 格式名称限定 50 个字符数。
3. 标题格式名称随已创建的标题格式数量而显示：标题一、标题二、标题三…以此类推，正文格式名称为：正文。用户在修改格式时，无法自定义标题格式名称和正文格式名称。
4. 用户无法新建多个正文格式，即始终只能有一个正文格式。
5. 在编辑格式时，文字内容只能有一种统一的格式，
6. 在编辑格式时，此处的文档工具栏中只有四种功能：打开 / 关闭键盘显示、设置字体格式、撤销操作、重做操作。

6.4 创建在线协作文档并分享

6.4.1 新建文档选择页

页面入口：app 底部标签栏

用户任务：

1. 选择新建一个文件
2. 新建一个文件夹
3. 本地上传一个文件
4. 使用 OCR 文字识别创建一个文档

逻辑说明：

1. 点击 “文档”，新建一个文档类型的文件，进入【文档编辑页】。
2. 点击 “表格”，新建一个表格类型的文件，进入【表格编辑页】。
3. 点击 “演示文档”，新建一个演示文档类型的文件，进入【演示文档编辑页】。
4. 点击 “思维导图”，新建一个思维导图，进入【思维导图编辑页】。
5. 点击 “白板”，新建一个白板，进入【白板编辑页】。
6. 点击 “文件夹”，新建一个文件夹。
7. 点击 “本地上传”，从本地选择上传一个文件至云端，调用系统文件选择（申请系统文件访问权限）
8. 点击 “扫描图片”，对一张图片进行 OCR 文字识别，并将识别结果创建为一个文档类型文件。点击后触发由上而下弹出选择弹窗，用户可选择拍摄一张图片（申请系统摄像头权限）or 从本地上传一张图片（申请系统文件访问权限）
9. 新建文件夹的命名限定 50 个字符数，创建文件夹成功成功后进入所创建的文件夹中，返回时返回到【桌面页】
10. 用户可上传的本地文件类型：.doc/.docx、.xls/.xlsx、.ppt/.pptx、.txt

6.4.2 文档编辑页

页面入口：在【新建文档选择页】中选择 “文档”

用户任务：

编辑文档内容

逻辑说明：

1）手势操作：双击页面中的段落内容进入文档编辑模式。

2）手势操作：双指放大缩小调节文档的内容显示比例，当文档显示比例不为 100% 时文档底部出现 “还原尺寸” 按钮。当进入文档编辑模式时文档显示比例自动恢复至 100%。

3）在文档编辑模式下，左上方为 “编辑完成” 按钮，点击可退出文档编辑模式，并更新文档修改时间至当前时间。

4）页面中根据当前网络状态和文档内容的修改时间实时显示当前文档的保存状态，样式如下：

1. 文档内容没有改变时显示文档内容将自动保存。
2. 在网络状况良好的情况下，文档内容改变，显示已于 xx:xx:xx 同步此文档。
3. 在网络状况较差的情况下，文档内容改变，显示同步中…，待同步完成后显示已于 xx:xx:xx 同步此文档。
4. 在无网络的情况下，文档内容改变，弹窗强调显示当前无网络，编辑内容已离线保存。
5. 在无网络的情况下文档内容改变，恢复网络状态后显示同步中…，同步完成后显示已于 xx:xx:xx 同步此文档。

5）页面中显示当前参与文档协作的用户的头像，多用户参与协作时，用户头像依据打开文档 / 退出文档的时间顺序从近到远从左到右排列重叠显示，其中当前文档创建者的头像优先靠左显示。最多显示 4 位用户的头像，当参与协作的用户数大于 4 时，头像后显示…

6）页面上方显示 “分享文件”、“专注模式” 和 “更多” 三个选项，点击 “更多” 后弹窗显示关于当前文档的更多操作：

1. 文件导出选项，选择将文档导出成什么格式。
2. 选择是否标注星标：是 / 否。
3. ”保存文档格式“（标题格式、正文格式）。
4. ”应用文档格式“（标题格式、正文格式）。
5. ”权限管理“，快捷显示当前文档的权限状态：公开只读 / 公开可编辑 / 组内协作，点击跳转【分享设置页】。
6. ”图片集合视图“，排列当前文档中使用的所有图片。
7. ”文档目录“，按标题显示当前文档的目录。
8. ”文档信息“，点击查看文档创建者、文档创建时间、文档总字数、文档阅读次数、文档字符数（计空格）和文档字符数（不计空格）。
9. ”查找与替换“，点击查找或替换文档中的内容。
10. ”查看评论“，点击查看文档内的所有评论，并可以筛选 @ 提及用户的评论。
11. ”查看历史编辑信息“，点击查看文档的历史编辑版本，并可以选择还原。

7）普通键盘上方是文档工具栏，包含：

1. “键盘“ 按钮，点击可切换键盘显示状态：弹出 / 收起。
2. “格式“ 按钮，点击可设置文档标题的格式和字体的格式（特殊标记、不同字体）。
3. “序号“ 按钮，点击可设置有序序号、无序序号和任务勾选列表。
4. “插入“ 按钮，点击可在文档中插入图片、视频、音频、思维导图、便签内容、文档链接、外部链接、分割线、引用块、代码块。
5. “撤销“ 按钮，点击可撤销上一步对文档的操作。
6. “重做“ 按钮，点击可重做对文档的操作。
7. “@ 提及“ 按钮，点击可在文档中插入 @xxx ，并高亮显示，相关用户会在 app 中收到通知。也可以在当前文档中插入文件链接，点击文件链接跳转对应的文件。
8. “评论“ 按钮，在文档编辑状态下，点击可在文档中光标所在位置的行处插入评论内容。

8）退出文档编辑状态下，上下滑动浏览页面，底部出现浮窗显示当前文档字数统计，浮窗显示 3s 后消失。

6.4.3 分享设置页

页面入口：点击【文档编辑页】右上角 “分享文件 ICON” 进入【分享设置页】

用户目标：

1. 打开文档链接有效性 / 关闭文档链接有效性
2. 设置文档权限：公开只读 / 公开可编辑 / 组内协作
3. 选择文档分享方式

逻辑说明：

1. 当用户选择 “公开只读” 和 “公开可编辑” 选项时，可直接分享文档链接
2. 当用户选择 “组内协作” 选项时，出现 “配置组内成员与权限” 选项，点击进入【配置协作组页】
3. 关于文档的分享方式如下所示：

• “微信好友”，点击跳转微信选择好友页，以链接（小程序）方式发送给微信好友。
• “朋友圈“，点击跳转微信编辑朋友圈，以链接（小程序）方式发送至朋友圈。
• “钉钉“，点击跳转钉钉选择好友页，以链接（小程序）方式发送给钉钉好友。
• “微博“，点击跳转编辑微博页，以链接方式发送至微博。
• “复制链接“，点击将此文档链接复制到系统剪贴板中，弹窗提示（ 3s 后自动消失）。
• “生成二维码“，点击将此文档链接转化为二维码，并可以以图片形式保存至相册（相册读取写入权限）或分享。
• “生成图片“，点击将此文档内容生成图片，然后可以选择保存至相册或以图片形式分享。
• “更多“，点击唤醒系统分享选项菜单。

6.4.4 配置协作组页

页面入口：【分享设置页】中选择 “组内协作” 选项，点击 “配置组内成员与权限”

用户任务：

1. 配置文档协作组成员
2. 管理每位成员的权限

逻辑说明：

1. 用户可在搜索框中搜索协作组内的成员，搜索结果实时显示，搜索基础规则如下：

• 搜索范围：文档协作组。
• 搜索条件：用户用户名、用户账号（手机号、邮箱地址）。
• 搜索框内字符数限制：50 个字符。

2. 邀请用户加入协作组有三种方式：

• “最近协作”，点击查看最近协作的用户的列表，快捷选择邀请其加入当前协作组。
• “通过微信邀请朋友加入协作”，点击跳转微信选择好友页，以链接（小程序）方式发送给微信好友，好友点击链接加入协作组（非 app 用户需要先下载注册）
• “通过手机号邀请朋友加入协作“，点击跳转发送短信页，以发送链接短信方式发送给好友，好友点击链接加入协作组（非 app 用户需要先下载注册）

3. 每个协作组成员单元中成员的用户名最多显示 20 个字符，超出后显示 “…”
4. 点击协作组成员单元，进入【用户权限配置页】，为该成员配置文件权限，协作组成员默认权限设置为：可编辑、可以导出此文档、不可以修改其他用户的权限。
5. 【用户权限配置页】中，点击 “将此设置应用于协作组所有成员”，将为此成员设置的权限应用于当前协作组内的其他所有成员。

6.5 多用户协作文档

页面入口：可以通过点击 app 内通知进入，或者点击文档链接进入

设计说明：

当多用户进入文档参与协作时，显示每个用户的用户名并用不同颜色的光标标记显示，在光标所停位置处可以添加对该行内容的评论。用户可以对评论表示支持。

用户任务：

1. 参与文档协作编辑
2. 为文档添加评论

逻辑说明：

1. 页面中显示当前参与文档协作的用户的头像，多用户参与协作时，用户头像依据打开文档 / 退出文档的时间顺序从近到远从左到右排列重叠显示，其中当前文档创建者的头像优先靠左显示。最多显示 4 位用户的头像，当参与协作的用户数大于 4 时，头像后显示…
2. 多用户协作时，标记协作用户正在编辑的位置，不同用户的用户名用不同颜色进行标记，光标位置随所标记的协作用户编辑位置实时更新。
3. 在对应的光标上显示加入文协作的非文档创建者用户的用户名，用户名最多显示 10 个字符，超出后显示 “…”

6.5.1 专注模式

页面入口：点击【文档编辑页】右上角 “专注模式 ICON” 进入专注模式视图

设计说明：

用户的注意力会被网络状态的变化，以及其他用户参与协作时的头像和光标打断，而我们在每个阶段要尽量使用户专注于当前的行为与目标，所以我在【文档编辑页】中加入 “专注模式” 选项，帮助用户屏蔽一些信息，使用户在多用户协作时也能很好的专注于文档本身的内容。

用户任务：

切换 “专注模式” 视图

逻辑说明：

专注模式下【文档编辑页】显示内容：

1. 网络状态与文档同步状态
2. 文档内容

6.5.2 插入评论

页面入口：点击文档工具栏中的 “评论“ 按钮 / 点击文字段落右侧的评论标记 / 更多文档操作中的“查看评论” 选项 / 通知

用户任务：

1. 在文档中添加评论内容
2. 查看文档中的评论
3. 回复文档中的评论

逻辑说明：

1. 评论输入框中单行最多显示 20 个字符，超出后换行显示。
2. 仅当评论输入框内不为空时，“发送” 按钮为蓝色可用状态，其他情况下均为灰色不可用状态。
3. 插入评论后，在段落右侧标记显示此处段落中存在的评论数，点击可查看此处的评论。
4. 在评论详情弹窗中，左上角显示当前评论数序号 / 整篇文档存在的评论数。
5. 在评论详情弹窗中，显示当前评论的序号数，用户左右滑动可以查看下一条上一条评论。
6. 在评论详情弹窗中，点击 “更多” 弹出弹窗显示 “删除该评论” 和 “支持该评论” 操作，仅当当前用户对当前文档拥有管理权限时显示 “删除该评论” 选项。

07 「云书文档」体验设计度量调研问卷设计

用户体验度量是：通过一套可靠的测量体系，量化用户体验的过程，是让用户体验从 “抽象” 到 “具象” 的过程，同时也是一种更好的实现体验设计价值及体验设计体系化的关键路径。

在这里我使用 Google HEART 体验框架来设计调研问卷，用于之后的用户调研，并通过得到的数据继续优化设计方案，提升产品的使用体验。

1. 觉得云书文档看起来怎么样？

• 很好看
• 一般
• 不太好看

2. 您会愿意向身边的人推荐使用云书文档吗？

• 非常愿意
• 愿意
• 一般
• 不愿意
• 非常不愿意

3. 您在使用云书文档时有遇到过难以理解的地方吗？

• 没有
• 有

4. 您会愿意使用云书文档来处理每天的工作、生活事务吗？

• 非常愿意
• 愿意
• 一般
• 不愿意
• 非常不愿意

5. 您顺利使用云书文档完成了工作、或者生活上的一些事情了吗？

• 非常顺利
• 顺利
• 不太顺利
• 不顺利
• 非常不顺利

6. 您会愿意将自己获得的成就徽章分享到朋友圈或者微博吗？

• 非常愿意
• 愿意
• 一般
• 不愿意
• 非常不愿意

7. 云书文档在您心中的评分是？
8. 您对云书文档还有什么建议或者想要的功能吗？

08 总结

这个项目能从最初的一个笔试题能做到现在，连我自己也没有想到。

整个过程就是在不断的看书、找资料、看网站上的文章，然后对自己的项目进行查漏补缺。

到目前为止，这个项目一共是产出了一份用户研究报告、一份产品设计文档、一份交互说明文档、一份高保真 UI 稿和发布在摹客上的一份原型设计，基本上算是把从产品 – 交互 – UI 的流程都走了一遍吧（大概）。

在这整个过程中，我在产品文档和交互文档的编写方面都得到了锻炼，对在线协作文档和情景交互的设计方法也有了更深的理解，但比较遗憾的是自己身边接触类似体验设计实际业务的机会比较少，可能在处理一些实际业务问题时的掌控力还比较弱，文档和设计方案中也会有很多考虑不周的地方，所以还请大家多多指教啦。

也希望以后能够有更多这样的机会，我也会继续尽全力去学习和理解，不断完善自己的设计思路和业务处理能力（疯狂暗示）。

• 「云书文档」原始用户数据整理与解读：https://shimo.im/docs/WJPWkwK3PjQGXkK3
• 「云书文档」用户研究思路及过程：http://www.woshipm.com/ucd/4174162.html
• 「云书文档」高保真 UI 原型：https://www.mockplus.cn/ux2020/work/qsiqe

作者：默月，个人微信：Mostima330，欢迎大家来找我玩～

本文作者 @默月 。

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！