网易应用下载站WEB端GUI设计的小分享

前言：

网易应用下载站WEB端开发进度日渐收尾，伴随陆续的测试优化工作，借此机会浅谈一下GUI设计实践上的皮毛经验。网易应用的特点在于服务用户下载应用和社交分享，因此GUI的设计作用在于把用户交互体验抽象化任务流程和操作方式表达得尽量准确尽量自然：

Ⅰ。样式的意义

例a.不要分散用户的焦点注意力：

GUI设计中不应该分散用户对自己任务目标的注意力。不要让人们总是去考虑他们正在使用界面。任务操作应该在用户意识的背景中，而不是前景中。这便是整个界面的设计定稿所在。首页的主要任务有观看应用、下载应用、观看应用推广。五光十色的应用图标和广告陈列在页面上，使用简易清新素色调界面可以调和色彩浓烈带来的疲劳感，而且使应用图标本身更为突出。

例b.不为视觉而设计：

在第一屏内的背景使用了浅灰色渐变背景色并不是纯粹为视觉而做。考虑到头图切换色调的多样性，白色底、黑色和深灰色底、饱和色底图最为常见，假如用白色背景，那白色头图融为一体，切换区和预览大图被分割为2个部分，页面断了。例如：

头图加框又稍感画蛇添足，画面感细碎。

可见用一个浅灰色底背景解决了头图替换成白色的问题，相比以上效果切换区和预览大图更为整体，版块感更强。这样头图切换不同的大底色都可即清晰又整体，背景底色即有单一色值，头图与背景色值相同的情况就极为个别了：

Ⅱ。整体统一化

用户界面应当有利于使用习惯的培养。当使用交互式软件或者电器时，用户希望尽可能快速地进入潜意识习惯。他们希望能忽略软件或者设备，而将注意力集中在他们的任务工作上，软件越一致，用户就越容易使用。界面控件亦是如此，它们的不一致也会迫使用户不断的考虑，因而分散了用户对任务的注意力。

例a.UI组件库的优化

初稿中的组件较为凌乱，可见按钮随意三种样式的色调，渐变，大小字数皆不统一。关闭弹框符号的小叉也风格迥异。