牛壹周1.2神功之无敌风火轮

哪吒靠着脚下的一对风火轮驰骋于仙界与人界;金轮法王靠着他的大金轮横行于江湖;某大师用他的某轮忽悠了千万的信徒。行走于江湖的牛壹周当然不甘示弱,我们当然也有自己的神功和武器,因为它继承了哪吒脚下风火轮的速度,因此号称:无敌风火轮。

在1.1中,牛壹周受到传说中“一灯大师”的“一阳指”嫡传,让在座各位能够在血雨腥风的阅读江湖中轻松导航。不过,我们发先,一阳指的使用与现在绝大部分的导航具备同样的缺陷:导航时一只手必须先脱离ipad,方能施展拳脚(在牛壹一周上就是一阳指神功)。

两种操作ipad的方式

如果ipad放在书桌上或者腿上,这并不影响我们的使用。但是,当我们双手握住ipad时,离手切换文章是非常不方便的。于是我们想:我们在切换文章时能否手不离开ipad依旧能够轻松导航呢?我们参照日常生活中的实物,响应党中央“以人为本”的号召,构建了下面三种方案:

方案一

方案二

方案三

cool?我们来分析一下这三种方案的优劣:方案一类似老式电话机的转轮,手指无需长距离划动,松手后页面立即跳转,导航迅速。但是正是因为手指划动距离受限,我们需要在短距离上分布牛壹周的9篇文章,1张图片以及封面,封底和目录的导航,紧凑的分布会导致导航切换的不精准,即用户很难在这么短的距离内精确的定位每一篇文章;方案三类似于iphone上的日期滚盘控件和相机的前置滚轮,但是他不区分确定与取消,这在导航时出现误操作后非常不方便;方案二类似相机的后置导航滚轮,操作相对麻烦,手指移动距离比方案一大很多,而且多出了一个确定按钮,但是导航思路非常清晰:在转盘上分布牛一周的13个导航页面,手指转到某个页面后点击确定自动跳转。于是,我们采用了方案三。

选好了武器,但还要打造武器。我们花了一段时间让第一稿的轮子能够顺利的转起来并给出对应的角度信息。如果是一个程序员,也许会说,恩,最主要的部分已经完成了,剩下的无非就是link上页面,加上preview就OK了?对么?错!高保真原型的精髓在于最大限度的仿真真实场景的使用情形。

于是,第二版原型出来了。导航,preview的切换元素都具备了(虽然这里面只是两个图片的反复切换)。在这里我犯了一个错误,认为这个原型已经完全达到了高保真的需求,和真实场景的区别仅仅在于文章页面的跳转和13篇preview的切换。这个原型出来之后,团队内部分歧很大,很多人认为并没有达到想象的效果。

第二版原型

那天会议之后,我们决定再用一至两天的时间做出来一个完全真实的风火轮导航效果。终版孕育而生。这次分歧骤然降至为零,风火轮一致获得通过。

从程序员的角度,从第二版到第三版,甚至从第一版到第三版,程序架构改动是很小的,但是给我们带来的体验效果却是有着本质的不同的。可以看得出,保真模型模拟的真实度很大程度上决定了用户和tester对某个交互产品的直观感受,这也再一次验证了,交互原型的重要性。

最终效果

细节

  1. 在测试过程中,风火轮最初采用直接淡入的效果,我们发现,用户并不知道是它是可以转动的。于是我们在淡入的效果上加上了旋转,给用户以暗示;
  2. Go的按钮相对比较不明显,我们通过让Go在闪烁的方式给用户以提示;
  3. 虽然如此,Go由于在手下方,视线被挡住,于是我们在Preview的方框内也增加了“Go”的功能。

罗嗦两句:

如果你喜欢这本杂志和它的交互体验,请到苹果应用商店下载。

对于这本杂志有任何意见和建议,欢迎写信给我们,我们的邮箱是team+ipad@mycolorway.com,或者Follow我们的Twitter账号:@bullreader ,让我们一起阅读、触摸和设计,让她变得更好。

Tags: , , , , , ,

20 comments

  1. 小白网 说:

    去看看这本推荐的杂志

Leave a comment