第一章 用户体验为什么如此重要
用户体验指:“产品如何与外界发生联系并发挥作用”,也就是人们如何接触和使用它。
用起来难不难
是不是很容易学会
使用起来感觉如何
为体验而设计:使用第一
用户体验和网站
拥有更多的“产品特性”,被证明只能保持短时间的竞争优势。随着功能不断膨胀,网站变得越来越复杂,笨重,难以使用
用户体验就是商机
信息类网站
尽可能有效地传达那些信息内容。
一次优质的用户体验是将这些“偶然浏览者”转化成“实际购买人”
任何一个用户有可能掏腰包的网站上,都可以用转化率来衡量你的成果。
任何在用户体验上所做的努力,目的都是为了提高效率。
帮助人们工作得更快
减少他们犯错的几率
对于来造访的用户,必须为他们规划一个有粘性的,直观明了,甚至还让人愉快的体验---一次“每次事都按照正确的方式在工作”的体验。
第二章 认识这些要素
五个层面
表现层
网站来说,看到的是一系列网页,由图片和文字构成
图片等引导执行某种功能
框架层
表现层之家是网站的框架层:按钮,控件,照片和文本区域的位置
框架用户优化设计布局,达到元素最大效果和效率
结构层
与框架层相比更抽象的是结构层,框架是结构的具体表达方式。
明确哪些类别应该出现在哪里
范围层
结构层确定网站各种特性和功能醉合适的组合方式,特性和功能就构成网站的范围层。
战略层
网站的范围基本是由网站战略层决定的。包括了经营者想从网站得到什么,用户想得到什么。
基本的双重性
功能型的平台类产品
关注点任务---所有的操作都被纳入一个过程,去思考人们如何完成这个过程。
信息型媒介类产品
关注点信息---网站应该提供哪些信息,这些信息对用户的意义是什么。
用户体验的要素
战略层
用户需求
用户需求是网站的目标,了解这些观众想从我们这里得到什么
产品目标
我们自己对网站的期望目标,达到的商业目的。
范围层
功能规格
对“功能组合”的详细描述
内容需求
对各种内容元素的要求的详细描述
结构层
交互设计
定义系统如何响应用户的请求
信息架构
合理安排内容元素以促进人类理解信息
架构层
信息设计
促进理解的信息表达方式
界面设计
安排好能让用户与系统的功能产生互动的界面元素
导航设计
屏幕上一些元素的组合,允许用户在信息架构中穿行。
表现层
感知体验
应用这些元素
内容
提供给用户最重要的东西,就是用户认为有价值的内容
技术
提供给用户的体验大部分由技术来决定的。
第三章 战略层(产品目标和用户需求)
成功的用户体验,是一个被明确表达的“战略”,知道企业和用户双方对产品的期许和目标,有助于促进用户体验各方面战略的制定。
战略层定义
我们通过产品得到什么---产品目标
用户通过产品得到什么---用户需求
上述两者结合构成战略层
产品目标
商业目标
每一个我们做出的决定,都应该建立在我们确切地了解它的影响力的基础之上。
品牌识别
需要明确描述的基础目标之一
成功标准
一些可追踪的指标,在产品上线以后用来显示它是否满足了我们自己的目标和用户的需求。
用户需求
用户细分
将大量的用户需求划分成几个可管理的部分,这将通过用户细分来完成。
将用户划分成较小的,有共同需求的小组,以此来帮助我们更好地了解用户的需求
人口统计学标准划分用户:性别,年龄,教育水平,婚姻状况,收入等
除了了解用户对于技术的熟悉程度和适应程度,还要知道他们对于网站相关内容的知识有多少。
可用性和用户研究
首先必须知道他们是谁。收集必要的信息来达成共识。
研究工具,问卷调查,用户访谈,焦点小组
问卷调查,焦点小组这种市场调研方法,是获取用户的基本信息的宝贵来源。
现场调查:是指一整套完整,有效且全面的方法,用于了解在日常生活情境中的用户行为。
任务分析:认为每一个用户与产品的交互行为都发生在执行某一任务的环境中。
用户测试:请用户来帮忙测试你的产品
可用性:寻找令产品更容易使用的途径。
卡片排序法:用户探索用户如何分类或组织各种信息元素。
创建人物角色
用户模型或用户介绍
人物角色是能代表真个真实用户需求的虚拟人物。
团队角色和流程
战略专家
尽可能全面地收益大家对于产品目标与用户需求问题的不同看法
决策层
一群资深的决策者,他们管理那些会影响产品决策的部门。
产品目标和用户需求经常被定义在正式的 战略文档 和 愿景文档
第四章 范围层 (功能规划和内容需求)
带着“我们想要什么”,“我们的用户想要什么”的明确认识,我们才能弄清楚如何去满足这些战略的目标。\n当把用户需求和产品目标转变成产品应该提供给用户什么样的内容和功能时,战略就变成了范围。
范围层定义
定义范围做两件事
一个有价值的过程
产生有价值的产品
过程:价值在于,当这个事情还处在假设阶段的时候,它能迫使你去考虑潜在的冲突和产品中一些粗略的点。
产品:价值在于,被定义的这个产品给了整个团队一个参考点,明确要完成的工作,提供一门用于讨论的语言。
用文档定义产品需求,两个原因
知道你正在建设什么?
责任分配会更加明确,提高写作的效率
知道你不需要建设什么?
功能优先级,优先处理先要建设的功能
范围蠕变(scope creep):需求向滚雪球一样,越滚越大,增加额外的工作量,项目不停的膨胀,结束时间遥遥无期
功能和内容
战略层的抽象问题---“我们为什么要开发这个产品”转而面对一个新的问题“我们要开发的是什么?”
功能型产品方面,考虑的是,功能需求规格---哪些应该被当成软件产品的“功能”以及相应的组合。
信息型产品方面,考虑的是,内容,属于编辑和营销推广的传统领域
软件开发中,范围层确定的是全部的功能需求或功能规格。
功能规格说明书来描述文档文身
需求来描述文档内容
定义需求
用户画像
创建虚拟人物来帮助我们更好地理解用户需求。
场景
在决定功能需求的时候,使用人物角色,把虚拟人物放到一个简单的故事之中。
一个场景就是一个故事,简单描述了一个人物角色会如何完成这些用户需求。
功能规格说明书
文档不能解决所有问题,但是定义可以,我们需要不是文档有多厚或有多详细,而是要足够清楚和准确。
不需要包含产品的每一个细节---只需要包含在设计或开发过程中出现有可能混淆的功能定义。
不需要展望产品未来的理想化状态---只需要记录在创建这个产品时已经确定下来的决议
撰写功能说明书规则:
乐观
描述这个系统将要做什么事情去“防止”不好的情况发生,而不是描述这个系统“不应该”做什么不好的事情。
例如:这个系统不允许用户购买没有风筝线的风筝,替换成 用户如果想买一个没有线的风筝的话,这个系统应该引导用户到风筝线页面。
具体
尽可能详细地解释清楚状况,这是我们能决定一个功能是否被实现的最佳途径
例如:最受欢迎的视频要重点标注。 什么叫“最受欢迎”,评论多算不算受欢迎,另外如何重点标注。\n改成 上一周被播放最多的视频要显示在列表的最前端。
避免主观的语气
这是另外一种使需求“保持明确”和“避免歧义”的途径---因而也避免了误解的可能性。
例如:这个网站的风格应该是时尚,闪耀的。如何去验证“时尚”和“闪耀”。这样就没有一个标准。
内容需求
很多时候我们说的内容指的是文本,但是图像,音频和视频有时候有可能比其文字还要重要。
确定需求优先级
一个战略目标将产生多个需求\n一个需求也可以实现多个战略目标
第五章 结构层(交互设计与信息架构)
结构层定义
适当地将我们的关注点从抽象的决策与范围问题,转移到更能影响最后的用户体验的具体因素。
传统的软件开发行业,涉及“为用户涉及结构化体验”的方法被称为交互设计。
内容建设方面,通过信息架构来构建用户体验,包括组织管理,分类,顺序排列。
交互设计
交互设计关注于描述“可能的用户行为”,同时定义“系统如何配合与相应”这些用户行为。
概念模型
用户对于“交互组件将怎样工作”的观点称为概念模型
错误处理
任何一个交互设计的项目都有很大的部分牵涉处理“用户错误”--- 当人们犯错误时,系统要怎么反应,并且当错误第一次发生时,系统要如何防止人们继续犯错?
有效的错误信息和容易自我解释的界面可以在错误发生之后帮助用户纠正。
用户在完成这个动作以后才发现做错了,此时系统已经无法进行实时纠错了,在这些情况下,系统应该为用户提供从错误中恢复的方式,最有名的例子就是著名的“撤销”功能。
信息架构
结构化内容,信息架构主要工作是设计组织分类和导航的结构,让用户可以高效率,有效地浏览网站的内容。
两种方式建立分类体系
从上到下
根据产品目标与用户需求直接进行结构设计
从最广泛的,有可能满足决策目标的内容与功能开始进行分类,然后再依据逻辑细分出次级分类。
局限性:可能导致内容的重要细节被忽略
从下到上
根据对“内容和功能需求的分析”而来的。
这些资料统统放到最低级别的分类中,然后再讲它们分别归属到较高一级的类别,从而逐渐构建出能反映产品目标和用户需求的结构。
局限性:导致架构过于精确地反映了现有的内容,因此不能灵活地容纳未来内容的变动或增加
结构方法
信息架构基本单位是节点
节点可以对应任一的信息片段或组合,可以小到是一个数字,也可以大到整个图书馆
节点的抽象性使得我们能明确地设定我们的关注点的详略程度。
常见的类型
树状结构或中心辐射结构
节点与其他相关节点之间存在父级/子级的关系。
例如:电商分类
矩阵结构
允许用户在节点与节点之间沿着两个或者更多“维度”移动。
例如:首页分类导航
自然结构
不会遵循任何一致的模式,节点是逐一被链接起来的,同时这种结构没有太强烈的“分类”的概念。
例如:视频中推荐视频
线性结构
连贯的语言流畅是最基本的信息结构类型。
例如:出租房屋信息填写(几房,地址,图片,描述等等)
组织原则
从字面上来讲,组织原则基本上就是我们决定哪些节点要编成一组,而哪些节点要保持独立的标准,不同组织原则将被应用在不同的区域和网站不同的层面
以公司的信息网站为例,树状结构中的最上层也许是这样的类别:“消费者”,“企业集团”和“投资者”,组织原则“不同内容所针对的观众”
其他最上层类别,“北美洲”,“欧洲”和“非洲”,使用地区作为另一种组织原则是满足全球使用者需求的一种方法。
一般说,产品最高层级使用的组织原则应该紧密与“网站目标”,“用户需求”相关,而在结构中较低的层级,内容与功能需求将对你所采取的组织原则产生重大影响。
例如:汽车网站以后大量汽车信息,组织原则则需要考虑,按照用户的需求来考虑排序元素,如果用重量维度,则用户根本不关心,用户大部分关心的是 价格,外观等。
语言和元数据
即使结构完全准确代表了用户对你的网站的理解,用户任然无法再结构中找到他们想走的路,这是因为他们无法了解你的“命名原则”:描述,标签,和网站使用的其他术语。\n因此“使用用户的语言”并且“保持一致性”是非常重要的,用来强调一致性的工具称为“受控词典”。
受控词典:网站使用的一套标准语言,这是用户研究很要中的领域,与用户谈话并了解他们的沟通方式,是开发出一个让用户感到自然的命名原则系统的最有效方式。
控制词汇的另一种较为精细的应用方法,就是创造“类词词典”。
元数据:
使用受控词典或类词词典对于建立包含元数据的系统特别有用,简单地说就是“关于信息的信息”,即以一种结构化的方式来描述内容的信息。
例如:关于产品的文章,元数据有哪些
作者名
发布日期
内容类型
产品名称
产品类型
客户所在行业
其他相关信息
团队角色和流程
文档一定要描述清楚网站的结构---从命名原则和元数据的具体细节,到信息架构和交互设计的整体概括。
架构图
用来描述网站结构工具的术语
架构图最重要的是记录概念关系,哪些类别需要放一起,哪些需要保持独立?交互过程中那些步骤要怎样相互配合
第六章 框架层(界面设计,导航设计和信息设计)
框架层的定义
框架层用户确定用什么样的功能和形式来实现。
如果涉及提供给用户做某些事的能力,则属于“界面设计”
通过它,用户能真正接触到那些“在结构层的交互设计中”确定的“具体功能”
如果提供给用户去某个地方的能力,这是“导航设计”
一个用户能看到那个结构的镜头,通过它用户可以“在结构中自由穿行”
如果传达想法给用户的话,就是“信息设计”
信息设计跨越了“以任务为导向”的功能型产品和“以信息为导向”的信息型产品的边界。
习惯和比喻
每一个界面问题的解决办法都必须要毫无条件地死守这些习惯,当某些不同方式有很明显的益处时,你反而应该试着谨慎地违背一些习惯 。
不应该过于强调交互设计背后的概念模型,应该抑制在产品四周建立起“比喻”的冲动。
网站内容应该提供一定程度的上下文,从而帮助用户更好地猜测你所采用的比喻师徒代表什么样的特征。
界面设计
成功的界面设计是那些能让用户一眼就看到“最重要的东西”的界面设计。
另一方面,不重要的东西,不应该被注意到---有时候则是因为他们根本就没有出现在那儿
元素:复选框,单选框,文本框,下拉菜单,多选菜单,按钮等
根据空间范围和视觉,考虑用下拉列表还是单选(下拉列表会隐藏些信息,单选按钮需要更多空间)
导航设计
导航的三个目标
首先,它必须提供给用户一种在网站间跳转的方法。
其次,导航设计必须传达出这些元素和他们所把汗内容之间的关系。
例如:水果>苹果>富士苹果
再次,导航设计必须传达出它的内容和用户当前浏览页面之间的关系。
全局导航
提供了覆盖真个网站的通路
首页
局部导航
提供给用户在这个架构中“附近地点”的通路
分类中父菜单
辅助导航
提供了全局导航或局部导航不能快速达到的相关内容的快捷途径
消息中心
上下文导航
也叫“内联导航”是嵌入页面自身内容的一种导航
友好导航
提供给用户他们通常不会需求的链接,但他们是作为一种便利的途径来使用的。
联系信息,法律声明
信息设计
充当把各种设计元素聚合到一起的粘合剂的角色。决定如何呈现这些信息,让人们更容易使用和理解他们。
信息设计涉及“分组”或“整理”
元素:\n省份\n职位名称\n电话号码\n地址\n姓名\n邮政编码
分组后
个人资料:\n姓名,地址,职位名称\n\n联系方式:\n电话号码,省份,地址,邮政编码
把信息设计和导航设计结合到一起,有一个重要的作用,用来帮助用户理解“他们在哪”以及“他们能取哪”
例如:指示牌 公园,机场,停车场
例如:网站面包屑 导航
线框图
信息设计,界面设计,导航设计放置在一起形成统一的架构。
线框图整合在结构层全部三种要素的方法:
通过安排和选择界面元素来整合界面设计
通过识别和定义核心导航系统来整合导航设计
通过放置和排列信息组成部分的优先级来整合信息设计
第七章 表现出(感知设计)
内容,功能和美学汇集到一起来产生一个最终设计,满足用户的感官感受。
表现层定义
解决并弥补“产品框架层的逻辑排布”的感知呈现问题。
视觉上应该如何呈现
合理设计感知
人类感受五方面
视觉,听觉,触觉,嗅觉,味觉
嗅觉和味觉设计是用户体验设计师很少考虑的范畴。
触觉
手机外壳,光滑,磨砂等
游戏里面的震动
听觉
产品使用时候的声音
视觉
APP第一眼就是视觉
传达品牌的形象
忠于眼睛
用户眼睛移动轨迹模式两个特点
首先,遵循的是一条流畅的路径。
在不需要用太多细节来吓倒用户的前提下,为用户提供有效选择的“引导”
对比和一致性
视觉设计中,我们用于吸引用户注意的一个重要工具就是对比。
关键按钮或其他用深色进行表示
“差异”必须足够清晰
一致性使设计有效的传达信息,不会导致用户迷惑或焦虑
所有按钮风格统一
所有页面间距统一
内部和外部的一致性
内部一致性的问题,就是说,在产品的两个不同的地方反映了不同的设计方法
首页设计风格和分类设计风格
按钮的设计风格
"统一的品牌识别形象"强化产品
外部一致性的问题,就是说,这个产品没有在同一个企业的其他产品中,反映出被使用,相同的设计方法。
配色方案和排版
色彩可能是向外界传递品牌识别的一个最有效的方法
各种品牌的LOGO
可乐
百事
大多数情况下,更亮或更醒目的色彩可以用于设计前景色
希望得到更多注意的元素
更暗淡的色彩最好用于那些不需要跳出页面的背景元素
离开按钮
设计合成品和风格指南
视觉设计领域中对线框图最直接的模拟是视觉模型或设计合成品。“合成”的意思是“综合的”。
风格指南,文档确定了视觉设计的每个方面,从最大到最小的范围内的所有元素,影响到产品的每一个局部的全局标准(比如,设计栅格,配色方案,字体标准或标志应用指南)
第八章 要素的应用
“成功的方法”和“注定会失败的方法”的差异归根结底就是以下两点:
了解你正在试着去解决的问题
了解这些解决办法所造成的后果
用户体验的决策体现在以下场景之中
由现状决定的设计
由模仿决定的设计
由领导决定的设计
提出正确的问题
将每一个决定都建立在对其背后议题的理解之上,与用户体验有关的第一个问题恐怕要问自己,为什么这么做