Monthly Archives: 八月 2014

用户体验浅析

近年来,人们越来越多地谈及用户体验,甚至将其视为互联网产品赢得市场的最关键因素。但每逢说到用户体验是什么的时候,人们的表述往往抽象不清、或者以偏概全。本回答尝试从一个用户体验设计师的角度对相关问题进行梳理和探讨。

 

用户体验是什么?

用户体验(User Experience,简称UE)是用户在使用产品或服务过程中建立起来的一种纯主观的感受。
用户体验产生于客户与你的品牌、公司、组织所发生的一切互动。这些互动的对象包含了你的产品、官网、帮助中心、广告、微博、邮箱、以及面对面的交谈······甚至只是你产品上的一个小标签。所有的这些都会随着时间的积累而联系起来,形成用户体验。

 

如何评价用户体验的好坏?

业内很多人其实没有搞清楚,当他们在评价用户体验时,评价的实际上是产品的可用性。在没有意识到这一点的前提下,得到的观点往往不够结构化,对实际工作缺乏指导作用。
确切地来说,产品的可用性包含三个方面:有用性、易用性和满意度。

 

有用性

有用性跟产品策划相关,指的是产品所包含的功能是否能够满足用户的需求。用户的需求包括显性需求和隐性需求,显性指的是主需求和关联需求,而隐性需求指的是潜在需求。那么,在提高产品的有用性方面,是不是满足的需求越多就越好呢?显然不是的,需求要满足到什么程度,得结合产品的易用性进行权衡,找到一个你认为合适的点。满足的需求太多将会导致产品变得臃肿,对其性能和用户的认知、操作带来负面的影响。
要对一个产品的有用性进行评估,其实是一件比较困难的事情,它要求你对该产品或与它相似的产品有着足够深入的研究。

 

易用性

提高产品的易用性是交互设计师的工作,易用性又包含易学性和效率性。
易学性指的是用户在接触一个新产品时,最好不用学习也能懂得怎么使用,也就是很多人所说的用起来很“自然”。所以再次强调,如果没有搞清楚我们谈论的用户体验实质上是指产品的可用性,则很容易混淆概念,陷入对其某个构成点的讨论。但是,如果只是这样介绍易学性,显然还不够直观,其真正的内涵是指产品的设计要符合用户的心智模型。要做到这一点,产品的交互设计应该做到符合用户的操作习惯(并非指完全遵循各操作系统的交互范式,因为用户可能对一些非官方的操作范式已经十分熟悉;也不是说绝对不能打破已有的交互范式),或者根据现实的对照物给予用户足够的隐喻。
效率性的内涵则包含易于操控(菲兹定律)、步骤简便(完成任务的点击数)、清晰的导航(时刻知道自己在哪里,不迷路)。

 

满意度

用户最大的满意来源于产品为其提供的价值(有用性和易用性),但除此以外还包含产品在性能、视觉和彩蛋方面的体验。性能指的是产品对用户操作的响应速度、出错的频率以及严重程度;视觉指的是由眼球直接获取的愉悦;彩蛋则是给予用户一些惊喜或者意想不到的小感动。更进一层的话就是多维度的情感化设计,让用户与产品发生情感关联。

 

可用性评估

可用性评估的方法有很多,在这里只简单介绍最常用和高效的两种:启发式评估和用户测试。
启发式评估指的是若干名用户体验设计方面的专家(你自己就是- -)以角色扮演的方式模拟典型用户使用产品的场景,利用自身的专业知识进行分析和判断,从而发现潜在的问题。这种方法成本比较低,而且快捷,但是缺乏精度。
用户测试指的是邀请若干名典型用户在用户体验设计师的观察和交流下完成设定的操作任务(最好能够对屏幕和用户分别进行录像),根据对测试过程中用户的生理暗示(动作、神态)、语言反馈和操作流畅度进行分析,从而发现产品设计的问题。
其它的评估方法还包含问卷调查、用户访谈、和性能测试等等,在此就不一一介绍。
至于用户体验是否可以量化?答案是肯定的,主观的问题也能通过大量的测试进行量化,要深入了解这一块的话,可以学习一下调研方面的知识了。

 

 

扁平化设计原则

设计社区不停讨论关于扁平风格,这种风格很带感。但大多数设计师不能彰显这种风格,或者直接讨厌这种风格。我很实际,创件有用的设计才是好的设计。由于最近流行的扁平风格,而去设计这个风格,但它不适合所有的项目,所以别硬套这种设计风格我们来看一下,这有五个很独特的扁平风格的例子。我们分析一下,再”戏说”一下什么叫扁平化设计风格。

去除特效

Flickr_landing

Shift Landing Page

