用户体验的五个要素 (用户体验的五个层次)

本文目录导航：

• 用户体验的五个要素
• 交互设计师的必看书籍有哪些
• 《用户体验要素》要点摘记与思索(2)——五层模型

用户体验的五个要素

用户体验的五个要素是Jesse James Garrett的《用户体验要素-以用户为核心的产品设计》（ The elements of user experience - user-centered design for the web and beyond ）中提到的概念。

作者Jesse James Garrett还有一个名头，那就是“Ajax之父”。

《用户体验要素》中文版不知道是不是翻译的疑问，感觉读起来有点拗口。

书中有一些概念跟如今大家罕用的概念也不一样了，有局部中央了解起来有点艰巨。

不过在书中，提出了用户体验五要素的模型却是很经典，这个模型到如今还不时被人宽泛运行。

要知道本书是2002年写的，这可是十几年前的书啊。

对2002年没概念？咱们来看看那时刻的互联网长什么样子的。

现今的三巨头网络： 2002年的网络首页（起源于网络） 过后的三巨头网易： 2001年的网易首页（起源于网络） 中国互联网起步相对比拟晚，那么那时刻的环球互联网是什么样子的？ 2002年的苹果官方（起源于网络） 哈哈，言归正传。

咱们来看看书中的提到的用户体验五要素的模型。

为什么要注重用户体验 《用户体验要素》这本书中有几个观念，我深认为然：产品的经常使用属性第一 杯子就是用来装水的，假设为了好看将杯子设计成镂空的，那杯子就不是杯子了，充其量只能算是个艺术品。

不要为了设计而设计，要 为经常使用而设计 。

没有用户会阅读经常使用说明书 用户越来越懒，没有用户情愿为了经常使用一个产品而去阅读经常使用说明。

当然，这个既有用户对互联网产品越来越相熟的要素，也要归功于产品的交互设计越来越兽性化。

在一个竞争强烈的市场，很难有第二次时机去接触用户 市场上同类的竞品越来越多，当一个用户退出你的产品，并习气了别的竞品时。

他很难会再回来经常使用你的产品。

好的用户体验不必定成就一个产品，然而坏的用户体验相对可以毁掉一个产品 。

用户体验要素模型 间接来看一下《用户体验要素》这本书中提到的用户体验五要素模型，这个模型算是这本书的精髓所在了： 用户体验要素 作者将用户体验分红了五个档次： 表现层 框架层 结构层 范畴层 战略层 原著将产品分红了两大类，区分是消息型产品和配置型产品。

团体认为没必要这么分，或许说如今没必要这么分了。

随着互联网的开展，越来越多的消息型产品用着越来越多的配置，配置型产品也有不少消息出现。

很难将某个产品定义为纯消息型或纯配置型产品。

用户体验顺序 用户拿到你的产品以从上到下的顺序来体验你的产品。

表现层 用户拿到产品后，产品出现给用户的第一印象。

例如，产品的主颜色是蓝色还是白色、驳回了扁平格调还是拟物的格调等。

框架层 当用户进入产品时，用户对产品的全体印象。

例如，进入产品后，用户可以看到菜单是怎样设计的，每个菜单区分对应什么配置。

怎样找到须要的内容，是经过列表还是搜查框。

结构层 用户开局经常使用产品后，用户对产品的感知。

例如，从购物到成功支付的流程是如何的，在各个环节能否有消息揭示等。

范畴层 更深化地经常使用某个配置时，用户对配置的感知。

例如，聊天配置能否支持自定义表情、能否支持发送文件等。

战略层 用户经常使用完产品之后，用户判别能否成功了他的指标。

例如，经过产品启动购物、经过产品阅读须要的内容。

产品设计顺序 产品的设计和用户体验的顺序恰恰是同样的。

产品设计是自下而上的一个环节。

是一个从形象到详细的环节。

先对产品在战略上有一个定义。

