今天搞到了网易邮箱的内部设计稿(点这里看图),目前该页面还没有公开,凭着兴趣,简单的研究了一下,这里只针对旧版与新版之间的改变谈交互改进。

从表面上看,两个界面的变化似乎不多,但是新版的设计比旧版高出了一个档次。(点图放大)

首页新旧对比

先谈大的方面:
1.这个页面的主要功能是让用户登录,在旧版中由侧边栏承载功能。新版中将登录区域进行了集中,并在视觉上让该区域处于上层,特别是在登录框右边露出的那一点图片尾巴,带来的效果是不言而喻的。无论是形式还是视觉,都加强了冲击力,益于吸引视觉焦点。
需要注意的是新版中加的那个7月标记,这是一个非常隐蔽且好的的视觉交互。首先,邮箱是建立在时间轴上的,时间越长,内容越多,这里的七月图标,可以给用户一种心理暗示,让他们意识到自己有多长时间没有登录了。另外一个用处,注意看七月图标的上方,是“帮助”的链接,帮助对任何网站来说都是重要的,而这里的7月图标可以让人的目光很自然的从登录框引到帮助按钮上,让登录区域与小导航链接区域间形成微妙的的连带关系。

2.干掉了“超快速度”宣传点,也许是需求的改变吧。不过旧版中的宣传语言确实不怎么样:“页面响应时间最高减少90%”。语言也是交互的方式之一,这区区十几个字让人的脑袋转两三个弯,一会“最高”,一会“减少”,再加上一个“90%”,有够脑残的。
再仔细想一下,发现并不是那么简单,在旧版中,与“超快速度”一起的还有“海量存储”与“安全稳定(反垃圾)”两个宣传点。存储多与能反垃圾(安全)这两个特点是用户可以通过准确数值体会到的,而“快速”这个特点确只能是用户凭自已的感觉体会出来的。出于这种细微的差别,新版中在干掉老版的宣传点后,把“极速3.0”的概念直接印到了大图片上,并且用鲜亮的颜色不断给用户一种心里暗示。

再看细节方面:
虽然只是一个内容比较少的页面,在细节上的变化还是很有几处的,并且带来的效果还很大,咱们一个一个谈。
1 . 在“用户名”输入框后加了“@163.com”。鉴于最近有越来越多的网站是用邮箱地址登陆,加上这个提示标志后,确实能够让人一看就知道填用户名,而非邮箱地址。
2.将“忘记密码”的连接从一个独立的位置移到了密码输入框后面。这确实是一个不错的改进,让密码输入框与找回密码成为一个整体,即符合用户的行为操作流程,又容易寻找。相对来说,旧版的那个“忘记密码”就用得不是那么“顺手”了。
3.“@163.com”与“忘记密码”在新版界面中都放在输入框后面,在交互上保证了该区域的统一性,在视觉上使整体更加协调。想想盾,如果只有一个“@163.com”或“忘记密码”,那就显得很突兀。
4.“版本”下拉菜单中的“默认”变成了“极速3.0”,咋一看这里的改变显得没有什么,因为对用户来说,两种文字代表的意思他们根本不知道。但是,从用户体验的角度来看,这一步的改进非常大,因为“默认”是不确定的,“极速3.0”指待的却是一个特定事物。
5.刚才提到
5.干掉了旧版的“增强安全性”复选框。假设一下,手机上面有个功能“增强通话安全性”,你会不会用?旧版的这个功能更像是宣传噱头,可能只有1%的用户会将勾去掉。也许这个觉得这个功能的宣传效力太低,所以在新版给干掉了。
6.干掉了宣传画面中的“马上注册>>”。原因很简单,同一个入口在同一个页面内出现了两次。旧版中有两个注册,一个在宣传中,另一个在登录框下面。虽然这不算很差的交互,但好的交互会保证入口的单一性。
7.干掉了“登录网盘”的功能,原因与第6点有些类似。登陆网盘与邮件都是登录到同一个系统,只是进入了不同的标签页而已。但个人认为拿掉这个功能更像是需求改变的结果,也许是因为网盘已经不用宣传了,所以才拿掉的。
8.干掉了“登录帮助”的连接。这个确实没什么好写的,估计需要用到这种功能的初级用户已经很少了。
9.简化了很多语言,最直接的就是“登录”与“注册”两个按钮,将其它无关的文字全部去掉了。少了包装与宣传,因为“登录”或“注册”两个字,对于承载功能来说已经够用了。

 

本文评论 7 comments

  1. gravatar DIno 抢到了第 1楼

    改版,肯定是有进步的,关键是功能点和需求的变化。
    你发现没,导航也有变化,
    视觉上的惊喜,icon,bg的变化,更有速度感,和邮箱的速度有呼应;
    体验上变化也有,呵呵。
    bt分析的很仔细,让偶佩服佩服啊

  2. gravatar wettuy 抢到了第 2楼

    同楼上,分析的真是很仔细啊

  3. gravatar bts 抢到了第 3楼
    突然发现,原来还是很多交互没有被发现,现在已经将本文重新编辑了。
  4. gravatar 星星 抢到了第 4楼

    不错,不错 分析很透彻,期待ING

  5. gravatar willerce 抢到了第 5楼

    只用Gmail

  6. gravatar bts 抢到了第 6楼
    如果你用gtalk,那么就加我吧。
  7. gravatar 深圳瑜伽 抢到了第 7楼

    你好哇!你的博客很漂亮哇!!
    来踩踩喇!
    我是深圳的哟!

写下你的评论

交互设计

不断的提高用户体验

用例图

UML的组成部分

需求分析

一切的开端

生活娱乐

生活的思想轨迹

单机游戏

真正的游戏来自单机

杂七杂八

其它分类以外的有趣东东