在线协作文档情景交互浅析与设计实例

写在之前:

刚毕业的“失足少年”,有需要我帮忙的工作机会 / 内推 / 任何建议请随时联系我!

真的很想接触到体验设计相关的实际业务!

人在杭州,北上广深都可以去!

非常非常谢谢大家!

00 / 设计背景

我们在平时的工作协作中会产生很多文件,比如一些文档、表格、演示文稿等等

传统的解决方案是基于本地化(Office 办公套件)的方式去实现,用户在本地创建文件,然后通过其他软件或者邮件的方式分享给其他用户

文件内容不能同步和实时修改,导致这种方法在多用户协作时不够高效与便捷

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

参考文献:《情景交互设计——为生活而设计(第二版)》

Karen Holtzblatt, Hugh Beyer / 著

朱上上,贾璇,陈正捷 / 译

清华大学出版社

01 / 用户数据调研与解读

以用户为中心的设计始于我们要认识到所有的创新都必须从了解用户入手,以解决现实世界中的问题。一个好的设计需要去深入了解用户的任务、动机、意图、策略和详细步骤。为了得到这些知识,我们需要去进行包括情境调研、用户访谈在内的一些手段来获得最初的用户原始数据,之后我们将得到的用户原始数据作为用户事实,以不同的身份(设计、营销、开发、数据建模)对每一个事实做出相应的解读,以此来推理和说明用户的行为和体验,并尝试得到关于这些行为和体验是如何揭示用户相关活动的结构的一些结论。

根据用户事实,我们也可以提出假设来初步解释事实的含义或事实背后的真正意图,这些假设将对我们之后的设计有暗示作用,很可能会变成具体的设计构思。良好的用户事实只是一个起点,好的产品设计实际上是建立在我们设计师对这些事实的解读之上的。

在这次的设计研究中,我使用了近期一段时间内 App Store 中与在线协作文档相关的 APP 下的一些用户评论内容来作为用户原始数据,在进行筛选和整理后得到 105 条有效用户评论,并对这些用户评论进行逐条相应的推理与陈述,最终得到 146 条用户解读数据,接下来我将使用亲和图来组织这些用户解读数据。

(原始用户数据及解读:https://shimo.im/docs/WJPWkwK3PjQGXkK3

相关产品参考:石墨文档、腾讯文档、Google Docs、WPS Office、印象笔记、有道云笔记。)

02 / 组织亲和图

亲和图是一种组织用户数据的最简单的方法,它可以将我们得到的用户解读数据整理成层次结构,用以尽可能揭示所有用户的常见问题和主题。我们可以在一张图上展示团队所关注的所有数据,包括用户在使用中的问题、忧虑和关键因素等内容。

而亲和图的构建其实也就是一种纯粹的归纳推理过程,我们将数据写在便签贴在墙上,然后让其他人查看手上的便签,寻找看上去与上一张意义类似的记录,找到后再贴在刚才那组便签之下。

以下是我构建的一个简单亲和图模型的一个片段:

03 / 建立用户体验模型

情境化设计体验模型可以帮助我们以多重视角来展现用户在使用在线写作文档时的工作结构,在这次的设计研究中我通过体验地图、身份模型和关系模型个这三个模型来传达数据,并展现出对于设计题目的思考。

在线协作文档中的体验地图

在体验地图模型中,我呈现出了用户在使用在线协作文档时的整体结构,分阶段描述用户目标,以及对应的一些用户行为。在这次的设计研究中,我将在工作场景中,以文档创建者和文档协作者的两个视角来构建相应的用户体验地图。

结合亲和图中的数据,我得出了一些关于体验地图的结论:

– 我们讨论的这些活动是发生在智能手机 app 端的情况。

– 这些活动可以在任何时间、任何地点以及多设备(电脑pc、手机、pad)上进行。当用户在手机端使用时,用户利用碎片时间来阅读文档和评论文档,一些比较复杂耗时间的编辑内容过程用户一般会选在在电脑端和 pad 端来进行。

– 在支持这个活动时,我们要考虑的背景是用户有在不同设备上查看 / 编辑文档,以及与他人协作文档的需求。

– 在活动中,用户的注意力会被网络状态的变化、其他用户参与协作的头像光标显示打断。

– 以文档创建者视角来看,用户花费时间最多且最为重视的阶段是编辑文档内容和设置分享权限,同时用户也会花费时间在协作完成后对文档的整理方面。

– 以文档协作者视角来看,用户花费时间最多的是在协作文档时通过评论与其他用户实现的交流,以及会注意关于文档的消息提示有没有与自己相关的内容。

