本文写于看完《瞬间之美》的前三部分,即如何让用户在30秒内爱上这个网页。主要将书中提到的知识进行使用分析。
决定一个用户是否停留在你的网页上继续浏览和使用,也许远比30s的时间要短。事实上我本人基本只会用10s内的时间,进行判断出这个网页到底是不是值得我停留。时间并不重要,只能说明你必须以最快,更快的方式让用户喜欢上你的网页。
简书算是国内一眼看上去比较让人喜欢的网站了,清爽的设计风格,简洁的排版。那么就来说说它。
总体风格:Metro UI
Metro,又或者我们叫它windows 8设计风格,起源于瑞士国际主义设计,纯粹的平面设计风格,哈哈二次元的设计风格(just joking)。可以说,相当于windows上的扁平化设计。这是一种与现实世界泾渭分明的设计风格。
我们对Metro的第一印象大概会是windows 8的那一个个令人心烦的色块。Metro风格的特点是去情感化(当然这就变得有点不近人情)、严格的网格式排布。对质感作最大限度的抽象化(这点与IOS的拟物化设计是两个极端),高光、阴影这些元素全部舍弃。以表现内容为主要目的和设计方向,并且这个内容是流动的。
Metro非常适合那些以文字为主要表现内容的网站、app。因为它们要做的事,往往就是让阅读内容这件事简化、再简化。
简书作为一个阅读文字、写作文字的网站,它主要承载的就是内容。因此它采用Metro UI的设计是合适且聪明的。首页上左边一列是导航,右边信息的部分看不到任何的图片,中间一张照片将两部分分隔开。非常简洁漂亮,谁说你一开始用它的原因,不包括它带给你的modern感呢?
引导用户视线,注册按钮在哪里?
古腾堡图表显示,用户的浏览习惯是从上到下,从左到右。因此用户在粗略扫描网页上的内容时,视线会沿着从左上到右下的对角线。因此左下角和右上角是视觉落盲点。这又叫做对角线平衡,如下图。
从简书首页导航上的按钮,到图片,再到右边大块的文本列表区域。简书使用了砖红色,将这三部分连成一个对角线,刚好是用户扫描一眼会看到的路径。
那么来看看这条路径的内容:导航、文章内容。
作为一个网站的首页,我想吸引人注册是最首先要考虑的。而简书的首页,你需要找好一会儿才能看见注册的地方。如果换了我,一定会把注册按钮(即写文章的按钮,这个导航的名字下个部分内容再讨论)放在对角线上。在用户的视线里多刷几次脸熟,总是会增加用户的注册概率的不是吗。我也忽然发现,从2013年我第一次关注简书开始,居然耗时两年多我都没有注册这个网站。也许这是其中一个原因。
导航:可以更精简
合理的导航组织和布局,是引导用户找到他们想要东西的非常关键的一部。
来做个游戏,数数看你能在简书的首页上找到多少个“写文章”的按钮(当然,我指的是已经登录的情况下)。
答案是三个。一共有3个写文章按钮,我的主页、我的收藏、提醒、简信、设置、登出分别都是2个。值得注意的是,后五个的排列顺序是以相同的方式出现在左下和右上的。——so what are you trying to express?
信息量太大我看不懂啊……
我的主页、我的收藏、提醒、简信,这四个功能属于常用功能。放在一级页面的便捷性显而易见,在右上角的二级菜单也重复一次有点冗余了,这和简书本身的极简风格不符。
显示模式本来应该是设置的一部分,其中字体的设置、简繁的切换应该不是常用功能。那么唯一让它留在外面的理由应该就是那个日夜间模式的切换了。但你完全可以做成一个更加便捷的按钮——如果这个功能使用得这么频繁的话。
登出功能,应该不是网页希望用户做的一个操作。那么放在右上角的二级菜单里面就应该够了。
再看写文章功能。这个功能页面上有三处入口,分别是左上,图片底部、右上的二级菜单。1.同一个功能,分别叫做“写文章”“提笔写篇文章”,一个页面上就缺乏一致性了。2.提笔写篇文章,这几个字并不会让你的按钮变得更加文(zhuang)艺(bi),反而显得很啰嗦。3.右上角二级菜单的写文章按钮我想不出来使用情景,因此质疑它的存在意义。
简书的导航,我看起来就像,生怕用户不知道这个导航在哪里一样。233333
标签云&标签
《瞬间之美》里面提到了标签云的使用。即根据热度让标签像不同大小的云朵一样显示出来。
简书的标签也是大小不一的,但我想,那只是因为字数长短不一样吧。
那么简书有没有必要使用标签云呢?
标签云的好处,是能让用户对于这个系统中其他用户的使用有一个大概的估量。有时候你得承认,这对人云亦云的用户来说是很贴心的。标签云的坏处,是需要一个养成系统,用于养成用户潜意识中那些大的标签表示的是热度高的标签。也许你会说,那么在标签云下面加一行字:the bigger, the hotter.不就好了吗?得了吧……那一点都不性感。
你总是需要知道标签云中那些大的标签,为什么是大的。而强迫用户进行思考,在任何情况下都不应该。
简书首页,今日看点下方有一些标签。这些标签是用来分类下方的文章列表的。这个情况下用户并不需要知道这些标签的热度(我反而比较想知道为什么这些标签会出现在我的首页上,我并没有关注过它们!)
不同tab页下的展现形式不统一?
图1.1,没有文章摘要,多了左侧的圆圈序号。
图1.2,有文章摘要,没有左侧的圆圈序号。
我并不能理解这样设计的意图。还有待进一步研究。
更多简书细节的问题。
用了简书写一篇文章,发现交互上的问题还是有的。当然也可能是我太low,比如我至今没找到如何将置为标题的文字重新变成正文。比如书写超过一页之后我几乎每三行就要动一下鼠标来拖动页面。其他的页面也是。留待进一步学习之后进行研究。
后记。
看别人的网页总是轻松,但自己做的总是糟糕的一塌糊涂。前阵子总有用户告诉我,找不到新增的入口,找不到这个,找不到那个。下次一定要在用户发现问题之前,自己先发现才好。