而后再依据战略指标，逐渐的详细到产品的配置点、最后到详细的成功细节和设计格调上。

五个档次是自下而上的树立，然而各个档次之间并不是独立的，而是一个环环相扣的相关。

产品设计顺序 这其实是一个很反常的环节，并不是说高层探讨得不够细心。

由于咱们自下而上地启动设计的时刻，是一个逐渐详细和细化的环节。

往往在下一个环节的设计环节中能发现上一层设计存在的疑问，这时刻要适当的对上一个环节启动调整。

战略层 战略层要处置“ 咱们为什么开发产品？ ”的疑问。

这个疑问的关键在于弄分明咱们的用户是谁，用户的需求是什么？公司的商业价值微危险是什么？ 《用户体验要素》关键是针对用户体验的。

所以作者关键提了“产品指标”和“用户需求”两个维度。

作为产品经理，只识别两个维度是不够的。

其实关于战略层的剖析，这些内容会出如今咱们的BRD和MRD外面。

关键包括：商业价值 产品能否为公司带来商业价值，带来怎样样的商业价值。

一些战略型产品的商业价值或许不只仅间接体如今盈利上方。

用户痛点 咱们的用户是谁，有什么特色？咱们要协助用户处置什么疑问，用户须要经过咱们的产品到达什么指标？市场现状和预期 市场的现状如何，能否存在竞品，他们的优缺陷是什么？咱们的市场的预期如何？名目的危险 名目的危险有哪些，怎样规避危险？或针对这些危险，能否有处置方案？名目方案 制订全体的开发和推行方案，确定各个里程碑的内容和日期。

当然，随着市场逐渐进入白炽化的阶段，竞品相似度也越来越高，所以用户体验的作用也越来越关键了。

咱们可以在战略阶段参与用户体验的思索。

能否有亮点的用户体验 很多产品的关键卖点就体如今用户体验上。

比如提供默认方便的内容阅读方式、一键处置照片的配置等。

能否有重大影响用户体验的设计 为了达成商业指标，咱们或许会对产品启动一些商业化的设计。

须要思索适度的商业化能否影响了用户的体验，在商业化和用户体验之间如何平衡。

比如咱们要在产品上参与广告配置，以什么样的方式启动。

间接弹框、还是内嵌到内容外面？ 在这个阶段可以提早对一些产品的细节启动思索，不过切记不要适度地纠结在细节外面。

范畴层 在明白了战略指标后，范畴层要处置的是“ 咱们开发什么样产品？ ”的疑问。

在这个阶段，须要思索“咱们要做什么”、“用户想要什么”。

产品经理经过用户、运营、市场等各个渠道搜集到用户需求。

再联合战略层确定的指标对需求启动剖析、挑选和过滤，最终构成一份完整的产品需求说明书。

需求说明书的作用是将 产品须要做什么 和 产品不须要做什么 明白上去。

说到需求说明书，作为产品咱们或许第一个想到的是PRD文档。

然而，严厉来说模型提到的范畴层并不能齐全对应到PRD文档上。

在PRD外面，除了需求的说明，还会经常使用到原型图、产品结构图等，这些内容应该是归类到结构层外面的。

可以这么说，范畴层对应到了PRD外面需求说明的局部内容。

名目背景和指标 名目的背景和指标无利于名目组对名目有个大略的了解。

假设是小团队，前期名目立项团队介入度比拟高的。

这局部可以简明书写。

配置概述 对配置有个总体的了解。

提供一份配置列表或一个配置结构图。

假设是比拟大的名目，还须要提供产品模块的划分和结构。

需求说明 对每个需求启动说明。

经常出现的方式有配置说明、用例、用户故事等。

关于较复杂的需求，假设有须要可以参与业务流程图等方式进一步说明。

非配置需求 产品的非配置性需求。

如性能需求、格调需求等。

PRD外面最关键的就是对需求的说明，《用户体验要素》这本书对需求的形容提了三个规范，如下：踊跃的 在形容需求时，总会遇到一些异常的状况。