– 文档修改或评论的相关通知会维持用户将协作文档继续向前推进。

– 在每一个阶段要使用户专注于当前的行为与目标,尽可能不要分散用户的注意力。

– 用户在手机端或者 pad 端编辑文档时会用到蓝牙键盘和耳机(有线 / 无线),并在编辑内容时喜欢把设备横过来展示。

在线协作文档中的身份模型

用户拥有着自我意识,他们也可以通过自己做事的行为和与他人表达的方式来表达自我意识,而通过确定那些与产品所支持的活动相关联的核心身份元素,可以帮助我们设计出可以帮助提升用户自我意识的产品。

当一个产品能够反映并且能够增强用户对自己的认同感时,用户会觉得这个产品很酷,对他们而言很重要;而当一个产品与用户自己的身份元素相违背时,产品就会失去用户的信任。所以为了可以设计出能够触动用户核心动机的用户体验,了解这些身份元素是非常有必要的。在这次的设计研究中,我整理亲和图中的笔记,分解出与用户有关联的身份元素,并尝试构建关于在线协作文档的一个身份模型。

结合亲和图中的数据,我得出了一些关于身份模型的结论:

– 在线协作文档中,用户面对未完成协作文档(任务事件)列表的强迫感,和完成协作时的成就感是用户作为文档协作者的核心驱动力。

– 我们的产品需要帮助用户提高效率。

– 由于误触文档使其变为编辑状态而在没有对文档做任何改变的情况下自动更新日期,用户会有些后悔,这会使用户在阅读文档时小心翼翼。

– 统计用户一段时间内创建了多少文档、完成了多少次文档协作,哪一次完成的时间最快等信息,汇总成报告输出给用户,可以帮助用户庆祝他们的成就。

– 分享用户自己在协作文档 app 中的一些数据,可以帮助用户表达自己工作可靠、高效的形象。用户可以与同事分享。

在线协作文档中的关系模型

在在线文档的多用户协作活动中,用户之间的沟通和协调都在影响着目标是否可以顺利完成,顺畅的沟通和协调便于了解团队或同事之间的工作方式,感受团队的专业性,这些也有助于团队建立良好的合作关系,确保合作的成功进行。

所以我尝试建立关系模型,然后依据关系模型来进行设计,来帮助我们了解在目标活动中的各个参与者,以及如何更好地参与活动、支持他们,并通过目标活动情境增强各个参与者之间的联系。

结合亲和图中的数据,我得出了一些关于关系模型的结论:

– 在文档协作用户关系中,文档创建者是最重要的人,他的核心作用是组织整个协作过程,整合其他用户在讨论中的信息并完成最终文档内的内容。

– 在协作文档中,用户之间主要通过对文档内容的评论和回复来实现交流。

– 当文档完成协作时,我们可以帮助用户一起庆祝他们一起做成的这件事。

– 我们应该帮助用户快速找到评论 / 提到自己的评论。

– 用户在进行文档协作时会通过评论分享关于文档内容的修改意见以及需要添加的内容、备注等信息;通过不同颜色标记的光标来分享不同用户编辑的位置信息;通过通知来分享文档是否被改动的信息;通过在线链接和文档源文件来分享文档完整内容;

– 整个文档协作是通过文档修改的通知、文档或评论中提要用户的通知和未关闭的评论消息来推动大家一起进行的。

04 / 部分页面设计方案

接下来我将基于以上的用户数据以及研究结论来提出一些设计方案。

首先是产品概述,包括定义、用户类型以及一些主要的体验情景归纳。

「云书文档」

首先是底部标签栏中的五个页面,分别是【通知页】、【云端页】、新建文件、【桌面页】、【星标页】

关于【通知页】的设计

通过之前用户体验模型中 体验地图 和 关系模型 得到的结论,我们可以知道作为文档协作者,用户会注意关于文档的消息提示中有没有与自己相关的内容。并且,整个文档的协作过程是由文档被修改的通知,以及文档或评论中提到用户的通知来推动的。

所以在这里我将 【通知页】放在优先级较高的底部标签栏中,使用户方便快捷地查看通知信息,并由此推动整个协作过程的进行。

关于【云端页】的设计

用户在进入 app 时默认进入到【云端页】

在【云端页】添加 “便签” 模块,用户可以通过手写、语音输入和键盘输入三种方式新建便签,同时可以将便签置顶,方便用户快速记录自己的一些想法,或快速查看一些随手记事。

关于【桌面页】的设计

