这篇文章会讨论:

  1. 在什么情况下需要做 AB 实验
  2. 从产品/交互角度,如何设计一个实验
  3. 前端工程师如何打点
  4. 如何统计数据,并保证数据准确可信
  5. 如何分析实验数据,有哪些数据需要重点关注
  6. 附:如何搭建前端实验项目,以 mip-experiment 为例

一. AB 实验的使用场景和正确用法

通常,在页面有样式变化,但又不确定是修改影响好坏的时候进行 AB 实验,实验数据可以为改版提供有力支持。

某公司日常(1)
产品:把页面标题变成之前的两倍。标题就是要醒目,要大大大。

设计:打死都不同意,太大的标题不精致不优雅。
BOSS:下面的按钮点击导流就是收入。收入就是一切!!!你们做下实验,采用收入高的方案。
前端:哦。

当不确认按钮颜色,banner 大小,两个宣传语哪个效果好的时候,实验数据可以帮你做决定。

二. 产品经理如何设计实验?

在设计一个实验时,需要考虑以下问题:

2.1 实验的目的是什么?

提升点击:提升单个按钮转化能力,提升页面总体点击率,增加广告收入
用户留存:增加用户在页面的留存时长,拉升登录,减少多步骤页面的用户流失
强化功能:增加用户搜索次数,增加用户点赞频率,增加用户购买次数

重点关注一个目标,并选择其它几个目标作为辅助,以免走偏。比如:提升广告点击率,但不减少用户的留存时长和购买次数。Jenny_L 多啰嗦一句,用户体验是绝对不能损失的。在页面头部多插入一条广告,虽然可以短时间内提升广告收入,但长期来看会造成用户反感,造成永久的用户流失。

2.2 实验应设置哪些变量,哪些不变量?

样式:按钮变大,banner 底色,文章行间距和长度中英混排样式
交互:增加提醒,增加面包屑导航,增加 loading 动画
文案:文案风格,文字长度

通常情况下,做实验都是使用控制变量法,仅改变一个影响因素,保持其他因素不变。控制变量法在物理实验中经常用到,比如自由落体实验:使用相同的物体(保证空气阻力不变),仅改变物体下落的初始高度,计算下落时间与高度的关系。类似地,在 web 样式改版实验中,仅改变标题大小,保持其他元素一致,这样就能得出标题文字大小和下方按钮点击率的关系了。

某公司日常(2)
产品:我们做个实验,验证“标题变大,按钮点击量增加”。
设计:title @2x 的设计稿给你。

前端:好。

2.3. 为得出实验结论,需要关注哪些数据?

2.3.1 提升页面的用户体验:
  • 用户停留时间
  • 交互动作次数
  • 页面展现量(PV)
  • 用户数(UV)
  • 单个用户访问页面数 = PV/UV
2.3.2 提升广告收入:
  • 广告点击次数
  • 页面展现量(PV)
  • 广告点展比 = 点击次数/PV
2.3.3 提升 App 导流量/按钮导流能力:
  • 按钮展示次数
  • 按钮点击量
  • 按钮点展比 = 点击量/展示次数

三. 为了得到实验数据,如何抽样,前端工程师如何打点?

3.1 如何抽样

github/mip-experiment 实验组件采用的方案是前端随机数抽样。简单来说,就是预先设置100个实验分组,算一个100以内的随机数,随机数落在哪个区间,用户就进入哪个实验分组。

3.2 如何打点

打点请求的统计汇总方式有两种:第三方统计与自行统计。前端工程师只需要了解项目采用的是哪种就可以了。

3.2.1 PV & UV 打点

第三方统计:使用百度统计或类似服务,都不需要前端工程师手动打点,在页面插入统计代码后,在后台可以就看到 PV&UV。
自行统计:每次页面加载时看下有没有标识单一用户的 cookie,如果有,则在document.readyState === 'complete'时发送 PV 请求。数据分析时,汇总所有 http request 请求得到 PV, 根据 cookie 去重的到UV。如果没有 cookie,则根据设备特征产出及访问时间计算出一个字符串,用于标识唯一用户。