关于这些异常的状况，咱们应该以踊跃的角度去形容。

例如这样形容： “假设用户余额无余，不准许用户支付。

” 阅读者并不知道下一步的举措是如何的。

应该以更踊跃的方式来形容，可以改成： “假设用户余额无余，则揭示用户余额无余，并揭示和疏导用户启动充值。

”详细的 关于需求应该形容得更详细和详细。

以便文档的阅读者可以更好的了解需求。

例如这样形容，则不是很详细： “突出显示用户关注的内容。

” 这个需求可以更详细的表白为： “用户点了关注的内容，放在内容列表的最前端。

”客观的 关于需求的形容应该防止用客观的语气，应该客观的语气容易让阅读者了解有歧义。

例如如下表白，存在着歧义： “提供方便的登陆方式。

” 不同的人对“方便”的了解方式不一样，可以改成这样： “支持经常使用手机号码和短信验证码间接登陆系统。

” 结构层 假设团队外面有交互设计师的话，产品和交互设计的交接点就在这一层了。

假设没有专职的交互设计师团队的话，产品也会担任这局部的设计。

不同的团队产品和交互的职责定位不一样，并不能一律而论。

在范畴层，咱们曾经定义好了需求，曾经明白了咱们要做什么。

到了却构层，咱们从形象的需求逐渐详细成用户可以感知的需求。

同时，结构层定义了产品最终出现给用户的框架，为下一层细化做预备。

结构层的内容对应到了PRD文档的另一局部内容。

产品结构 产品出现给用户的页面和配置结构，是用户看获取的产品的结构，例如，一个社交产品，或许包括聊天页面、朋友页面、团体核心页面。

其中，团体核心又包括了团体消息、设置等配置。

倡导经常使用思想导图的方式将其列明。

消息架构 产品出现个用户的消息的组织方式。

例如一个电商产品，商品的内容包括了，商品消息、用户评估等。

其中商品消息又包括了商品引见、配置参数等外容。

这局部也倡导用思想导图的方式开展。

页面结构 产品的配置和消息在页面上怎样表现。

每个页面大略包括哪些内容。

这局部倡导以低保障原型图的方式来出现进去。

交互流程 用户的操作流程和页面的跳转流程。

用户是怎样口头操作的，页面以什么样的方式照应或跳转。

这局部内容可以在原型图上注释说明。

框架层 只管命名为框架层，不过在这一层咱们逐渐将产品从形象到详细。

到了这一层，基本上能看得出产品的轮廓。

这一层咱们经过曾经制造好的PRD和低保障原型图，逐渐细化成高保障的原型图。

框架层是结构层的细化。

包括了如下的上班：消息设计 对曾经定义好的消息架构启动细化。

例如，在结构层，咱们曾经定义好了商品消息须要蕴含大略的消息。

在框架层再进一步细化，商品的概略包括了，商品称号、商品数量、商品产地等详细等字段。

页面细化 在结构层曾经定义好的页面结构基础上进一步细化。

如页面的详细规划，页面元素的选用等。

这一步将低保真的页面细化成高保真的页面。

交互设计 页面的交互设计，用户操作后页面的照应。

例如，能否须要弹窗揭示、能否须要滑动效果等。

表现层 表现层是将框架层设计好的高保障原型图，最终输入设计稿的步骤。

这个是产品设计的最后一步。

这一层关键是UI设计师的上班。

如产品的配色方案，主题色和辅佐色的选用、产品的格调，扁平格调或许拟物格调等的选用。

用户体验要素的运行 咱们大略可以将咱们日常的上班归类到各个档次外面：战略层 -- MRD和BRD范畴层 -- PRD（局部）结构层 -- PRD（局部）和低保真原型框架层 -- 高保障原型和交互设计表现层 -- UI设计 然而，在运行用户五要素的模型时，也不能完齐全全间接的套用到上班流程外面。