【桌面页】分 “我的桌面” 和 “团队空间” 两个模块,点击切换 Icon,弹出浮窗可切换 Tab

  1. 在 “我的桌面” Tab 下,列表中排列用户创建的文件夹、用户创建的文件

  2. 在 “团队空间” Tab 下,列表中排列用户创建的文件夹、该团队内其他用户创建的文件夹、用户创建的文件和该团队空间内其他用户创建的文件

其中,在 “团队空间” 下创建的文件分享权限默认设置为 “组内协作”,协作组内的用户与团队空间中添加的用户保持一致。

关于【个人中心 – 我的成就】的设计

通过之前体验模型中 身份模型 得到的结论,我们可以知道用户在使用在线协作文档时,对自己会有一个高效工作者的认知,而我们可以通过设计帮助用户庆祝他们成就,分享他们的成就的这些方式,来帮助用户强化这一认知,从而提升用户对我们产品的信任。

因此,我在【个人中心】中新增 “我的成就” 模块,当用户完成一些任务,或隐藏任务时,会获得一枚徽章,用户可以选择将这些徽章分享至社交媒体中,帮助用户表达自己工作高效、认真、可靠的形象。

关于【分享设置页】的设计

权限设置

1. 当用户选择“公开只读”和“公开可编辑”选项时,可直接分享文档链接。

2. 当用户选择“组内协作”选项时,出现 “配置组内成员与权限选项” ,点击可详细配置协作组内的成员(邀请新成员、移出成员)和每位成员的权限。

关于【配置协作组(成员与权限)】的设计

在协作组成员列表中,具有管理权限的用户左滑协作组成员可显示 “移出该成员” 选项。

因为在之前的用户数据中有用户提到过希望对文档协作组成员的权限进行更为细致的管理,所以我在对文档的编辑权限之外,新增导出文档和管理文档的权限。文档创建者可以为每一位协作者分配不同的权限,也可以将为一位协作者配置的权限快捷设置为所有协作者的权限。

默认状态下,除文档创建者外,其他协作用户的权限均为:可编辑 / 可以导出此文档 / 不可以修改其他用户的权限。

新增 “格式模版” 功能

用户可以将一篇文档中的标题格式和正文格式保存为模版,之后应用到别的文档中去。

用户可在【个人中心】中的 “我的格式”中对模版进行管理:新建格式、编辑格式。

新增 “专注模式” 功能

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

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

1. 网络状态与文档同步状态

2. 文档内容

无内容设计

关于 “无内容” 状态的设计,我从两个角度去进行了浅析:

1. 首先是逻辑,但看到“无状态”时,应该让用户明白这里发生了什么,以及之后用户该怎么办

2. 第二点事情绪,我想加入一些情绪因素,可以的话去构建一个简单的故事,来帮助我们去暗示用户接下来的行为

在这次的设计研究中,我将 “无内容” 状态的逻辑重点放在告诉用户 “这里没有内容” 的信息,然后提供给用户一个创作内容的入口。情绪方面,我想要暗示用户去创作内容,那么首先要为用户提供一个创作内容的理由。

在之前研究中总结的体验场景中,我发现用户使用协作文档大概可以列为三个场景:

1. 工作需要

2. 个人创作(写小说、知识总结)

3. 和其他用户(恋人、朋友)一起制定计划

而我们在创建一份文档时的理由一定会在文档标题中展现出来,所以在视觉主体方面我采用了突出显示“文档标题”的形式,配合文案 “工作、小说、或者和 TA 的旅行计划” 简单构建一个使用情景给用户,调动用户的情绪来暗示用户去创作内容。

05 / 总结

整个项目的周期大概为三个月左右,目前为止是一共产出了 146 条用户解读数据,3 个体验模型共计 20 条研究结论,19 条需求方案和 36 个页面的高保真 UI 设计,还有一些内容准备放到之后去做了。

也是第一次用学到的方法论做了一个较为完整的 ux 概念项目,对原书中的一些研究方法做了精简,并且结论可能会有一些考虑不周或者一些不成熟的地方,还请大家多多指教啦。

非常感谢 App Store 中为在线写作文档产品留下各种建议的用户们,是你们为这个设计项目的内容提供了原始的数据基础。

也对有耐心看到最后的小伙伴表示感谢,我自己也还是一个想要继续学习情景交互设计和体验设计的小白,欢迎大家来找我一起讨论一起学习一起玩呀 ~

Design By 默月

Thanks for Watching 🙂

© 版权声明
THE END
喜欢就支持以下吧
点赞0
分享
评论 抢沙发