随着互联网产品越来越多,用户群体越来越庞大以及用户品位的多样性增加,我们会发现这样的一个规律,就是相同类型的产品,比如播放器中的QQ影音和暴风影音,再比如小游戏平台中的腾讯游戏和联众等等,他们的功能是相同的或者是相似的,但是对于用户来说,每个人都有着不同的使用喜好。

其实无论用什么平台,都能完成同样的任务,那么对于用户来说,在同等产品当中他们是如何选择的呢?除了一些比如大品牌效应等等平常的因素,用户体验的好坏会成为用户在选择产品中的一个重要因素。假如我们在使用一个播放器放电影,发现经常出现卡顿和声音走音的现象,那么我相信这个用户很可能就会选择其他的产品。在互联网时代,用户体验越来越成为企业所重视的内容,从中也衍生出来了用户体验管理这么一个新生的事物。我今天就来给大家普及一下用户体验管理-UEM的相关知识。

一、什么是UEM以及UEM使用场景

UEM这个词大家可能比较陌生,UEM是USER EXPERIENCE MANAGEMENT的缩写,中文翻译为用户体验管理,它所要达成的目标是能够实时了解互联网产品或应用的真实用户体验。

这么说可能还是有一些抽象,简单来说UEM就是一种工具,这种工具可以实时收集很多数据,比如说用户所访问页面加载时间的长短、在访问页面是否出现了比如图片无法加载的问题、用户是通过何种设备比如是用手机还是电脑访问的应用,它走的是中国移动还是中国联通的流量等等。在收集完很多类型的数据之后,UEM会对数据进行归纳和处理以供分析人员使用,这样开发的公司或者运营商就知道了用户在应用当中的体验情况了,比如用户在访问哪些页面的时候比较卡,大部分用户是通过手机访问还是电脑访问等等。有了这样的数据,厂商就可以持续不断改进用户体验,让产品做得越来越受用户喜欢而且好用。这就是UEM所做的工作。

UEM的使用场景非常广泛,可以说只要是需要了解用户在应用上体验好坏的地方,都需要UEM。目前比较常见的场景是PC网站和手机端网站的用户体验,很多厂商也在做手机APP端体验管理的内容。相信在不久的将来,用户体验管理的应用场景会越来越多,内容也会越来越丰富。

二、UEM核心功能

用户体验一般分为移动应用体验(UEM App)和浏览器应用体验(UEM Web)两部分。对移动应用的用户体验支持,国内外很多厂商的产品都较为成熟和完善,大家在网上能够找到很多可以参考的项目,UAVStack开源项目目前主要关注于面向浏览器应用的用户体验。

一般来说,UEM的核心功能包括以下内容:

三、UEM常用实现技术

现在在UEM领域,常用的实现技术还是"探针"技术。也就是通过在页面HTML当中插入一段JAVASCRIPT代码(这里称为"探针"),这段代码可以实时获取和发送页面访问的一些数据,后台再对这些数据进行清理和收集,最后对数据进行统计画图或者以表格形式进行展示。其他的技术还有通过获取浏览器或者服务器上收集的数据来收集用户访问相关内容,但是目前用的比较少。

四、"探针"技术捕获数据解密

UEM的核心在于浏览器探针,通过自动注入到监测网页的JS代码,对实际用户访问的网页性能数据进行全样本采集和分析,找到影响用户体验问题本源,帮助用户持续优化Web应用性能。

浏览器探针的作用在于以下几点:

  • 采集浏览器基本信息
  • 采集页面性能数据(Navigation Timing API)
  • 采集AJAX性能数据+请求/响应数据
  • 采集JS错误数据(包括:出错页面或脚本URL,引用页面URL,Error Message,错误位置:行号,列号,等等)
  • 采集页面追踪数据(Resource Timing API)
  • 将捕获的数据上传到UEM Server,便于进行后续的存储、多维度分析、预警和优化等。

浏览器探针是根据浏览器状态来采集页面性能数据的。每次页面请求,当获取到onload事件结束,则以事件结束时间定义为页面完成时间。当有异步请求再次加载内容,那么这些异步请求记录在AJAX数据当中。基于采集到的数据,可以得到以下页面性能指标:

基于这些指标,页面加载流程的分解和可视化将会变得十分简单。

五、页面加载流程可视化

页面加载流程可视化是UEM数据统计的一个重要手段,是UEM成果的通俗展示方式。上图是页面加载流程可视化的一个示意图。上述页面性能数据是实时上传的,但数据上传分四个时机:整个页面加载完成后上传、离开页面时上传、发生JS错误时上传和有AJAX请求时上传。此外,浏览器探针是自动注入到监测网页的,UEM Server会监听应用服务器的输出,当用户开启自动注入功能,UEM Server会在应用服务器的输出函数内自动注入UEM的浏览器探针,通过大量的实验室数据对比,自动注入UEM浏览器探针对服务器性能几乎无影响。

UAV官网地址:HTTPS://UAVORG.GITHUB.IO/MAIN

GITHUB地址:HTTPS://GITHUB.COM/UAVORG/UAVSTAC

作者:何建欣、谢知求

来源:宜信技术学院