3.2.2 交互打点:滑动,点击

交互日志的打点需要前端工程师手动绑定事件。比如给按钮绑定点击事件,给轮播图绑定滑动事件等等。

第三方统计:在事件触发时,调用统计服务的API,将参数传入即可。例如百度统计的事件 API_hmt.push(['_trackEvent', category, action, opt_label, opt_value]);,那么在事件中就可以写_hmt.push(['_trackEvent', '按钮01', '点击']);
自行统计(百度系方法):在事件触发时,新建一个图片,在图片URL中拼上统计事件的链接。比如百度搜索结果页的滚动请求为 https://sp1.baidu.com/xxx/mwb.gif?type=3&fm=view…,也可以拼接类似的 http request,比如https://m.aa.com/a.gif?obj=按钮01&event=点击

3.2.3 元素展现打点

在浏览器自带事件中,没有“元素在浏览器内可见”事件,但是可以用 JavaScript 判断,或者引用第三方库来实现。
JavaScript 判断思路:根据页面当前滚动距离 scrollY,元素距离顶部距离 top,和屏幕高度 screenHeight 可以计算出元素是否在页面内可见。

某公司日常(3)

前端:监听滚动事件。
if( top > scrollY + screenHeight) {
-___ 按钮在屏幕内展现一次,发请求;
-___ 标记为已展现过。
}

第三方库jquery 插件-github原生实现- github

四. 如何统计数据,并保证数据准确可信

4.1 统计的两种方式:第三方统计与自行统计

如果选择第三方统计,就选择了 Easy 模式。百度统计,Google Analytics 等统计服务会帮你计算很多需要的数据。首推百度统计,除了因为它是自家产品,有问题随时可以找接口人解决之外,还因为它是免费的中文统计,投放简单,数据产出快。

如果选择自行统计,那么面对的就是浩大的工程了,储存量和计算量惊人。百度系的统计是将统计参数拼接到图片 URL 后面,带给服务端。知乎的统计是发送了 POST 请求。无论哪种方案,每次用户点击,滑动,数据加载都会产生一条 http request,储存和计算这些 request 会耗费不少服务器资源。Jenny_L 没有实践过,如有需要,可以 google 一下

4.2 为保证数据可信,请空转流量

解释:空转是指先抽样,统计关键数据,而不修改页面样式的流程,相当于AA实验。

原因:虽然前端随机数抽样及类似方法理论上能够保证两份流量 pv 和 uv 相同,关键数据相差不大,但毕竟存在抽样不均的特殊情况。空转可以明显地发现抽样不均,摒弃掉这部分流量,保证实验数据的变化仅仅是实验本身(样式改变)引起的。

具体做法:如果要做 AB 实验,需要实验组 A 和对照组 B 两组流量。一次性抽取5-6组流量,空转3天,监控 pv,uv,点击数量等关键数据。选择两组数据最接近的上实验,其他流量可以释放。

4.3 为验证结论正确,请反转实验

解释:当得出实验正向结论后,将实验反转,对照组变成实验组,实验组变成对照组。

某公司日常(4)
产品:实验数据正了,标题就是要大大大!
设计:这不科学,应该是数据波动。需要反转验证。

前端:嗯,我反转一下。

原因:反转实验能够验证实验数据的差别是由实验(样式改变)引起的。但需要注意的是,建议只在实验为正向收益时反转实验。如果收益为负,反转实验,只会多损伤原对照组的用户体验。

具体做法:举个例子,实验目的为“按钮大小对该按钮点击率的影响”。A 组流量按钮变大,B 组为对照组,按钮大小正常,数据显示A组的按钮点击率升高,效果更好。在反转试验中,A 组流量按钮回复正常,B 组变为实验组,按钮变大。如果此时数据显示B组按钮点击率升高,说明按钮大小对点击率有影响。

