基于网页浏览轨迹分析的用户体验研究

戴维 黄峰 郑程

摘要

在互联网化的进程中，所有企业都开始逐渐从以产品功能为中心向以用户体验为中心进行转变。特别足进入DT时代，以大数据为驱动的用户体验研究方兴未艾，旨在通过数字化相关技术将用户对产品和服务的体验进行有效识别、记录、分析，进而为持续的优化提升提供决策支撑。本文介绍并实现了一种基于网页浏览轨迹分析的用户体验研究方法，同时通过实验评估了本方法的实施效果。

【关键词】用户体验分析 网页热力分析 浏览轨迹 UI/UE

目前，学术界对用户体验（UserExperience，简称UE）没有达成一个统一的定义，但业界在长期的实践过程中大致形成了一个统一的认识：用户体验是用户在使用产品或接受服务的全过程中所形成的感受，包括偏好、情感、印象、心理反应等等。特别是对于信息系统而言，一个好的用户体验可以形成持续的用户粘性和强大的传播力，进而提升用户规模、降低获客成本。影响用户使用信息系统的体验因素涉及方方面面，包含界面友好性、功能易用性、服务响应时间、网络时延等。这些影响因素可以根据对用户的影响程度分为直接体验、间接体验。其中，在网页上进行浏览、点击等操作所形成的直接体验是用户在使用信息系统时的直观感受，而这些直观感受又难以有效反馈到信息系统开发人员那里，因此这也成为各大信息服务提供商、互联网公司研究用户体验的重点和难点。

1 基于网页行为与轨迹的用户体验分析方案设计

本文所述的基于网页操作与轨迹的用户体验分析方案可以分为三层，自底向上依次为

（1）数据采集层;

（2）数据处理层;

（3）数据可视化层;

其中，数据采集层主要负责收集用户端在网页上所产生的行为与轨迹信息;数据处理层将根据坐标的时间属性、空间属性等信息进行加工处理，提供给上一层进行可视化处理;在数据可视化层中，我们采用了一种基于热成像的涂层，用于将用户在网上的操作与轨迹显性化。以下将对这三层的分工和内容进行重点介绍。

1.1 数据采集层

在大多数情况下，用户在网页上进行浏览、点击等操作时都会通过鼠标来实现，因此本文将通过采集鼠标的动作、移动路线来表示用户的行为与轨迹。更进一步地，我们通过鼠标在网页上的矢量信息来对用户的行为与轨迹进行建模。由此，我们通过不断地扫描用户端鼠标的矢量信息，从而完成对用户行为与轨迹的数据采集。如果将网页进行网格化处理，那么鼠标的矢量信息即可用x轴与Y轴坐标信息表示出来。

采集鼠标坐标信息的过程涉及“三端”，并可以分为二个阶段

数据采集层的“二端”包含：客户端、服务端、采集端。客户端，即用户操作端，或者称为浏览器端;服务端，我们会在在服务器端的应用源码中插入一段实现客户端数据采集功能的代码：采集端，用户端根据服务端的指令信息实时地将鼠标坐标信息上传给采集端。

数据采集层的二个阶段包含：建立HTTP连接、采集配置信息初始化、采集数据传送。二个阶段的网络时序图由图1所示。首先，用户端与服务端建立HTTP连接，确保客户端与服务端、采集端网络连通。其次，用户通过系统验证并登入，接着，服务端会将采集端IP地址、网页URL等采集配置信息下发至客户端。最后，客户端会定时向采集端报告鼠标坐标信息。

1.2 数据处理层

客户端将本地鼠标坐标信息上报采集端后，会在采集端形成一个坐标数据集。因为每个坐标都含有一个时间戳，因而从另一个角度来看，坐标数据集也是一个时间序列，由不同时间点的坐标信息排列而成，如下面这样的形式。

数据处理层负责将坐标数据集进行加工，并提供给数据可视化层，也称为“量化处理”。“量化处理”由“分区集合”和“颜色编码”两部分组成。

