一. 概述

可视化实验,通过所见即所得的在线编辑(比如对页面中的图片、文字、颜色、位置等元素和属性进行编辑),降低在Web/H5页面优化的场景下,产品方和运营方使用A/B实验工具的成本,免除编码。 前置条件及限制
  1. 目前可视化实验支持在Web及H5页面开启。
  2. 用于创建可视化实验的页面需要接入「A/B 测试」的Web/H5/WAP SDK
  3. 页面传输协议需使用HTTPS(Hypertext Transfer Protocol Secure:超文本传输安全协议)。
实验类型: 可视化实验的实验类型为客户端实验。 浏览器建议: 主流的浏览器均可支持;iOS系统自带Safari浏览器支持iOS10及以上版本(若系统版本较低请升级到iOS10及以上)。建议使用最新版Chrome及Windows Edge。

二. 应用场景

可视化实验适用于落地页、主页等单/多页面优化的场景。
多页面可视化实验:在一个版本中可以包含多个页面,适用于优化前后有关联的多个页面。
通过可视化编辑器对文本、图片等元素进行编辑和替换,进而生成多个版本进行实验,探究不同方案的页面效果,如用户停留时长、PV/UV等。目前可视化实验支持的页面包括可接入SDK的自建Web及H5页面,暂不支持第三方工具搭建的页面。

三、操作演示

快速了解可视化实验创建流程

四. 可视化编辑操作说明

单页面可视化实验

点击DataTester的「进入编辑器」,即可进入可视化编辑页面。
模块 子项 操作说明
顶部导航栏 /  
内容 字体排版 支持对字号、颜色、文本内容、加粗/倾斜、对齐方式等属性进行编辑
样式 尺寸、布局、背景 尺寸支持元素尺寸相关CSS样式编辑
事件 圈选事件 针对「按钮」、「链接」、「图片」、「文本」类型的元素提供圈选事件能力。在编辑栏下,点击事件,新增事件名称;保存后新建指标:点击新建指标,会弹出指标新建页面。
HTML新增元素 / 支持通过HTML代码的方式新增元素。
(1)格式化 (2)换行和取消换行 (3)HTML代码格式校验 (4)手动输入标签,自动闭合标签 (5)优化默认初始化示例代码

多页面可视化实验

点击【添加页面】,可在一个版本中添加多个页面,可对每个页面单独进行编辑。
注:页面顺序不会影响用户浏览页面体验。举例,假如用户首先看到的是页面2,然后再看到的是页面1,用户仍然会看到同一实验版本的页面1。
 
多页面编辑:可在左上角切换至不同页面进行可视化编辑,具体可操作项同可视化编辑操作说明 。
 

