微信小程序参数化AB测试

当下,微信小程序凭借其轻便灵活、推广迅速的特点,快速占领互联网市场,形成了很强的用户粘性。小程序的体验效果及转化率也成为企业关注的重要KPI之一。

云眼为小程序AB测试提供了参数化功能,相比于传统的全栈API,它的特点是将小程序中的页面元素、算法规则等动态化,而不是“写死”在代码中。比如,界面的图片、导航栏及产品列表内容等,皆可通过修改配置信息的方式,实现动态调整,而无需修改代码。运营人员无需技术人员支持即可通过云眼编辑器完成AB测试的配置和实施,非常简便、高效!

小程序参数化的基本流程主要包括整体设计试验配置、编码实现结果分析等。

一、整体设计

1.产品经理和运营人员根据业务需求,确定需要参数化的界面及元素

在进行小程序参数化AB测试之前,需要规划好哪些内容可能进行优化和调整。对未来可能进行AB测试的元素,进行参数化布局。后续无需频繁的编辑代码,即使某些区域最终没有进行AB测试,也不会受到影响。例如:我们提出假设,轮播图的播放速度会影响用户的点击率,则我们需要参数化的对象就是页面中轮播图的播放速度。

2. 产品经理和运营人员确定试验目标

目标的选择往往是和业务指标相关的行为,比如按钮、链接或图片的点击等,要把可能用来衡量试验结果的目标尽可能都考虑进去。我们要测试轮播图的播放速度对用户点击率的影响则每一张轮播图的点击都视为触发一个目标。

3. 形成AB测试设计要求

将具体的设计内容和要求形成文档,提交给技术人员,准备进行参数化AB测试的编程工作。

二、试验配置

1.创建试验并配置变量

首先创建一个全栈优化方案,进入编辑器,点击“创建变量”按钮,我们创建一个名为“Carousel_interval”的变量,类型我们选择“String”类型,默认值我们随意填写一个值,例如:3000,然后点击保存。

保存成功后,我们需要将创建的变量添加到优化方案当中,只需要点击该变量后面的“+”号既可,添加完之后,我们可以为各个版本填入不同的值,例如:原始版本:3000   优化版本:5000。如果需要将变量从优化方案移除,只需点击后面的“移除变量”即可。

2.创建并添加目标

在“设置目标”界面,我们输入目标名称“用户点击轮播图”,然后点击“创建目标”。同样我们需要将该目标添加到优化方案中,点击该目标后的“+”号。

现在我们变量和目标的创建以及配置便全部完成,然后点击“启动优化方案”,再点击最下方的“保存”按钮来保存所有设置。

三、编码实现

首先要在云眼平台下载SDK,在SDK下载与安装界面选择“全栈API SDK安装”,然后选择微信小程序,点击下载链接开始下载小程序SDK文件,下载完成后将SDK文件eyeofcloud.min.js和包装文件eoc_manager.js加载到项目当中,其中包装文件eoc_manager.js的作用主要是引入SDK并获取配置文件的信息,然后在需要进行参数化的页面当中直接引入eoc_manager.js,并实例化eyeofcloud。

注意:要将eoc_manager.js中的配置文件地址PROJECT_URL修改为自己账号的配置文件URL)

const PROJECT_URL = 'https://cdn.eyeofcloud.com/portal/editor/config/json/fullstack/927_2871f696077108fda7f01df49fab68bd.json'

1)参数化轮播图播放速度:

首先,定义初始数据。

const app = getApp()
var eocmanager = require("../../eoc_manager.js")
Page({
  data:{
   interval:3000
  }
})

然后,实例化eyeofcloud并调用getVariable接口获取配置文件的信息。

onLoad: function() {
var that=this;
//调用应用实例的方法获取全局数据
app.getUserInfo(function (userInfo){
  eocmanager.getInstance().then(function (eyeofcloud){
  //从配置文件获取参数化的元素值
    var interval = eyeofcloud.getVariable("Carousel_interval", userInfo.nickName, true);
  });
 });
},

最后,将从配置文件获取到的参数代替原来的值。

If (interval) {
  that.setData({
    interval:interval
  })
}

注意: 如果要参数化的元素是String类型,调用getVariable接口;如果要参数化的元素是boolean类型,调用getVariableBoolean接口。调用的时候需要提供3个参数,分别是参数化元素的名称(唯一且为英文字符串) 、用户ID(用户标识符)和布尔类型的true或false (一般情况下为true)。

2)跟踪目标具体实现示例,在目标事件触发时,调用track接口,需要提供2个参数,目标的名称和用户的ID。

clickSwiper:function(e){
  //获取全局数据并实例化
  app.getUserInfo(function (userInfo) {
    eocmanager.getInstance().then(function (eyeofcloud){
      eyeofcloud.track("用户点击轮播图",userInfo.nickName)    
    })
  })
},

四、分析试验结果

试验运行一段时间后,可以到云眼控制台查看运行过程与结果。

在一次整体设计和编程后,产品和运营人员即可直接通过云眼平台实施一系列AB测试试验。参数化功能降低了对技术人员的依赖,提高了AB测试的实施效率。

微信小程序参数化Demo

 

测试

 
免费试用,转化率提升就是这样简单快速 立即试用