这个模型更多的是提供应咱们一个思索的方式，而并非是一个指点产品设计的流程。

日常环节中，甚至有或许有局部设计环节是跟档次是反着来的。

例如，我经常经常使用思想导图将产品的结构整顿进去（结构层），而后再进一步的细化出需求说明（范畴层）。

然而，实质上还是从需求到结构的一个环节。

另外，不同的团队由不同的构成，有些团队没有交互设计师，产品包揽了需求到交互的一切环节。

产品这个职位在每个团队的配置也不一样。

产品开发环节，有些团队是产品主导的，产品主导了战略层到结构层的各个环节、有些团队是交互设计师主导的，产品只要要担任战略层和范畴层。

然而，这个模型给我最大的启发就是。

无论是产品还是交互，在产品设计时都要注重用户的需求，并且从形象到详细的逐渐设计产品。

交互设计师的必看书籍有哪些

1.《繁复至上：交互式设计四战略》

本书是交互设计的入门书籍，着重引见交互式设计的技术与技巧，讲述如何从指标用户的需求和希冀登程，联合人类自身的心里特色和行为特点，用最方便的方法创立易用、有效而且让用户愉悦的设计。

书中阐释了正当删除、分层组织、适时暗藏和奇妙转移这四个令交互式设计成绩最大水平方便易用的战略。

2.《破茧成蝶》

记切当年我就是靠这本书入门用户体验的，适宜一切互联网产品设计师阅读。

讲的很全，从什么是用户体验设计师、到需求剖析、最后如何验证产品的优劣。

深化浅出的将用户体验触及到的相关概念和上班讲给了读者。

3.《AboutFace交互设计精髓》

这本书如同被誉为交互设计界的《圣经》，可见这本书的重量所在。

产品的三大模型——心思模型、成功模型、表现模型；指标用户的角色模型等等通常和方法都来自于本书。

4.《交互设计深思录》

顶级设计师JonKolko对交互设计的阅历和心得，之所以介绍这本书，是由于作者从深档次的角度去思索设计、思索交互，发人深思。

这本书读一遍必需不够，在不同阶段读它甚至会发生天壤之别的感悟与体会。

5.《用户体验要素》

这本书很薄，一口吻就能读完，这也是作者写本书的一个指标，用精简的言语将用户体验要素讲透讲明白。

作者从五个档次来引见用户体验要素，包括战略层、范畴层、结构层、框架层、表现层。

用户体验不只仅是UED部门的事件，而是从战略层确定公司指标和用户指标时就开局影响着最终产品的用户体验。

它能帮交互设计师树立大局观，懂得能够从公司的视角去思索产品设计的疑问。

6.《用户体验草图设计》

好的交互设计师须要给用户设计良好的用户体验。

本书着重强调设计环节前后两端的平衡，前端重点做好草图和设计创意（确保设计的正确），后端则保障可用性和工程两方面（确保设计被正确实施）。

教你如何做好用户体验草图和创意并将其成为通常。

7.《点石成金：访客之上的Web和移动可用性设计秘笈》

可用性设计是Web设计中最关键也是难度最大的一项义务。

本书作者依据多年从业的阅历，剖析用户的心思，在用户经常使用的形式、为扫描启动设计、导航设计、主页规划、可用性测试等方面提出了许多共同的观念，并给出了少量方便、易行的可用性设计的倡导。

而且让小编十分青睐的是这本书十分短小精悍，齐全可以在闲暇期间阅读，甚至可以一口吻读完。

8.《Web界面设计》

本书既是一本Web界面设计指南，又是一本Web界面实例参考，是无法多得的很细化的交互设计参考书，书中对交互设计中的编辑、隐喻等基础行为做了很粗疏的说明和案例剖析，教人如何让所学针对性的落地。

适宜对交互设计学习逐渐细化。

9.《设计心思学》

一切产品最终都体如今兽性。

咱们知道互联网产品都是为了满足特定的需求而被设计和开收回来的，而需求就是兽性的表现。