在“分区集合”中，我们对网页进行网格化处理，最小的网格称为“块”。换句话说，网页由不同的块组合而成。因此，我们可以根据坐标数据将时间序列中不同的坐标节点划入不同的块中。而在“颜色编码”中，我们对不同块中存在的坐标节点进行计数。根据块内所包含的坐标节点数分配不同的RGB颜色值。在这个过程中，我们采用了一种基于热成像的编码技术，用以表示用户操作在不同块中的“冷热程度”。坐标节点计数越多的块其颜色编码越偏向暖色系，表明该块用户频繁操作，反之，坐标节点计数越少的块其颜色编码越趋于冷色系，表明该块不是热点区域

1.3 数据可视化层

该层基于clickheat开源软件进行二次开发，将数据处理层加工后的坐标数据作为涂层叠加在源网页之上，我们将合成后的图像称为“网页热力图”。它将不同块的颜色与页面元素进行对应，页面不同区域中浏览与交互元素的用户使用情况就可以通过不同块的着色显性化。分析人员可以根据“网页热力图”进行有针对性地UI/UE优化。

2 基于网页行为与轨迹的用户体验分析平台实现

基于数据采集层、数据处理层、数据可视化层，我们构建了网页热力分析平台，旨在为用户体验分析人员提供一个Web接口和界面，可以随时查询、分析业务系统的用户行为与轨迹。该平台主要分为两个区域：热力图参数区;热力图生成区。

（1）热力图参数区提供了热力图的各类参数选项。热力参数可以分为两类——分析对象、分析域。分析对象即为特定网页，分析人员可以通过地址栏选定页面分析对象的URL，一个URL即对应一个网页。分析域包含日期域、时间域、记录数域等二个维度。日期域允许分析人员通过选择起止日期来限定用户行为与轨迹的坐标集范围;时间域允许分析人员选择最近的一个时间段来限定用户行为与轨迹的坐标集范围;记录数域则允许分析人员选择最近的坐标记录条数。当选定分析对象和分析域后，网页热力图即可生成。如前所述，热力图中颜色越鲜艳的网页區域，表示出用户浏览与操作的热点;反之，热力图中颜色越深的网页区域，表示出用户的活跃程度降低;没有热力着色效果的网页区域则表示未记录到用户浏览痕迹。我们将此技术应用到了中国电信集团公司的IT系统之中，热力分析平台如图2所示。因文中所展示的网页均含有敏感信息，故做脱敏处理。

（2）为了更精细化地分析用户在不同场景下的体验，我们根据人与网页交互的特点将网页分成了两类：推型网页（push-page）;拉型网页（pull-page）.

在推型网页中，人们的行为通常只限于浏览，而客户端与服务端并没有频繁地交互，属于这一类型的网页包括报表类系统网页、监控大屏类网页等。而在拉型网页中，用户需要在网页上进行点击、编辑等操作，即客户端与服务端存在大量、频繁的交互，包括直接面向公众客户和政企客户的各类业务系统。图3和图4分别显示了基于推型和拉型网页的网页热力图。

3 基于网页行为与轨迹的用户体验分析效果评估

为了更好地评估网页热力分析在用户体验研究中所产生的效果，我们开展了相关的测试与评估。我们选定了一个测试对象——由推型网页构成的系统A，并将基于网页热力分析进行UI/UE优化改造时间节点前后一周的系统平均停留时间、系统平均跳出率时间作为考察指标，设置对照组进行实验。其中，平均停留时间与平均跳出率的计算公式如下所示：

在周一至周五的每天中午12点、下午6点分别统计一次当日上下午时段的系统平均停留时间、平均跳出率。实验结果如图5所示。

图5的上半部分将页面优化前后的系统平均停留时间进行了对照，结果显示改造后比改造前的平均停留时间增加了2.2 分钟;图5的下半部分将页面优化前后的系统平均跳出率进行了对照，结果显示改造后比改造前的平均跳出率降低了约10%。

通过上面的实验，我们认为基于网页热力分析的用户体验优化相关措施可以提升系统平均停留时间与平均跳出率，并在一定程度上对提升用户感知产生积极作用。

参考文献

[1]Jesse James Garrett等.用户体验要素：以用户为中心的产品设计[M].北京：机械工业出版社，2011.

[2]Elizabeth Goodman等.洞察用户体验：方法与实践（第2版）[M].北京：清华大学出版社，2015.

[3]https：//www.dugwood.com/clickheat/index.html.

[4]Alan cooper等.交互设计精髓[M].北京：电子工业出版社，2015.