交互设计实用指南系列(5) – 突出重点,一目了然
作者:宗羲 来源:taobaoUED 时间:2010-01-11 21:05:00
看到这张照片,我们一眼能够看到天宏(图中这位UED俊男)的眼睛。我们能从他的表情里读出一些他的性格。一张好的摄影作品,最重要的一点,就是这个照片是否有焦点,照片的主题是否一目了然。而摄影作品的用光、构图、景深等等手法,其实就是在让一个照片能够有其焦点,并且利用这些艺术手法来烘托气氛,提升主题。 一个优秀的页面亦如此:应当突出重点,一目了然。相信大家也知道,一个用户在浏览网页的过程中,只是扫描页面,而不会像是在看书似的阅读每一处地方,每一行文字。一个网页呈现在用户面前的时候,应该在5秒之内,就能理解:这个页面是干什么的?我大致能通过这个页面做些什么?接下来我该去哪里? 我们网站上的每个页面都可以是任务流上的一个点。这个点上包含着用户需要的信息,也许是继续找到任务流的下一个点的信息(例如导航),也许是用户想找到的最终内容。而一个页面上存在着上百甚至上千个链接(淘宝的宝贝详情页面通常有700多个链接),要在这样茫茫大海中找到用户需要的链接,可见,“突出重点,一目了然”是多么重要。
测试您的页面
测试您的页面是否达到“突出重点,一目了然”,能够让用户在短时间内找到他们所需要的信息,其实可以是个低成本的小型测试。fivesecondtest.com 这个有趣网站是一个专门做5秒测试的站点。测试者上传一张站点的截图,然后被试观看截图5秒,然后说出刚才看到了哪些东西。另外一种方式是被试看到截图,在5秒的时间中,点击他所关注到的所有焦点,最后给出每个焦点他认为的描述。
下图是本文开篇的时候,8个用户的测试结果:
这种测试比起眼动议来说,测试的成本要低得多,而且能够明确得测试出你的页面的浏览者是否能在第一时间发现他们所需要的内容,并且可以比较出,这是否符合你的设计的初衷。