CAT | 可用性研究
本文地址:http://www.html-js.com/?p=653转载请注明出处,不要删除此信息
ABtest 前端搭建方法总结
一.前言.
入职第一天,我就接到了一个从来没有听说过的任务.这个任务就是做一个abtest,使用的是阿里巴巴的一个abtest系统,而且之前好像淘宝这边貌似没有人用过这个系统,所以我把这次测试的搭建和实现过程整理成文档,这样大家以后也好有个参考,很多问题也不必重复请教阿里巴巴的同事了。我觉得我已经够烦他们了,不过幸好他们很有耐心,让我在短时间内就成功搭建成功了这次测试。
二.abtest.
何为”abtest”?
顾名思义,就是ab 然后test,ab就是指两个不同的版本,我们通常称为a版本和b版本.a版本一般是指原来的版本,b版本指改版后的版本,这样约定可以在写代码的时候不至于弄混淆.这种情景通常出现在网站需要改版的时候,我们不能确定新版的网站是否会造成用户的抵制,这个时候,我们就需要做一个test来统计一下b版本的网页的改版是否是必要的和成功的.通常,abtest需要采集大量的数据,如果网站流量太小,这种测试结果没有任何意义,因为取样率不足以用统计学来解释test中出现的差异,有时候个体行为对结果干扰过大,所以在做abtest的时候一定要保证样本数量,同时还有一个要注意的就是分配方法.因为测试中涉及到ab两个版本,我们需要让ab两个版本随机显示给用户,但是又要做到比例对半分,也就是如果有10万个人来请求此页面,那么就要基本上是5万5万对半分.
abtest的示意图如下:
图 1 ABtest示意图
为什么写这篇文章
这几天被一个省市菜单纠结了,测试给我提了N多bug,都是关于省市联动菜单的,大家就省市菜单到底应该具有何种行为持有各自的异议,特别是我,跟大家观点都不同,当然也有不少常识性的行为被我忽略了,下面是我这几天的bug列表,其中大部分都是关于这个联动的,当然js上联动实现起来也不难,这里讨论的不是技术细节,不讨论如何实现,只讨论联动到底应该怎样才能让用户感觉自己在使用一个自然而然的产品.

我这个联动组件是在淘宝里使用的比较普遍的一个联动,不知道为什么问题还这么多,特别是我刚拿过来的时候,可用性极差.样式如下:

先不说这个组件有什么不好的,一个联动组件至少应该有这些基本的行为才能符合人的习惯:
(1),让用户一眼就可以看出这是一个做什么的组件.
(2),让用户在很短的时间内就可以熟练操作这个组件.
(3),可以保证用户的任何选择都不会引起数据的逻辑错误.
这是基本的三条,上面这个组件首先不符合第一条,不要因为我们一看就知道这是一个联动组件就行了,要把自己想象成一个从来没见过这种组件的电脑白痴,他第一次看到这个组件会认出来么,如果我是个电脑白痴,我会不会试着去点第二个和第三个下拉列表呢?然后才知道第一个可以点?看到的第一眼,如果我不做任何操作,我会知道这是干什么的么?
显然上面这个控件做不到这一点,他只是在旁边做了一个文字指示,但是用户仍然会困惑,特别是有三个下拉框,应该先点击哪个呢?会出现什么结果呢?
下面是点击第一个下拉菜单后的样式

选中省后,市出现了,但是第一个元素是空的,仍然没有指示下一步该做什么,其实世界上有很多人对此会手足无措,即使大部分人知道应该去点第二个,下拉后才会看到市的选项.
我们来做个改变吧
这样的组件不知道为什么被其他项目采用了,反正我们这个项目里,大家对这个组件很有意见,大家都踊跃提出意见,造成我的bug数目急剧上升,改了又改,大家还是不满意.
总结下吧,应该让联动菜单有哪些行为呢?
(1)需要在三个联动菜单中显示三个默认值,来引导用户,让他看一眼就知道这里是让你选省市区的,开始我们定的是显示三个”请选择”,后来觉得还是不够明了,分别改成了”省份”,”城市”,”区(县)”,这样用户看到这个组件的时候至少知道这里原来是用来选省市区的呀.我们把空白替换成了省份,城市和区(县)

(2)选择省后,城市下拉里填充元素,但是仍然显示一个城市给用户,而不是设置默认的市,这是为什么呢?有人说默认的省市区可以让用户更省力,可是上面说过了第三条我们要保证数据的准确性,不能设置任何默认值,以便获取尽量真实的用户地址,如果设置了默认的地址,用户直接点确定,当然这里是搜索,不需要太准备的数据,但是如果是在设置的地方,一定不能设置默认值
今天登陆支付宝,发现之前在某同事文章里看到的新的界面终于发布了,新的界面很漂亮,合理的运用了一些js特效,非常不错
下面就一起去看看都有了那些细节上的变化吧