一文读懂火山引擎A/B测试的实验类型(2)——可视化实验的更多相关文章

  1. kubernetes基础——一文读懂k8s

    容器 容器与虚拟机对比图(左边为容器.右边为虚拟机)   容器技术是虚拟化技术的一种,以Docker为例,Docker利用Linux的LXC(LinuX Containers)技术.CGroup(Co ...

  2. 一文读懂MySQL的事务隔离级别及MVCC机制

    回顾前文: 一文学会MySQL的explain工具 一文读懂MySQL的索引结构及查询优化 (同时再次强调,这几篇关于MySQL的探究都是基于5.7版本,相关总结与结论不一定适用于其他版本) 就软件开 ...

  3. 一文读懂HTTP/2及HTTP/3特性

    摘要: 学习 HTTP/2 与 HTTP/3. 前言 HTTP/2 相比于 HTTP/1,可以说是大幅度提高了网页的性能,只需要升级到该协议就可以减少很多之前需要做的性能优化工作,当然兼容问题以及如何 ...

  4. 一文读懂AI简史:当年各国烧钱许下的愿,有些至今仍未实现

    一文读懂AI简史:当年各国烧钱许下的愿,有些至今仍未实现 导读:近日,马云.马化腾.李彦宏等互联网大佬纷纷亮相2018世界人工智能大会,并登台演讲.关于人工智能的现状与未来,他们提出了各自的观点,也引 ...

  5. 一文读懂高性能网络编程中的I/O模型

    1.前言 随着互联网的发展,面对海量用户高并发业务,传统的阻塞式的服务端架构模式已经无能为力.本文(和下篇<高性能网络编程(六):一文读懂高性能网络编程中的线程模型>)旨在为大家提供有用的 ...

  6. 从HTTP/0.9到HTTP/2:一文读懂HTTP协议的历史演变和设计思路

    本文原作者阮一峰,作者博客:ruanyifeng.com. 1.引言 HTTP 协议是最重要的互联网基础协议之一,它从最初的仅为浏览网页的目的进化到现在,已经是短连接通信的事实工业标准,最新版本 HT ...

  7. 一文读懂 深度强化学习算法 A3C (Actor-Critic Algorithm)

    一文读懂 深度强化学习算法 A3C (Actor-Critic Algorithm) 2017-12-25  16:29:19   对于 A3C 算法感觉自己总是一知半解,现将其梳理一下,记录在此,也 ...

  8. [转帖]MerkleDAG全面解析 一文读懂什么是默克尔有向无环图

    MerkleDAG全面解析 一文读懂什么是默克尔有向无环图 2018-08-16 15:58区块链/技术 MerkleDAG作为IPFS的核心数据结构,它融合了Merkle Tree和DAG的优点,今 ...

  9. [转帖]一文读懂 HTTP/2

    一文读懂 HTTP/2 http://support.upyun.com/hc/kb/article/1048799/ 又小拍 • 发表于:2017年05月18日 15:34:45 • 更新于:201 ...

  10. [转帖]从HTTP/0.9到HTTP/2:一文读懂HTTP协议的历史演变和设计思路

    从HTTP/0.9到HTTP/2:一文读懂HTTP协议的历史演变和设计思路   http://www.52im.net/thread-1709-1-2.html     本文原作者阮一峰,作者博客:r ...

随机推荐

  1. Gitlab集成jenkins及docker自动化部署教程

    Gitlab集成jenkins及docker自动化部署教程 能实现提交代码到gitlab后,我们只需要合并代码到指定分支就可以上Jenkins自动拉取最新代码并重新构建部署 1.登录Jenkins点击 ...

  2. java: -source 1.5 中不支持 diamond 运算符 (请使用 -source 7 或更高版本以启用 diamond 运算符)

    报错信息:java: -source 1.5 中不支持 diamond 运算符 (请使用 -source 7 或更高版本以启用 diamond 运算符) 解决方案:如下 1.file --> p ...

  3. JavaScript高级程序设计笔记02 HTML中的JavaScript

    HTML中的JavaScript <script>元素 形式 行内 其中的代码会被从上到下解释.计算完成之前,页面其余内容不会被加载,也不会被显式. 外部 下载与解析都会阻塞HTML解析, ...

  4. Python利用pandas进行数据合并

    当使用Python中的pandas库时,merge函数是用于合并(或连接)两个数据框(DataFrame)的重要工具.它类似于SQL中的JOIN操作,允许你根据一个或多个键(key)将两个数据框连接起 ...

  5. 你真的了解@Async吗?

    使用场景: 开发中会碰到一些耗时较长或者不需要立即得到执行结果的逻辑,比如消息推送.商品同步等都可以使用异步方法,这时我们可以用到@Async.但是直接使用 @Async 会有风险,当我们没有指定线程 ...

  6. Codeforces Round #699 (Div. 2) A~C题解

    写在前边 链接:Codeforces Round #699 (Div. 2) 好自闭哈哈,\(B\)题暴力fst了,第二天改了一个字母就A了,第3题写了一个小时,然后又调了三四个小时,看不到样例,最终 ...

  7. UIPath初识和安装

    即使没有人为你鼓掌,也要优雅的谢幕,感谢自己的认真付出. 一. UiPath组成   学习UiPath,我们一定先要了解Studio,Robot和Orchestrator这3个重要组成部分. UiPa ...

  8. C#中HttpWebQuest发起HTTP请求,如何设置才能达到最大并发和性能

    在C#中使用HttpWebRequest发起HTTP请求时,达到最大并发和性能可以从以下几个方面改进: 1. ServicePointManager设置 ServicePointManager 类是一 ...

  9. 从ClickHouse通往MySQL的几条道路

    一.应用背景简介 ClickHouse 是 Yandex(俄罗斯最大的搜索引擎)开源的一个用于实时数据分析的基于列存储的数据库,其处理数据的速度比传统方法快 100-1000 倍.ClickHouse ...

  10. [THUPC 2023 初赛] 背包

    题目描述 本题中,你需要解决完全背包问题. 有 \(n\) 种物品,第 \(i\) 种物品单个体积为 \(v_i\).价值为 \(c_i\). \(q\) 次询问,每次给出背包的容积 \(V\),你需 ...