关于提升界面视觉信息层级方法及必要性（1）

一、重要性

说到视觉信息层级的重要性，就不得不说结合我们的工作重要性来说。

我们的工作担任整个产品构成到上线（由抽象概念到具体界面）的“表现层”。肩负着与客户接触的最后一道工序，我们的主要任务就是把交互设计师提供的交互原型线框图设计成大众接受的美观界面，以保证用户在使用产品时有非常好的初始印象同时留下强烈的品牌记忆。

ps：核心目的——商业价值的最大化

设计应当符合设计目的，不应只追求艺术效果

这就需要我们需要建立正确的价值观，不要因为设计而设计，要知道为什么这么做，对商业的价值是什么。

说白了我们在做任何设计的时候，需要考虑的是：

用户想看到什么（初步行为），以及我们想让用户看到什么（诱导）

结合我们的工作职能总结为：

视觉界面设计关注的是如何处理和安排可视元素，传达行为和信息。

视觉设计者做的是设计的组织、视觉暗示、启示用户行为的交流模式。

合理组织、处理、安排界面元素，便是我们今天提到的：建立界面视觉信息层级

二、意义

1、可以提升用户获取和理解信息的效率

建立良好的信息层级，能让用户在有限的时间里，快速获取和理解有用、感兴趣的信息，并产生下一步行为。

2、可以提高设计师的专业性

设计师有意识的分析信息优先级，了解哪些视觉表现手法可以建立信息层级及每一种方法背后的理论依据，不仅仅凭感觉设计

三、什么是有效的视觉层级

左图为手机拍摄照片，右图为经过我处理过的模拟眼睛焦点阅读的照片

我们可以看出，利用设备拍摄时，我们采集信息的模式是一次性完成的。拍摄时统揽界面中的所有信息。但是当人对信息的采集模式时，是根据眼球的移动，按照一定顺序获取信息。不能统揽页面所有信息，当眼睛焦点在那里的时候，才可看到哪里的信息。

设计师需要考虑的就是让用户通过眼球移动，按照一定的顺序获取信息，帮助用户高效自然获取和理解信息。

强烈的视觉层次感是通过界面上视觉元素提供清晰的浏览顺序来实现的，也就是说，用户每次都能按照同一个顺序浏览同一些元素。

四、建立有效的视觉层级的前期分析

UI设计是科学与艺术结合的综合技能。在考虑如何建立信息层级前，我们必须知道什么是重要的，以及背后的逻辑是什么。

比如一个音乐播放页面，在看似简单的上一首，暂停，下一首的按钮设计中，按钮的大小，彼此的间距都关系到用户的点击效率和操作难度。

我们应该谨记，设计应当符合设计目的，不应只追求艺术效果。好的设计师做出来的界面，一定是在产品逻辑合理下安排的信息层级合理的界面。

建立有效的视觉层级前，进行如下几步的分析：

1、 页面定位（帮助分析）

用户是谁

用户来自哪里，即从什么渠道来到该页面

页面内容定位，提供什么、不提供什么

页面作用

2、 信息优先级

一级信息吸引用户

二级信息帮助理解

三级信息详细理解

3、  用户核心行为

行为最终导向

了解，有意愿（导向）

了解更多细节（最终导向）

下篇文章我将针对淘宝详情页进行具体分析，按照我上面提到的步骤分析，进而推导出他为什么会做成这样，以及用到的方法都是什么。

thanks