这是个人中心的首页,可以看到,和以前的支付宝比起来更加简单明了,以前首页分布着各种功能链接,让人手足无措,现在功能都以图标的形式列出来,页面其他地方也不重复出现功能链接,简洁实用美观,字体的配色很协调,一点都不觉得别扭,左边的用户信息层很简洁,但是却表达清楚,余额用大号字体着重标出.

在每个页面右上角都有一个缩小版生活助手,鼠标移上去,会流畅滴滑下来,方便了操作

右边则有一个跟上面那个类似的滑动浮块,展开后显示的是账户信息,账户信息和功能导航是两种重要的导航,所以如此安排,在任何页面都可以立即进行操作,这种方式值得借鉴
27
关键词:网页键盘,淘宝导航链接的改进,这篇文章只是教程,下面再来一篇关于淘宝页码导航
3 Comments · Posted by admin in 前端开发, 可用性研究363 个打酱油的来压过马路
为了版面整洁,详细介绍请见:
http://www.coderbbs.cn/UED/taobao-nav.html
No tags
这是我的最初设计稿,呵呵

No tags
我是在十一月份初在Javaeye首页上看到淘宝开放平台的消息的,在初步了解这个平台后,我立即产生了好几个想法和点子,这都要归功于淘宝开放平台的特殊性和优越性.以前,考虑校内网之类的SNS的开放平台,盈利方面总是困扰着我,不能盈利的产品是存活不下去的.然而在top平台上我看到了清晰的盈利模式,例如:用户通过我的应用买下了某个商品,我就能得到提成.对于开发者来说,这种盈利模式简单明了,无需了解过多的商业运作知识.
之后我对自己的点子进行了细化,然后准备一一实现,我其实是想参加top应用大赛,争取获取大赛的创业基金,将自己的想法一步步实现并扩大.可是老天爷真会开玩笑啊,过了没几天我接到了淘宝网的电话,之后获取了到淘宝UED实习的机会,实习之后,时间显然不足以让我来完成自己的想法,可能会错过这次比赛,但是以后我会慢慢来实现它们的,而且我的女朋友也正在打算在淘宝开店,我想她会成为我的第一个客户的,呵呵.
这里我只拿我的几个比较宽泛的想法来谈自己对top平台的理解,为自己保留一条秘密,同时也跟大家分享自己的想法.
现今社会,很多产业都已经趋向于饱和,例如:超市行业.在南京,苏果超市占据了绝对地位.随处可见其身影,当然也有类似华联和家乐福之类的超市,但是好像有的话也很少,而且都是旗舰店,这是因为这些超市靠的就是利用规模来和苏果超市竞争的,苏果遍地开花,成百上千,而且也有不少旗舰店,在这种情况下,要想抢的一席地,只能靠规模和价钱来吸引客户.可是最近,在新街口出现了很多新型超市,上次和朋友去逛街了解行情,问了一下,原来他们都是从香港来的,问他们抢占市场的手段是什么呢?呵呵,看超市里卖的东西就知道了,总结起来就是一个新兴词语:垂直行业.香港人的确有商业头脑,他们超市里大多数卖的都是化妆品,当然也有其他东西,但是只是作为附属品而已,这和普通的化妆品店不同,他们卖的化妆品的包装上都印着他们公司的名称,类似贴牌生产,也就是他们公司跟各种著名化妆品公司合作,具体模式他们不肯透露,但是这种利用垂直行业来参与超市竞争的做法已经足以让我们恍然大悟了.其实在他们说出垂直行业这个词后我就立即联想到了互联网的垂直搜索服务,毕竟自己是做互联网的,其实互联网上也新兴起不少网站,靠的就是垂直搜索服务,现在百度和Google已经基本垄断了搜索行业,类似于超市行业,也只有像搜搜和bing这样的有着庞大后台的搜索服务才能参与一下竞争,瓜分一点市场,但是如果是个人或者小公司,想抢占搜索的大市场基本是不可能的,但是我们可以做垂直搜索,只搜索某一块,例如搜索宠物信息,搜索住房信息,餐饮信息,然后在此基础上添加诸多针对此领域的特殊服务,这点很重要,google其实已经提供了上述服务了,但是我们可以通过来提供更多个性服务来增加自己的竞争力.我其实也正在策划做一个公益性的垂直搜索网站,可能会争取到政府的资金支持,但是目前我除了我女朋友还没有跟任何人透露过,如果有人对此感兴趣可以找我讨论.
上面说了一大堆,其实就是一个词”垂直”.上次去东南大学参加阿里巴巴的笔试宣讲会,当时我去的有点晚,只听了一点点,其中看到某位老师讲淘宝的战略,看到了个性化店铺这个东西,记不得举得是哪个例子了,好像是个买衣服的,我觉得这种模式就是一种垂直的例子,虽然基本概念有点区别,但是将某种物品从淘宝独立出来,然后加以专门的修饰和提供相关的服务,这种模式和垂直行业也算有着很深的渊源.而这种模式正是通过淘宝开放平台来实现的.将某类商品独立出来,然后加上一些特殊的服务,我觉得在垂直领域,后面的这一条显得更为重要,例如:针对衣服,我们可以提供个性化印染,自己选择图案,自己选择颜色,自己决定大小,甚至自己设计衣服,在现在这种彰显个性的社会,这种服务显然更受欢迎.
利用上述的特性,我们可以做一些个性化强烈的行业,例如:礼品行业,在蛋糕上印上自己的名字,在日记本上印上自己设计的图案,家居行业,自己来设计自己的小家,在枕头上印上小两口的合影,自己决定家具的尺寸,甚至自己设计家具.看起来实现有点困难,只是提供一个思路而已,可以对照着淘宝上的产品分类来一一考虑.
其实我还有一个和上述思路完全相反的想法,上面是说垂直,下面就来说说整合,同样,我们拿现实世界来类比,其实网络就是现实的一个虚拟,我们完全可以拿现实中的成功案例来推导到互联网的模式,其实灵感的来源都是来自生活而已.大家有没有想过逛淘宝跟逛超市一样呢?如果你说你想到了卓越和当当,OK,是的,我说的大概就是这种体验,我们在商场选购东西,然后最后在柜台一起结算(不止如此,请继续往下看),省了挨个结算的路费和精力,超市就是这么诞生出来的,将各种商品整合在一起,我们只需要逛一趟超市,OK,一切生活用品都搞定了,卓越和当当的确类似这种模式.可是要知道,当当和淘宝完全是两种模式,淘宝是C2C,当当是B2C,当当实现这种模式是理所当然的,完全没有新意的,然而如果在淘宝上实现这种体验的话,是不是充满新意呢,我们终于可以像逛超市一样逛淘宝了,买了很多东西后,我们可以一起付款了,运费我们合起来算,(忘了强调一点了,这里的运费一起算,不是类似淘宝的那种结余的模式,而是像我们买了10件商品,每一件从不同的商家买的,都是很轻的东西,加起来的运费其实和单件的运费一样多,如果是平常,我们要付10份运费,而如果我们只需要付一份运费呢?这正是我这个方案的好处所在,也正是其重点所在)
刚才强调了这个模式的重点,那就是为购买者节省邮费,那么如何来实现这种模式呢,怎么将不同的商家整合在一起协调邮费呢?当然让商家自己去协调是不可能的,我们需要即时性,也就是不能等着打击去协调,我们需要一个中间平台,将邮费这一块独立出来由我们处理.听起来有点混乱,的确要实现整合很困难,我思考了很久,想出了一种方法,但是不太成熟,在此基础上有很大的发掘空间,这里就简单说说:(下面用”我”来代指开发商或者服务提供商)
首先,我要整合的商家必须是某一个地域范围内的,因为我要协调所有的商家,在此我要能够及时联系他们,及时提货,这类似一个的确商业联盟.
我充当中间服务商,我建立一个平台,显示所有加盟的商家,他们都是我这个城市的,他们的商铺涵盖各种领域,我们整个加起来就类似一个包罗万象的超市,应有尽有.
买家来到我们的平台,通过平台浏览各种商品,买下各种商品,这些商品的标价中均不包含运费,最后买家要结算了,他在结算界面会发现我们为他计算好的邮费,这些邮费是我们根据商品数量和重量计算出来的,如果买家不满意可以协商,注意,这里的运费绝对比平常在多家店铺买东西后的叠加运费便宜的多,买家确定提交,付款后,我负责为买家收集商品,我会联系各个商家提取商品,然后最后一起发货快递到买家地址.在此中间有多个环节可以盈利,首先是平台的广告费,然后是邮费中可以抽取出一部分费用,然后还有向加盟商家收取费用,我们帮他们卖出了更多的商品.
这个想法不是一个人可以实现的,需要形成一个产业链,而且我的想法也并不是非常成熟,只是临时性想法而已,我只是在朝着一个方向考虑问题,一个是垂直,一个是整合,任何产业发展到一定阶段都要经历到这些变革,淘宝也需要我们去改变它.
淘宝开放平台对于开发者和运营商来说绝非只是一个应用平台,我们完全可以以此平台为基础形成一种新的商业模式,形成一种新的产业链.个人开发者可以做一些小的应用,有趣的应用,无需太多人力的工具来吸引用户,利用淘宝开放平台提供的基本盈利模式来盈利,团队式开发者则可以考虑提供更多个性化服务来吸引用户,企业开发者则可以考虑将自己现在的业务和淘宝开放平台整合,形成新的产品体系.
每个开放平台的潜力都是无限的,它给开发者提供了足够的用户来源,我至今还记得当年facebook开放自己的平台的时候的诸多争论,现在一切都证明,这种举措是无比明智的,它方便了用户,也方便了开发者,给用户提供了更方便的应用,给开发者提供了足够的用户基数.总之,淘宝平台一定会跟其它平台一样红火的,而且借助它的特殊身份和特性,毕竟成为将来几年内的行业领导者.最后祝淘宝开放平台越来越完善,带领着一大批开发者走向充满希望的明天.谢谢赏光.
2009年11月16日1:25:55 孙信宇 写于 杭州
No tags
呵呵,作为测试页吧
No tags