扁平化设计以其形命名。平的设计就是其独特的二维风格,简单地平。

这一概念点缀— —阴影、棱台、压花 、渐变或其他工具的添加深度工作。每个元素或框中,从图像帧到按钮的导航工具,是脆,缺乏羽化的边缘或阴影 。

不添加额外的元素并看起来更加逼真,不同于skeuomorphic设计项目中使用技巧来使元素更逼近3D 。扁平化的图层在反映在其他项目中,不设计另类的背景图片、前景图像或按钮、文本和导航 。

那么它是如何工作的捏?平面设计有独特的外观和感觉,但没别的了。它需要设计明确的层次结构和元素放置,使用户可以更加容易专注项目,理解交互。虽然越来越多的网站使用扁平化设计风格,或许移动设计和应用中的风格更受欢迎。较小的屏幕占用,少的按钮和选项,让扁平界面的应用使用起来嘎嘎容易 (so easy?)。

简元素

Flickr Redesign

Dailyquotes Screen

Vanillla Wip 2

平面设计使用一些简单的用户界面元素如按钮和图标。设计师只需找些简单的形状,如矩形、 圆形或正方形,保持每个形状孤立。形状边缘可以完美地方角化或者包含一点点曲率。

每个 UI 元素应该只是简单和容易单击或切换。对用户很直观的互动,没有一些为设计而作的过度设计。

除去简单的样式,鼓励大胆的去可点击的按钮上色。但不要混淆简单元素和简单设计,扁平设计的概念也可以像其他设计方案一样复杂。

需要获得帮助开始你的设计吗(译者注:下面是广告)?Designmodo 提供了各式各样的 UI 工具包使用平面样式 —— 从 Square UI FreeFlat UI Free,包含一些简单的 PSD/HTML 用户界面工具包与基本组件,到Square UI 和Flat UI Pro 完整打包 PSD/HTML 用户界面包的网站和应用的设计项目。

专注于版式

Tour Page

ESL - Landing Page Design

扁平化设计

由于元素在平面设计中的简单特性,排版是极其重要的。

字型的定格应和整体方案的设计相符— —高度点缀的字体可能看起来奇怪反对一种超简单的设计。使用加黑字体和简单地和高效的单词来使最终产品具有一致性,可以在可视化方式和文本上作些努力 。

考虑一个简单无衬线(sans serif)类型族有很多变化和权重的主版式的使用平面设计的站点。添加一些别致的触点,一个新奇的字体来作为设计的元素,但小心别使用过火的专业字样 。

字体设计中还应该告诉用户如何使用该设计。标签按钮和其他元素增加引入的易用性和交互性 。

专注于色彩

Input Landing Page

扁平化设计

颜色是平面设计的很大一部分。不同于其他网站设计,扁平设计中颜色调色板往往是强调很多更亮 、更鲜艳。

扁平设计中的颜色 调色板的项目通常包含更多的 色调。虽然大多数颜色调色板最专注于两三种颜色,但扁平设计中调色板通常使用六至八个颜色。

扁平设计中色调趋向充满活力— —想想颜色转盘— —没有淡色或最纯色。初级和次级的颜色是最受欢迎的。另外,一些特定颜色的使用频率较高,在重复的扁平设计中,方位色,复古的颜色— —包括鲜肉色、紫色、绿色和蓝色— — 这些是较受欢迎。

简约的方法

Concept idea of banking app

Secret Stuff

扁平化的设计本质上是简单的,它与整体简约的设计方法相得益彰。 在网站的整体设计中避免太多花哨的东西。简单的颜色与文字就已足够。如果你要添加视觉效果,选择简单的图像。 有些零售网站,比如Svpply(见上),使用效果很棒的扁平化设计,这是将一些条目放在一个简单的背景上做到的。(提醒一下这些图片确实具有一些自然深度,但仍然和谐融入到整个扁平化的设计中)

“接近”扁平化的设计

扁平化设计

Realpixels

一个更多设计师都倾向于赞同的风格,就是“接近”扁平化的设计。 在“接近”扁平化的设计中,使用了扁平化风格的基本主题,但是一些特效被添加到设计方案中。例如按钮,可能包含轻微的梯度或者阴影。设计师通常挑选一种特效并专门用在一种“接近”扁平化的项目中。 这个风格,相对于一些扁平化设计背后的、无特效思想中的刚性,容纳了更多一些的弹性。 设计师们因为附加的深度和纹理而喜欢它。用户们喜欢它是因为,这个风格没有那么生硬,并且有利于引导适当的交互。另一方面,设计师们不喜欢它是因为,它以一种方式结合了两种风格,而这种方式可能缺少了对于一个真正风格的定义。

英文原文:Principles of Flat Design(注:图片稍有改动)