4.4 为减少多个实验互相影响,请分流量实验,不要分层实验

解释:“分流量实验”是指一次抽取流量,分别进行多个实验。“分层实验”是指每个实验都从100%中抽取一次流量。

原因:“分流量实验”能够保证实验间没有重合,一份流量不会同时中两个实验。而“分层实验”相当于从总流量中抽取多次,一份流量有概率同时中两个实验,这会对实验结果有一定影响。

具体做法:

  • 分流量实验: 抽取40%的流量,20% 用于 Foo 实验,20% 用于 Bar 实验。
  • 分层实验: 抽取20%的流量用于 Foo 实验;再抽取 20% 流量用于 Bar 实验。(此时约有 4% 流量即Foo 又 Bar)

某公司日常(5)
产品:反转数据也是正的,说明标题应该大大大。
设计:不对,不科学,是不是流量之间有干扰?

前端:采用的分流量实验,确认没有干扰。

4.5 考虑到用户习惯性,请保证实验黏性及持续时间

解释:实验黏性 (sticky)指的是实验流量中的 pv 分配固定,单个用户每次都被分入相同分组。实验的持续时间建议至少3天,一周左右为好

某公司日常(6)
前端:正常情况下,应该使用黏性的实验抽样。

原因:在页面改版后,用户可能有一段时间的学习过程和习惯期,显示为数据的下降,以及缓慢回升。

具体做法:当某个用户中抽样时,本地记录(localstorage)他的抽样情况,下次他进入同样的页面,读取记录,进入同样的分组。

五. 如何分析实验数据,有哪些数据需要重点关注?

如文章 2.1 提到的,重点关注一个目标,并选择其它几个目标作为辅助,以免走偏。

常见的目标为:pv, uv, 首屏按钮点展比,广告点展比。

六. 附:如何搭建前端实验项目,以 mip-experiment 为例

mip-experimentMIP 开源项目中的一个组件,从零搭建了一个前端抽样的实验系统。抽样系统实现了上文提到的抽样功能:

  • 用户分组
  • 实验黏性设置
  • 分流量抽样,分层抽样
  • 实验空转
  • 实验AB样式设置
  • 实验反转

除此之外,mip-experiment 还与 mip-pix 和百度统计深度整合,实现了统计功能:

  • mip-pix 将实验数据拼装在图片 URL 中,将请求发往站长服务器,由站长自行统计。
  • mip-experiment&百度统计 通过配置,可将请求发送到百度统计后台,实验数据可在百度统计->访问分析->事件分析中看到。

mip-experiment 的源码可在 github 上找到,有建议可以提 issue 给我。

MIP 官网也使用了mip-experiment 做实验,现在正处于空转阶段。实验完成后将发出整体实验的流程和结论。

文章作者:Jenny_L
转发自Jenny_L 的简书

