第1章:用户体验为什么如此重要
1-1日常生活中的遭遇
叙述了一个令人懊恼的早晨。
1-2什么是用户体验
这个令人懊恼的早晨其实可以通过优秀的设计来避免。设计产品的时候,人们大多在思考产品可以做什么,忽略的产品如何工作(人们如何使用他们)。而后者是打造用户体验、决定产品成功的重要因素。
1-3从产品设计到用户体验
一般人做产品设计的时候可能会考虑两方面——外观和功能。但是,将设计一个“用户体验良好的产品”作为明确的目标,意味着不仅仅是功能或外观那么简单。用户体验设计通常要解决的是应用环境的综合问题。
设计产品内部运作,用户不可见的部分的时候“形式追随功能”的观点是正确的。但是,对于产品直接面对用户的那些部分,正确的产品形态由“用户自身的心理感受和行为”来决定。
好的产品=优秀的外观设计+有用的功能设计+站在应用环境里设计
1-4为体验而设计:使用第一
简单的产品或许不需要太多用户体验设计。越复杂的产品,确定如何向用户提供良好的使用体验就越困难。用户体验设计也就更重要。
1-5用户体验和网站
差劲的网站设计让用户觉得自己很愚蠢。建立优秀的网站需要“理解人们所想和所需”一味的添加新的“产品特性”只会让产品越来越复杂,用户也很难再次光顾。提供优秀的用户体验有利无弊。(不仅对网站,对所有类型的产品和服务都是如此)
1-6用户体验就是商机
对于商业网站,优秀的用户体验,会提高客户的转化率和忠诚度。
对于企业内部网站,优秀的用户体验,让员工工作更快,犯错更少,效率更高。
1-7在乎你的用户
创建吸引人的、高效的用户体验方法称为“以用户为中心设计”其主要思想:在开发的每一个步骤中都要把用户列入考虑范围。“以用户为中心”的设计流程保证你在解决方案中的妥协不是随即决定的,而是经过思考的。
好的体验是有粘性的、直观明了、令人愉悦的、“每件事都按照正确的方式在工作”的体验。
第2章:认识这些要素
2-1五个层面
表现层:所看到的一系列网页,由图片和文字组成。有的可能带有超链接
框架层:按钮、控件、照片和文本区域的位置。用于优化设计布局,达到元素最大的效果和效率。
结构层:用来设计用户如何到达某页面以及之后能去哪里,确定网站各种特性和功能最合适的组合方式。
范围层:网站中全部的特性和功能。
战略层:经营者和用户想从网站得到什么。
2-2自下而上地建设
由战略到表现,整个产品会越来越具体。设计产品的时候,每一个层面都是根据他下面的那个层面来决定的。在更改某个层面的设计后,相应的之下层面都可能需要从新设计。
但是并不是每一个“较低层面”的决策都必须在“较高层面”之前做出。在“较高层面”的决定有时候会促成你对“较低层面”的评估。每个层面的决策一般根据竞品的行为或业界最佳的实践成果来决定。这些决策可能产生的连锁反应应该是双向的。
在设计流程中,不要把每个层面的工作在下一个层面【开始之前完成】。更好的方法是让每一层面的工作在下一个层面【结束之前完成】。
2-3基本的双重性
在不同领域工作的人们可能使用了相同的词汇来形容不同的工作,为了避免误解,本节界定了将要介绍的要素名词的使用范围——功能型的平台产品、信息型的媒介产品
在功能型产品这边,我们主要关注的是【任务】——所有的操作都被纳入一个过程,去思考人们如何完成这个过程。在这里,我们把网站看成用户用于完成任务的工具。
在信息型产品这边,我们主要关注的是【信息】——网站应该提供哪些信息,这些信息对用户的意义是什么。创建一个富信息的用户体验,就是提供给用户一个可以寻找、理解,且有意义的信息组合
2-4用户体验要素
【战略层】包括用户需求和产品目标两部分
用户需求:用户希望从产品中得到什么,这些目标如何满足他们所期待的其他目标。
产品目标:我们自己对产品的期望目标,可以是商业的,或是其他。
【范围层】包括 功能规格 和 内容需求 两部分
功能规格:针对功能型产品的“功能组合”的详细描述。
内容需求:针对信息型产品的“内容元素的要求”的详细描述。
【结构层】包括: 交互设计 和 信息架构 两部分
交互设计:针对功能型产品,定义系统如何相应用户的请求。
信息架构:针对信息型产品,合理安排内容元素以促进人类理解信息。
【框架层】包括:信息设计 、 界面设计 和 导航设计
信息设计:针对所有产品的一种促进理解的信息表达方式。
界面设计:针对功能型产品,安排好能让用与系统的功能产生互动的界面元素。
导航设计:针对信息型产品,屏幕上的一些元素的组合,允许用户在信息架构中穿行。
【表现层】包括: 感知设计
感知设计:针对所有产品的,视觉呈现。
2-5应用这些要素
在工作中,这些元素的界限并不明显,每项单独做评估工作也很不容易。更好的办法是有人能花时间系统地把每个模块都看一看。
另外对于产品的另外两个要素是:【内容】和【技术】,内容是产品提供给用户的最重要的一件东西,是用户认为有价值的内容;技术是打造用户体验的基础,合理运用先进的技术可以创造更优秀的用户体验。
第3章:战略层——产品目标和用户需求
3-1战略层的定义
战略层的制定是基于对企业内外部目标的结合:
》我们要通过这个产品的到什么?(产品目标)
》我们的用户要通过这个产的到什么?(用户需求)
3-2产品目标
商业目标:避免过于具体(例:为用户提供一个实时的文本通信工具)或过于宽泛(例:为公司省钱或赚钱)的目标。应当在充分了解问题再得出结论,明确定义“成功的条件”而不是定义“通向成功的路径”。
品牌识别:除了品牌标识的视觉元素外(商标、字体、颜色),的概念系统或情绪反应。对用户起着潜移默化的作用。你要决定品牌形象是无意中形成,还是通过产品设计有意安排。
成功标准:一些可追踪的指标(例如:转化率、回访数、印象数),用于产品上线后,呈现产品是否满足产品目标和用户需求。是理解目标的重要部分,清楚你“什么时候算是到达重点”。这些标准有时与网站本身和用户如何使用该产品有一定关系。
3-3用户需求
为用户设计不是为设计师自己设计,需要站在用户的立场审视问题。探索用户需求的第一步是定义谁是我们的用户,进而才能对其调研,确定需求的优先级。
用户细分:按照某些共同关键特征将用户分成更小的群组。通过这种方法揭示用户最终需求。经过用户细分,可以划分出不同群体的不同需求,有时他们甚至是矛盾的。出现矛盾的时候,要么选择单一用户群设计而忽略其他用户群,要么为执行相同任务的不同用户群提供不同的方式,这样不同的决策无疑会影响之后的关于用户体验的每一个选择。
可用性和用户研究:收集必要的信息来达成共识。
【问卷调查】【用户访谈】【焦点小组】适合收集用户的普遍观点与感知。
【用户测试】【现场调查】适合理解具体的用户行为以及用户在和产品交互时的表现。
【市场调查法】:包括【问卷调查】【焦点小组】,调查前要可以明确地表达出你试图从用户身上获得什么信息。
【现场调查】:用于了解在日常生活情景中的用户行为。缺点是有时候费时切昂贵。结果通常对用户的理解会更深刻。
【任务分析】&【用户访谈】:一种轻量化的【现场调查】,只关注产品中的某一任务。并且可以通过【用户访谈】来完成,让用户讲述自己的故事,说出自己的经验。
【用户测试】:请用户来测试你的产品或原型。测试前要可以明确地表达出你试图从用户身上获得什么信息。
【卡片排序法】:一种特殊的【用户测试】,用于探究用户如何分类或组织各种信息元素。一般用于信息驱动的产品。
创建人物角色:创建能代表整个真实用户需求的虚构人物。通过这个保持在设计过程始终不偏离用户需求。例:
【人物角色例图】
3-4团队角色流程
产品目标和用户需求经常被定义在一个正式的【战略文档】或【愿景文档】中。它不仅是列出目标清单,还提供目标之间的关系分析,并且说明这些目标要如何融入更大的企业中去。目标以及目标分析来自于:决策者(企业管理层)、普通员工、用户。
【战略文档】不要冗长,要简洁明了切中要点。
【战略文档】必须写,而且要频繁使用,要发给每个项目参与者(设计师、程序员、信息架构师、项目经理),帮助他们在工作中做出正确的决定。
【战略文档】可以适当演变与改进。
第4章:范围层——功能规格和内容需求
4-1范围层定义
定义范围层的工作:是一个有价值的工作,还能产生有价值的产品。定义范围层可以确保你的项目能看到尽头,方便规划工作流程、安排、里程碑。
为什么要定义范围层?
#1:这样你才知道你正在建设什么。
把产品的概念提供给团队。方便任务在人员上的分匹配。
#2:这样你才能知道你不需要建设什么。
对产品进行长期的规划,把暂时不需要的功能安排到后期。方便功能在时间上的分配。
4-2功能和内容
功能规格:载体:【功能规格说明书】,在项目初期它描述产品该做什么,在项目末期它描述产品真正完成了什么。
内容需求:通过内容管理系统管理。错误提示也是一种内容需求。
4-3定义需求
需求的来源:
①用户本身,通过直接询问了解人们想干什么。
②企业中影响你产品的人,例如上司
③开发团队之外的人的启发(工程师、客服、营销),多角度全方位的考虑问题
④硬件需求是软件需求的基础
⑤通过把人物角色放入场景中寻找潜在的用户需求
⑥从竞争对手的产品中寻找启发
⑦来自与所开发产品的类似产品的启发
通过直接询问用户而得来的三种需求:
①用户讲述的清晰的好想法
②需要深入理解用户需求而产生的真正的根本性需求
③用户不知道他们是否需要的需求
4-4功能规格说明
功能规格说明不需要包含产品的每一个细节——只需要包含在设计或开发过程中出现有可能混淆的功能定义。同时功能规格说明也不需要展望产品未来的理想化状态——只需要记录在创建这个产品时确定下来的决议。(理清混淆,立足当下)
撰写功能规格说明的几条规则:
①【乐观】描述系统将要去做什么事情去“防止”不好的事情发生,而不是描述系统“不应该”做什么不好的事情。例如:
#1这个系统不允许用户购买没有风筝线的风筝。(坏事发生,不好)
#2如果用户要买没有线的风筝,系统应将用户引导到风筝线页面。(避免坏事,好)
②【具体】尽可能详细地解释清楚状况,这是我们决定一个功能是否被实现的最佳途径。例如:
#1最受欢迎的视频要重点标注。(笼统,不好)
#2上周被播放最多的视频要显示在列表的最前端。(具体,好)
③【避免主观的语气】保持明确,避免误解,功能的规格必须是可以验证的。(可证伪的假设)例如:
#1这个网站的风格应该是时尚、闪耀的。(无法验证,不好)
#2这个网站应该符合邮递员Wayne所期望的时尚。(可验证但依赖W的主观,较好)
#3网站的外观应该符合企业的品牌指南文档(可以客观验证,好)
④【量化地定义一些功能】是避免主观语气的一种法方法。例如
#1要具有高级别的执行能力(非量化、难验证,不好)
#2至少可以被1000名用户同时使用(量化、可验证,好)
4-5内容需求
内容包括:文本、图像、音频、视频等。不同类型的内容结合在一起,协同满足某一个需求。定义出所有不同类型的内容,可以帮助你确定需要那些资源来制作这些内容。
确定内容需求时的几个工作要点
①要关注内容本身,而不是关注内容展现的格式。例如在关注“常见FAQ”时,“常见”一词可能就会被忽视。
②内容需求应该提供每一个特性规模的大致预估:文本字数、字节大小、尺寸等。用于设计适当的工具来管理内容。
③将责任安排到位,尽早确定每个人来负责每一个内容元素。避免没有分配责任就早早进入开发阶段。
④确保产品上线后的内容更新有保障。否则产品会渐渐难以满足用户需求。
⑤根据战略目标,定义更新频率。
⑥如果网站针对需求相异的用户,要做好内容分类工作。清楚哪些用户需要哪些内容。
⑦对于已有大量内容的项目而言,需要列出产品所有内容的清单。让团队的每个人都知道自己在设计用户体验时候要做什么工作。
4-6确定需求优先级
1.确定需求优先级就是:排列出哪些功能应该包含到你现在的这个项目中去。
2.战略目标和需求不是一对一的关系,而是多对一,一对多的交叉关系。
3.评估需求的3个维度:用户需求、产品目标、可行性。
4.功能的可行性局限在于:技术局限而无法做出来、时间局限而需要延期上线、资源局限而需要削减不能完成的任务。
5.由于各个功能之间存在关联性,有些功能的提升需要其他功能的提升作为前提。所以如何权衡:“是升级前提功能?还是修改需要提升的功能”取决于你的战略目标。
6.通过范围定义的工作去除那些“看上去有可能要改变战略的特性建议”,但是如果有这样的特性:“尽管它不在项目范围之内,也超越了任何一个限制条件,但听起来仍像是一个不错的想法”,那么此时你可能需要从新审视某些战略目标。无论如何,如果你在定义范围的时总在反复审视战略目标,说明你极有可能是太早地进入了需求定义阶段。
7.在两个特性的重要程度差别不明显的情况下,办公室政治也有可能影响项目范围。
8.要关注“制定战略目标”而不是各种实现目标的手段。面对一个总是把注意力放在某个特性的上级,你可能需要沟通技巧。
第5章:结构层——交互设计与信息架构
5-1结构层定义
定义结构层的工作:在定义好用户需求并排列好优先级后,把这些分散的功能点组成一个整体。为网站创建一个概念结构。
功能型产品——交互设计、信息型产品——信息架构。两者都强调一个重点:确定各个将要呈现给用户的元素的“模式”和“顺序”。交互设计关注于将影响用户执行和完成任务的元素。信息架构则关注如何将信息表达给用户的元素。但总之,它们要求设计者要理解用户——理解用户的工作方式、行为和思考方式。将了解到的知识融入产品,会提供为用户提供更好的体验。
5-2交互设计
交互设计关注描述“可能的用户行为”,同时定义“系统如何配合与响应”这些用户行为。不要让用户去适应产品,而是要让产品与用户互相适应,预测对方的下一步。
程序员倾向做技术上效率高的产品,而交互设计师力求打造对用户而言的好产品。与其针对机器的最佳工作方式来设计系统,还不如设计一个对用户而言最好的系统。
5-3概念模型
5-3-1概念模型的定义与运用
用户对于“交互组件将怎样工作”的观点称为概念模型。例如:
“购物车”——典型的容器概念模型,人们“放进东西”或“拿出东西”;
“订货单”——使用“编辑”来代替“购物车”的“放进”与“拿出”。
使用人们熟悉的概念模型,会使用户很快适应一个陌生的网站。当然,打破传统也没有错——只要你有一个好理由说明“为什么要这么做”,同时准备好另一个符合用户需求且在情理之中的概念模型以备用。一个令人不太熟悉的概念模型只有在用户能正确理解并诠释它的时候才能起到效果。
我们不必将概念模型明确地告诉我们的用户。这样可能会令他们混淆。概念模型是用于在交互设计的开发过程中保持使用方式的一致性的。了解用户对网站模式的想法,可以帮助我们挑选出最有效的概念模型。理想的状态是:我们不需要告诉用户网站使用的是什么概念模型;用户使用网站的时候,基本上是凭直觉的,因为网站的交互行为与用户隐含的期望是完全相符的。
将现实世界中相对应实物的比喻放入我们的概念模型中,这对系统功能设计有一定价值。不过,更重要的是,不要将比喻从现实世界中一字不落地照搬过来。(避免过分运用比喻)
5-3-2错误处理
——当人们犯错误时,系统要如何反应,并且当错误第一次发生时,系统要如何防止人们继续犯错。方法:
①同时也是最好的防止错误的方法,是将系统设计成不可能犯错的那种。
②避免错误的方法就是使错误难以发生。但即使如此,一些错误一定会发生。这是,系统应该帮助用户找出错误并且改正它们。在某些情况下,系统甚至可以帮助用户自动改正错误(要慎用)。有效的错误信息和容易自我解释的界面可以在错误发生之后帮助用户纠正。
③面对有些用户开始认为是对的,后来发现错了的那种错误,最有效的方法是为可以恢复的操作提供“撤销”选项。不可恢复的操作要适当警告。
5-4信息架构
5-4-1信息架构意义
信息架构研究的是人们如何认知信息的过程,对于产品而言,信息架构关注的就是呈现给用户的信息是否合理并具有意义。这对信息型产品和功能型产品都很重要。
5-4-2结构化内容,内容分类法
在以内容为主的网站上,信息架构主要的工作是设计组织分类和导航的结构,让用户可以高效率、有效地浏览网站的内容。信息架构与信息检索的概念密切相关:设计出让用户容易找到信息的系统。甚至是教育、通知或说服用户。
信息架构要求创建分类体系,两种建立方式:从上到下、从下到上。
从上到下的信息架构法将从战略成所考虑的内容,即根据产品目标与用户需求直接进行结构设计。先从最广泛的、有可能满足决策目标的内容与功能开始进行分类,然后再依据逻辑细分出次级分类。这样的“主要分类”与“次要分类”的层级结构就像一个个的空槽,而内容和功能将按顺序一一填入。(由战略层驱动)
从下到上的信息架构法也包括了主要分类与次要分类,但它是根据对“内容和功能需求的分析”而来的。先从已有的资料(或者当网站发布后将存在的资料)开始,把这些资料统统放到最低级别的分类中,然后再将它们分别归属到较高一级的类别,从而逐渐构建出能反映我们的产品目标和用户需求的结构。(由范围层驱动)
两者相比较,前者容易忽略内容的重要细节;后者过于精确的细节导致未来可能不能灵活的变动或增加内容。需要找出两者的平衡点。
5-4-3关于分类层级间的跳转
但是计算用户从开始到完成任务的点击次数是不科学的,比起令人困惑的点三下,用户可能会更喜欢无脑的点七下。所以,重要的是结构质量,而非整个过程要多少步骤。
5-4-4关于产品升级与更新
网站的更新几乎是必然的,高效的网站结构可以“容纳成长和适应变动”,更多的新内容可以让你从新审视网站的分类组织原则。在每次较大规模变更网站结构之前,最好提前通知用户。
5-4-5四种常见的结构类型
信息架构的基本单位是节点。它可以对应任意的信息片段或组合,设定我们关注点的详略程度。
层级结构:(树状结构、中心辐射)节点与其他相关节点之间存在父级/子级关系
矩阵结构:允许用户在节点与节点之间沿着两个或更多(最多三个)的“维度”移动
自然结构:没有很强的分类概念,各节点分散逐一连接,适合营造自由探险的感觉
线性结构:连贯的节点排布,用于限制那些内容循序对于用户需求非常关键的应用程序
5-4-6组织原则
——决定哪些节点要编成一组,而哪些节点要保持独立的标准。
一般来说,在产品最高层级使用的组织原则应该紧密地与“网站目标”和“用户需求”相关。而在结构中较低的层级,内容与功能需求将对你所采取的组织原则产生重大影响。
使用合理的“截面”来组织信息,使用错误的截面可能比不使用更糟糕。对于截面的问题常见对策是,将每一个有可能的截面都当作组织原则来使用,让用户自己去选择对他们而言最重要的那个。
截面:各项目中某种特定性质。例如:汽车的重量、耗油量、型号、外观等就属于不同的截面。
5-4-7语言和元数据
“清晰的结构”配合“明了的命名原则”才能让用户顺利的了解网站。
命名原则:描述、标签,和网站的其他术语。“使用用户的语言”并且“保持一致性”是非常重要的。我们把用来强调一致性的工具称为“受控词典”
【受控词典】是网站使用的一套标准语言。与用户谈话并了解他们的沟通方式,是开发出一个让用户感到自然的命名原则系统的最有效方式。创造并遵守它,可以防止企业内部的专用术语侵入产品,降低用户体验。并且,也有助于建立起贯穿所有内容的一致性。
【类词词典】提供常用的、但未纳入该网站标准用语的词汇以供选择。你可以添加:内部专用术语、速写语、俚语或缩写词等对其相对应的词汇进行补充。还可能包含词汇之间的类型关系,提供更广义、更狭义或相关词汇的建议。
【元数据】是“关于信息的信息”,即以一种结构化的方式来描述内容的信息。例如你的网站中的一篇文章,该文章的:发布时间、作者、内同类型等信息属于元数据。建立一套元数据分类系统,有助于日后创建某个专题(某作者的专题内容或有关于某个新闻的相似旧新闻的专题)以备不时之需。
元数据的另外一个用途是提供更可靠的搜索结果。元数据+类词词典+搜索引擎,让搜索可以变得更智能,甚至可以推荐给用户可能感兴趣的内容
5-5团队角色和流程
5-5-1结构层的交付——架构图
信息架构或交互设计的主要文档是示意图。视觉化地呈现整体结构,同时包含命名原则和元数据的具体细节。现在,人们一般用【架构图】作为描述网站结构的工具。
这种架构图不一定要写明网站的每一页的每一个链接。太过详细的架构图可能会造成混乱。架构图最重要的是记录概念关系:哪些类别需要放在一起,而哪些需要保持独立?在交互过程中那些步骤要怎样相互配合?(工具:视觉词典——Visvo)
5-5-2成员分配
企业中,用户体验设计师一般从事交互设计和信息架构两部分工作。
FAQ:是否需要聘请一位全职的信息架构师作为团队成员?
如果你的产品主要是内容的更新,不需要定期对网站从新设计开发,就不需要。反之,则需要。
第6章:框架层——界面设计、导航设计和信息设计
6-1框架层定义
关注独立的组件以及他们之间的相互关系。由界面设计、导航设计、信息设计组成。
界面设计:提供给用户做某事的能力。通过它,用户能真正接触到那些“在结构层的交互设计中”确定的“具体功能”。(针对功能型产品)
导航设计:提供给用户去某个地方的能力。通过它,用户可以看清楚“在信息架构中”确定的“结构”,并且可以在其中自由穿行。(针对信息型产品)
信息设计:传达想法给用户。(针对两者)
6-2习惯和比喻
6-2-1习惯与反射作用
习惯和反射作用是我们与这个世界交互时的各种基础,我们日常生活中许多事情都是通过大量的细小的反射完成的。
适当的遵守习惯和谨慎的违背习惯都可以建立成功的用户体验,但前提是,你在做每一个决定的时候都要有充分的、明确的理由。
对于产品内部的不同特性可以使用相同的概念模型,进而可以使用类似的界面设计。用户将在这两个地方使用相同的操作习惯,能有举一反三的效果。而对于产品内部重复出现的模块,例如开始、结束、保存,一般给它们一个统一的设计,有助于用户更快的达到自己的目标而减少错误。
6-2-2抑制在产品四周建立比喻的冲动
运用比喻就会带来猜测,多数情况下用户猜到的跟你设想的都不搭边。更好、更简单的做法是完全去除猜测的成分。有效的使用比喻,就是要减少用户在“理解和使用你的产品功能”时对猜测的要求。
6-3界面设计
6-3-1成功的界面设计是怎样的?
界面设计要做的全部事情就是选择正确的界面元素。哪个功能要在哪个界面上完成,是我们在结构层的交互设计中已经决定的;而这些功能在界面上如何被用户认知到,是界面设计的范畴。成功的界面让用户第一眼就看到最重要的东西。不重要的东西,不应该被注意到。对于复杂系统的设计,弄清楚用户不需要什么,并减少它们的可发现型(或直接排除)是最重要的。
6-3-2界面设计需要怎样的思路?
像程序员一样总是考虑“边缘情况”(发生场景很少的)是不可取的。将一个极端情况呈现出来的界面,等于给大多数用户提供一个设计不良的界面。良好的界面可以组织好用户最长采用的行为,同时让这些界面元素用最容易的方式获取和使用。
6-3-3设计界面有什么技巧?
采用一个聪明的默认值;记录用户最后一次的选择;熟悉利用各种不同的标准元素;等
6-4导航设计
6-4-1导航设计的三个目标(广泛适用两种产品)
①必须提供给用户一种在网站间跳转的方法,导航链接真实有效
②必须传达出这些元素和它们所包含内容之间的关系
③必须传达出它的内容和用户当前浏览页面之间的关系
6-4-2几种导航方式
【全局导航】
提供覆盖整个网站的通路,“固定”在网站顶部或侧栏。
【局部导航】
提供给用户这个架构中到“附近地点”的通路,一个父级界面、兄弟级和子级通路。
【辅助导航】
提供了全局导航或局部导航不能快速到达的相关内容的快捷途径,允许用户不从头开始。
【上下文导航】
嵌入页面自身内容的一种导航。例如重点词解释,要根据用户来设置,不要随意设置。
【友好导航】
提供给用户他们通常不会需要的连接,但是它们是作为一种便利的途径来使用。例如法律说明、联系信息等。
【远程导航】
没有包含在页面结构中的导航,独立于网站的内容或功能。
【网站地图】
在单页中浏览网站整体结构的快捷方式。一般缩进显示两个层级内的导航
【索引表】
按照字母顺序排列的、连接到相关页面的列表。适用于涵盖多主题,多内容的网站,普通网站一般不需要。
6-5信息设计
6-5-1信息设计介绍
信息设计决定如何呈现信息,使人们容易使用和理解产品。有时它是视觉方面的,例如呈现数据选择饼状图还是柱状图,哪个icon可以体现搜索的概念?望远镜?放大镜?还有时涉及到“分组”或“整理”散乱的信息。
最关键的,是用一种能“反映用户思路”和“支持他们的任务和目标”的方式分类和排列这些信息元素。排列这些信息元素之间的关系,是属于微观信息架构的工作。
信息设计不但包括收集信息,同时也需要设计呈现信息的方式。不管什么时候,系统都应该给用户提供能正确使用系统的信息(无论是用户出错还是刚刚开始使用)。
6-5-2指示标识(你在这里指示器)
信息设计结合导航设计,帮助用户理解:他们在哪,他们能去哪。常用的指示方法可以运用:色彩、形状、标签系统、排版等。
6-6框架层的交付——线框图
页面布局将信息设计、界面设计、导航设计结合到一起,形成一个统一的、有内在凝聚力的架构——线框图。线框图一般自带说明,并配合其他交互文档、内容需求等文档一同阅读。它是视觉设计的第一步。
简单产品的线框图可以作为建立界面的模版。复杂产品的线框图不一定要每个界面都画出来,可以只画出较少的标准界面,然后细化。
线框图是整合在框架层的全部三种要素的方法:通过安排和选择界面元素来整合界面设计;通过识别和定义核心导航系统来整合导航设计;通过放置和排列信息组成部分的优先级来整合信息设计。线框图可以确定一个建立在基本概念结构上的架构,同时指出了表现层设计的前进方向。
第7章:表现层——感知设计
7-1表现层定义
通过关注视觉设计,决定信息设计的交付产物在视觉上如何呈现。
7-2合理设计感知
设计流程中的最后一战,用户体验到的第一站。这些感觉包括:视觉、听觉(警示音)、触觉(产品形状和材质)、嗅觉和味觉(使用的材料)。以下内容将以视觉设计为主。
评估视觉设计好坏的标准应该是:在保证软件运行良好的前提下,让软件更美观。视觉设计不能破坏用户体验设计前期所做的工作。(符合战略目标等内容)
7-3忠于眼睛(视觉注意力上部优先,左边优先)
要遵循人类本能去设计。在完成视觉设计后,问问别人,这样的设计是否合适,或者眯着眼睛看页面,直到不能辨认出任何细节,然后让眼睛在页面周围无意识的移动。成功的设计保证视觉路径流畅不拥挤,其次,在没有很多细节的前提下,为用户提供有效选择的、某种可能的“引导”。
7-4对比和一致性
某一元素与众不同时(利用颜色、形状、大小等方法),用户会本能的注意到他。需要注意的是:
① 要让“差异”足够大,用户能足够分辨出这个设计是刻意为之的,要传达信息的。
② 避免过度运用对比原则,否则界面满是重点也就看不出重点了。
③ 避免没有对比导致页面平淡无比。
④ 可以运用对比来引导用户在页面上的视线,或将注意力集中到几个关键的要素上。
⑤ 在设计中要保持一致性,让元素视觉大小保持一致的尺寸,方便布局。
方法:使用基于栅格线的布局。
⑥避免教条主义,坚持使用栅格线系统。
7-5内部和外部的一致性
内部一致性问题:在产品的两个不同的地方反映了不同的设计方法
外部一致性问题:产品没有在同一企业的其他产品中,反映出被使用的相同的设计方法
避免类似问题的解决方法是,重复的模块只设计一次,然后把它们应用到不同产品的不同位置上。最后检查每个产品的设计,找出不适合该产品的模块,单独为该产品的模块再设计。注意,再设计时要保持系统的完整性。
7-6配色方案和排版
7-6-1配色方案
对比和一致性的原则在设计配色方案时也十分重要。优秀的配色方案,需要保证颜色之间的差异足够用户把他们区分开,同时也用了一致的方式来应用它们。
7-6-2排版
正文的排版优先级:文字的可读性要求>网站的风格要求 (Helvetica、Times)
题目,导航元素优先级:网站的风格要求>文字的可读性要求(风格强烈的字体)
大多情况下,你不需要用太多种字体来满足你沟通的需求。同样,不要选择两款似像非像的字体,要有足够大的差异,产生对比。
7-7设计合成品和风格指南
【视觉模型】又称设计合成品,通过视觉设计,将线框图转化成的可视化产品。视觉设计不一定要精确地按照线框图来做——只要它考虑到了相关的重要级别以及线框图中个元素的组合关系。
建立【风格指南】可以确保设计决策的权威性,即保证视觉设计的工作不会因为员工的离职或时间的流逝而失去风格,集体失忆。
风格指南文档确定了视觉设计的每个方面,从最大到最小的范围内的所有元素。影响到产品的每一个局部的全局标准(比如设计栅格、配色方案、字体标准或标志应用指南)通常是风格指南中的第一部分。同时包括每一个模块或网站功能的具体标准。在某些情况下,风格指南中所记录的标准,应该包括各个层级的标准从独立界面到统一的导航元素。总体目标是:提供足够的细节来帮助人们将来做出明智的决策。确保产品看起来像是一个协调的整体,而不是碎片。
第8章:要素的应用
(1)创建良好的用户体验最重要的工作内容是大量收集待解决的非常细微的问题。“成功的方法”的特点:
①了解你正在试着去解决的问题——了解问题出在了哪一层,试着解决。
②了解这些解决办法所造成的后果——每个改动都会产生连锁反应。
必须要周全考虑5个层面的全部因素,保证所有的用户体验要素都被关注。
(2)用户体验决策在不自觉地产生的情况,总是出现在如下场景中:
①由现状决定的设计:发生在当用户体验的结构遵循背后的技术时。遵循技术去设计产品,不一定设计出会对用户友好的产品。更多时候应该综合考虑两者。
② 由模仿决定的设计:发生在当用户体验依靠于来自其他相似产品时。这些软件的情况对你的用户或产品来讲可能并不合适。
③由领导决定的设计:发生在当用户体验由个人喜好代替了用户需求或产品目标驱动体验决策的时候。这样可能已经忽略了应该用于驱动你做出决策的战略目标。
8-1提出正确的问题
设计用户体验的时候总伴随着很多小问题。有些小问题牵一发而动全身,让你不得不从新思考你认为已经解决的问题。很多时候,你必须要在不同的做法间做出妥协并评估利弊做出取舍。当你面对这样的选择,左右为难的时候,正确的做法是:将每一个决定都建立在对其背后议题的理解之上。第一个问题问你自己的:你为什么要这么做?
在没有多余的时间、金钱和资源的情况下,你可以问问客服来收集用户信息,可以找朋友家人做做可用性测试。总之,从已经或可以到手的信息下手,有理有据的调整用户体验。
要在设计进行中进行用户体验评估,而不是在项目快要结束的时候。否则你就算得到了问题,也没有时间进行修改了。提前评估,不要怕所谓的“用户体验评估浪费时间金钱”。
同时,也不要在项目结束的时候做所谓“用户接受度测试”,这样会导致无数设计中的假设在没有经过任何检查的情况下进入,形成了用户体验。在已经完成的产品中通过用户测试中揭露这些假设是极度困难的,因为它们藏在了界面和交互的外衣下面。
还有,用户测试虽然是保证良好体验的一个主要手段。但是,不能在设计中用测试取代测试。测试永远无法取代一个考虑周密的、准备充分的用户体验设计过程。
询问你的用户关于产品的某个具体元素的问题,能帮助你收集来自用户的更多相关信息。着眼于用户体验而进行用户测试,不要用不相关的内容把事情搞混乱。
测试只是了解用户的手段之一,好产品基于对用户的准确理解。要做到“比用户自己更准确地去理解他们需求”。
8-2马拉松和短跑
用户体验开发过程是一场“马拉松”而不是“短跑”。
用户体验流程应当多回顾,前期的交付后期需要测试,测试结束后再根据结果修改。不要等到所有的工作都做完了,再测试。那样团队里不管是谁都会抓狂。
用户体验流程环环相扣,在上一级的错误会消弱更低层面的正确决策,视觉糟糕,用户不喜欢;上一级层面的正确决策如果建立在错误的低层级决策的话,漂亮的产品可能并不好用,用户照样不喜欢。
从产品开发之初,在整个开发流程之内,始终从完整的用户体验出发,就会有好的结果。每一件与产品用户体验有关的事情都是有意识地、明确地决策的结果,只有这样你才能确保这个产品同时满足你的战略目标和用户需求。
����a�4