UEM“探针”技术及用户体验管理的更多相关文章

  1. 全面产品管理-从细微处认识"用户体验"

    转载: 让我以一个故事开始本文,我觉得这个故事能概括大多数人听到“用户体验”这个术语时的想法. 我经常访问的一个财经网站给我发了一封电子邮件,请求我点击里面的一个链接,对一些信息进行审核.所以我就点了 ...

  2. CDN高级技术专家周哲:深度剖析短视频分发过程中的用户体验优化技术点

    深圳云栖大会已经圆满落幕,在3月29日飞天技术汇-弹性计算.网络和CDN专场中,阿里云CDN高级技术专家周哲为我们带来了<海量短视频极速分发>的主题分享,带领我们从视频内容采集.上传.存储 ...

  3. paip.提升用户体验----gcc c++ JIT-debugging 技术

    paip.提升用户体验----gcc  c++ JIT-debugging 技术 作者Attilax ,  EMAIL:1466519819@qq.com  来源:attilax的专栏 地址:http ...

  4. Progressive Web App是一个利用现代浏览器的能力来达到类似APP的用户体验的技术——不就是chrome OS吗?

    什么是Progressive Web App? Progressive Web App是一个利用现代浏览器的能力来达到类似APP的用户体验的技术,由Google实现,让浏览器打开的网址像APP一样运行 ...

  5. 利用简洁的图片预加载组件提升h5移动页面的用户体验

    在做h5移动页面,相信大家一定碰到过页面已经打开,但是里面的图片还未加载出来的情况,这种问题虽然不影响页面的功能,但是不利于用户体验.抛开网速的原因,解决这个问题有多方面的思路:最基本的,要从http ...

  6. WTF Forms – 使用 CSS 实现用户体验更好的表单

    WTF forms 借助 CSS 提供友好的 HTML 表单控件,专为 IE9+ 以及最新的 Chrome.Safari 和 Firefox 浏览器.以文件输入控件的改进,使用 label 包裹在 i ...

  7. Ladda – 把加载提示效果集成到按钮中,提升用户体验

    Ladda 是一组集成了加载提示的按钮,以弥合行动和反馈之间的时间间隔,提供更好的功能使用体验.主要用于在用户点击提交之后,向用户提供即时的反馈,让他们知道浏览器正在处用户提交的任务. 您可能感兴趣的 ...

  8. 运用预加载提升H5移动页面的用户体验

    原文地址:http://www.grycheng.com/?p=2188 在做h5移动页面,相信大家一定碰到过页面已经打开,但是里面的图片还未加载出来的情况,这种问题虽然不影响页面的功能,但是不利于用 ...

  9. 提升网站用户体验—WebP 图片的高效使用

    一.WebP 的由来 现代图像压缩技术对我们的生活方式影响很大.数码相机能将上千张高质量图片存储到一张内存卡里.智能手机可以与邻近设备快速分享高分辨率的图片.网站与手机等移动设备能快速展示各种富媒体. ...

随机推荐

  1. Scala 函数式编程(一) 什么是函数式编程?

    为什么我们需要学习函数式编程?或者说函数式编程有什么优势?这个系列中我会用 scala 给你讲述函数式编程中的优势,以及一些函数式的哲学.不懂 scala 也没关系,scala 和 java 是类似的 ...

  2. MyBatis简单使用方式总结

    MyBatis简单使用方式总结 三个部分来理解: 1.对MyBatis的配置部分 2.实体类与映射文件部分 3.使用部分 对MyBatis的配置部分: 1.配置用log4J显式日志 2.导入包的别名 ...

  3. 跟着大彬读源码 - Redis 5 - 对象和数据类型(上)

    相信很多人应该都知道 Redis 有五种数据类型:字符串.列表.哈希.集合和有序集合.但这五种数据类型是什么含义?Redis 的数据又是怎样存储的?今天我们一起来认识下 Redis 这五种数据结构的含 ...

  4. Excel催化剂开源第22波-VSTO的帮助文档在哪里?

    Excel催化剂开源第22波-VSTO的帮助文档在哪里? Excel催化剂   2019.01.12 14:10 字数 2930 阅读 55评论 0喜欢 0 编辑文章 对于专业程序猿来说,查找文档不是 ...

  5. isinstance/type/issubclass的用法,反射(hasattr,getattr,setattr,delattr)

    6.23 自我总结 面向对象的高阶 1.isinstance/type/issubclass 1.type 显示对象的类,但是不会显示他的父类 2.isinstance 会显示的对象的类,也会去找对象 ...

  6. TensorFlow笔记-文件读取

    小数量数据读取 这些只用于可以完全加载到内存中的小型数据集: 1,储存在常数中 2,储存在变量中,初始化后,永远不改变它的值 使用常量 training_data = ... training_lab ...

  7. css 图片裁剪显示

    用object-fit:cover object-fit属性详解 object-fit:CSS 属性指定替换元素的内容应该如何适应到其使用的高度和宽度确定的框. object-fit:fill 被替换 ...

  8. 【干货干货】configtxlator 工具介绍

    这一章我们对configtxlator做一个解说. 1, configtxlator 他是什么,有什么用? configtxlator 官方说明是用于生成Hyperledger结构通道配置的实用程序: ...

  9. 《VR入门系列教程》之6---VR硬件介绍及DK1

    第二章 VR硬件介绍     本章主要介绍当前比较流行的消费版VR设备,包括VR头显以及应用运行的PC和手机平台.     即使是在这工业高速发展的时代,一些大厂(比如Facebook的Oculus ...

  10. 段落超出div部分隐藏显示

    overflow: hidden; white-space: nowrap; text-overflow: ellipsis;