【转】AB实验设计思路及实验落地的更多相关文章

  1. AB实验的高端玩法系列2 - 更敏感的AB实验, CUPED!

    背景 AB实验可谓是互联网公司进行产品迭代增加用户粘性的大杀器.但人们对AB实验的应用往往只停留在开实验算P值,然后let it go...let it go ... 让我们把AB实验的结果简单的拆解 ...

  2. 实验五 含有控制信号的计数器VHDL设计

    一.实验目的 学习计数器的设计.仿真和硬件测试,进一步熟悉VHDL设计技术. 二.实验仪器与器材 计算机1台,GW48-PK2S实验箱1台,QuartusⅡ6.0 1套. 三.实验 1. 基本命题 在 ...

  3. 实验四 Python综合实践

    课程:<Python程序设计> 班级:1843 姓名:章森洋 学号:20184307 实验教师:王志强 实验日期:2020年5月16日 必修/选修: 公选课 1.实验内容 此处填写实验的具 ...

  4. Verilog HDL那些事_建模篇笔记(实验一,实验二)

    实验一:永远的流水灯 扫描频率配置为100Hz,即是说扫描周期为10ms.这里需要注意的是扫描周期的概念.流水灯嘛,顾名思义,扫描周期指的是流水灯扫一轮所需要的时间.听到说周期,就应该想到在建模的时候 ...

  5. 实验十四_访问CMOS RAM

    编程:以"年/月/日 时:分:秒"的格式,显示当前的日期,时间. 注意:CMOS RAM中存储着系统的配置信息,除了保存时间信息的单元外,不要向其他的单元写入内容,否则将引起一些系 ...

  6. 实验10.3_数值显示拓展_dword型数转变为表示十进制数的字符串

    assume cs:code data segment db 10 dup (0) data ends code segment start : mov ax,4240H;F4240H=1000000 ...

  7. 机器学习实验报告:利用3层神经网络对CIFAR-10图像数据库进行分类

    PS:这是6月份时的一个结课项目,当时的想法就是把之前在Coursera ML课上实现过的对手写数字识别的方法迁移过来,但是最后的效果不太好… 2014年 6 月 一.实验概述 实验采用的是CIFAR ...

  8. 2018-2019-2 20175234 实验一 Java开发环境的熟悉(Linux + IDEA)

    目录 20175234 实验一 Java开发环境的熟悉(Linux + IDEA) 第一部分 代码及运行结果截图 第二部分 要求 代码及截图 第三部分 题目 需求分析 设计 程序及运行结果 问题和解决 ...

  9. Class_third_实验报告

    设计思路:声明一个父类Shape并声明一个getArea()计算面积的空方法让子类Circle,Echelon,Triangle,Rectangle 继承父类的方法并根据类的不同重写getArea() ...

随机推荐

  1. svn Server sent unexpected return value (403 Forbidden) in response to CHECKOUT

    今天,提交資料到公司svn服務器,但是一直提示 Server sent unexpected return value (403 Forbidden) in response to CHECKOUT ...

  2. golang 二进制转十进制实现方式

    golang 二进制转十进制实现方式 直接上代码 package main import ( "fmt" "math" ) func StringToIntAr ...

  3. Oracle解锁表笔记

    1.查询被锁的对象: select object_name,machine,s.sid,s.serial# from v$locked_object l,dba_objects o ,v$sessio ...

  4. Maven打包详细流程

    方法一:cmd 控制台打包(比较不推荐) 首先安装maven插件百度下载一个,配置环境变量什么的~在cmd控制台能mvn version能有数据出现. 打包只需要到项目的根目录下~在cmd敲入mvn ...

  5. 基于DP的LCS(最长公共子序列)问题

    最长公共子序列,即给出两个序列,给出最长的公共序列,例如: 序列1 understand 序列2 underground 最长公共序列undernd,长度为7 一般这类问题很适合使用动态规划,其动态规 ...

  6. Servlet线程

    一,servlet容器如何同时处理多个请求. Servlet采用多线程来处理多个请求同时访问,Servelet容器维护了一个线程池来服务请求.线程池实际上是等待执行代码的一组线程叫做工作者线程(Wor ...

  7. Java开源生鲜电商平台-财务系统模块的设计与架构(源码可下载)

    Java开源生鲜电商平台-财务系统模块的设计与架构(源码可下载) 前言:任何一个平台也好,系统也好,挣钱养活团队这个是无可厚非的,那么对于一个生鲜B2B平台盈利模式( 查看:http://www.cn ...

  8. Spring 数据处理框架的演变

    欢迎大家前往腾讯云+社区,获取更多腾讯海量技术实践干货哦~ 定量分析的成败在很大程度上取决于采集,存储和处理数据的能力.若能及时地向业务决策者提供深刻并可靠的数据解读,大数据项目就会有更多机会取得成功 ...

  9. 剑指Offer常见问题整理

    1 在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数.(来自牛客网,剑指offer) ...

  10. Undoing Merges

    I would like to start writing more here about general Git tips, tricks and upcoming features. There ...