兽性是人类心思属性，所以要想洞悉产品和交互设计的实质，必定要了解甚至是相熟心思学，尤其是认知心思学。

《设计心思学》一共有四本，区分是日常设计、与复杂共处、情感召设计、未来设计。

10.《写给大家看的设计书》

一名好的交互设计师也须要较强的平面功底。

上方给大家引见一本比拟好的版式设计的书籍。

这本书作者以其繁复明快的格调，将低劣设计所必需遵照的这4个基本准则及其面前的原理深刻易懂地展如今读者面前。

以上介绍的十本都是纯交互或许设计的书籍，而交互设计是一门综合性很强的学科，触及逻辑学、计算机迷信、心思学、认知学、视觉设计...所以要学好交互设计，光这十本书是必需不够的，咱们要做的只要静下心，缓缓学，缓缓做。

《用户体验要素》要点摘记与思索(2)——五层模型

一个明晰、东倒西歪的体验，由一系列完整的决策组成。

这些决策彼此依赖，告知并影响用户体验的各个方面。

把全体的用户体验上班合成成各个组成要素，以了解体验外衣下的决策环节。

1、五个层面初识 由表及里认知一个产品，可以分为五个层面：表现层、框架层、结构层、范畴层、战略层。

表现层（surface） ：用户所看到的文字或图片（或许短视频）。

一些图片和文字可点击成功某项配置，例如购物车图标；另外一些图片文字就只是提供促销消息。

框架层（skeleton） :表现层下方是网站的框架层，用于提升设计规划，让按钮、控件、照片和文本区域所处的位置能到达最大的效果和效率，详细来说，用户须要时，能记得标识并很快找到购物车的图标。

（用户相熟现有电商网站或APP的规划，在设计新产品的框架层时，正当设计，缩小用户学习的老本。

其余APP也有这个思索，好用且用户学习老本低）结构层（structure） ：结构层比框架层愈加形象，框架层是结构的详细表白方式。

例如框架层确定了在结账页面上交互元素详细的位置，结构层则是设计用户如何抵达这个页面，并且在成功义务后，用户能够去向哪里。

（框架层设计是为了使交互元素规划愈加正当，愈加好用，表如今原型上个元素的规划；结构层确定了配置流程，表如今流程图的设计）范畴层（scope） ：范畴层确定一个特性或配置能否属于网站或APP。

范畴层确定的特性和配置，在结构层来确定他们的组合方式。

（范畴层是选择要不要这个配置，结构层是确定这个配置的详细成功流程）战略层（strategy） ：战略层包括了运营者和用户两个方面想从网站或APP取得什么。

电商来说，运营者要卖出商品，用户要买商品。

（战略层落脚的需求剖析）2、解析五层结构模型 依照 配置型产品 和 消息型产品 分类，五个档次关注的内容如下图所示。

战略层，关注 用户需求 和企业的 产品指标 。

范畴层，关于配置型产品，关键是在创立 配置规格 ：对产品的“配置组合”的详细形容；关于消息型产品，范畴是以 内容需求 的方式发生：对各种内容元素的要求的详细形容。

结构层，配置型产品关注 交互设计 ，定义系统如何响运行户的恳求；消息型产品，设计 消息架构 ，即正当布置内容元素以促成用户了解消息。

框架层，配置型产品和消息型产品都要启动 消息设计 ，即促成了解的消息表白方式。

配置型产品框架层还须要 界面设计 ，也可以说是 布置 好能让用户与系统的配置发生互动的 界面元素。

消息型产品须要 导航设计。

表现层，为最终产品发明 感知体验 。

3、层间依赖相关 另外，须要关注各层之间的依赖相关，介绍驳回 尾尾连贯 的方式，让每个档次的上班在下一个档次完结前成功。

方案名目时，让任何一个层面中的上班都不能在其高层面的上班成功之前完结。

不介绍 首尾连贯 的方式。