该书定位:是AJAX之父的经典之作。本书用简洁的语言系统化的诠释了设计、技术和商业融合之最重要的发展趋势。全书用清晰的说明和生动的图形分析了以用户为中心的设计方法(UCD)来进行网站设计的复杂内涵,并关注思路而不是工具或技术,从而使你的网站具备高质量体验的流程。
版本:第2版,2016年1月第1版第16次印刷
当我读完本书的第一感觉就是言简意赅、句句在理、一字一金,并且通过清晰的架构和缜密的逻辑讲述着一个有着真正意义、以用户为中心的产品该如何定为、从何处思考、如何完善等一系列问题。也许对于第一次阅读的人群来讲,会比较空洞乏味,但是我觉得这就它就像无形的线,可以随时牵引你找到方向。本书主要从用户体验出发,在产品诞生至成长的战略层、范围层、结构层、框架层及表现层五个层次分别讲解,细致清晰。
在最底层完全不用考虑网站、产品或服务最终的外观,只要关注满足目标用户的需求;当在最顶层只要关心产品所呈现的最具体的细节问题就OK,这是用户最直观的感受。也就是说随着层面的上升,所作决策会逐渐减少相应越来越注重精细的细节。
1、战略层
书中对于战略层的定义是由两个问题引出的:
■我们要通过这个产品得到什么?
■ 我们的用户要通过这个产品得到什么?
这两个问题的答案正是描述出企业的产品目标以及目标用户的用户需求。换言之,所谓产品战略层就是要找准产品定位,给一个产品项目设定出清晰的目标,犹如作战计划一般。要有整个项目的总纲要领抓稳用户需求和痛点,为后面产品出世详细步骤奠定基础,清楚定为产品的市场愿景。
那什么叫做用户需求?该怎样把握用户需求?抓取出用户需求后怎样应用呢?这些问题可以说是一个产品能否受到用户青睐的基础和关键,基于本书的理解,笔者做出自己的分析和理解:
首先,所谓用户需求就是明白用户想要得到什么,清楚用户的行为习惯,把握住用户心理从而能够进一步挖掘出用户的潜在需求,做出符合甚至超出用户预期的功能,实现产品的市场愿景;
其次,如何准确把握用户需求有诸多种获取的途径,例如问卷调查、用户访谈、可用性测试、数据分析等等。对于不同产品采取相应的方法也可同时并用多种方法;
最后,互联网时代数据是王道,一切靠数据说话,对于收集到的用户行为、需求进行数据分析,将用户类群进行细分,再根据产品定的定位最终确定出产品的目标用户群。
2、范围层
一个产品的战略定位确定后,下一步开始进行产品架构、设计,对于范围层来说,由结构层确定网站各种特性和功能最合适组合方式,而这些特性和功能就构成了范围层。当确定下来宏观的产品目标和定位,进一步制定产品功能和内容,内容需求常伴随着功能的需求,内容主要通过内容管理系统进行管理,需求近一步来定义用户需求,如前所述的获取需求、数据分析、应用数据制定相应内容呈献给用户,在此期间可以设定相应的人物角色,再细致分析人物模型改进内容。
对于产品功能的设计要具备功能规格说明,实际写出该功能存在的意义,针对用户的何种行为以及会对产品整体产生何种效益,与其他功能之间的关联等等关系,总之越详细越有利于和开发人员及其他人员沟通交流,也利于促进产品开发设计进程。在确定功能时需要产品人员排列出需求的优先级,完成产品定位目标的同时也要追求经济效益和保证产品体系的完善。
3、结构层
该层是抽象概念转化为用户体验具体要素的关键,主要包括交互设计和信息架构。展现交互最直观的方式就是建立概念模型,一个概念模型可以反映系统的一个组件或整个系统,使用一个熟悉的概念模型可以让用户快速熟悉场景,增加亲密度。当产品符合现实某个场景或物体的特质,可以进行拟物化的运用,但互联网产品应与实物做区别,切勿照搬现实物件的设计模式,互联网产品要求的是简洁、直观、便捷,不要让用户过多思考和动作。
锤子手机在拟物设计方面就是比较优秀的实践者,以锤子时钟APP为例:
整个APP具有经过细致思考的拟物化设计,每个功能结构由一个具有相应功能的实物代表:时钟,闹钟,秒表,计时器。具有极强的表现能力,加上极简主义的设计,抛弃了大部分的时间标志,可以说拟物而不冗杂。令人惊喜的是计时器时间选择由下拉标尺完成,同时倒计时有一个滴答滴答的声音效果,视觉听觉体验俱佳。
信息架构处理的是人们获取和处理信息的过程,可以采取的方式有从上到下,即根据产品目标与用户需求直接进行结构设计;从下到上,主要是根据对内容和功能需求的分析而来。这些方式都有一定弊端,要么容易忽略掉细节,要么就过于追求细节的设计而不利于后面产品迭代。信息架构中基本的单元是节点,可以用许多不同的方式来安排,通过对节点的调整实现对网站的改进。
4、框架层
在该层次需要完成的是确定出很详细的界面外观、导航和信息设计,也就是让结构层的内容更加具体来展现。界面设计就是让用户通过该设计进入到之后设计的具体内容;导航设计则为用户的行为进行引导,让用户顺利完成整个路径;信息设计就是向用户传达想法,无论何种类型的产品信息的表述传达必不可少。
■界面设计:需要组织好用户最常采用得行为,让这些界面因素以最容易的方式获取和使用。可使用的工具有:
文本,具有非常普遍的信息表达能力;
复选框,允许用户独立的选择各个选项;
单选框,允许用户从一组互斥的选项中选择; 文本框,允许用户——等待用户——输入文字;
下拉菜单,提供和单选框相似的功能,但他们在一个更紧凑的空间中完成这件事;
多选菜单,提供和复选框相似的功能;
按钮,可以用来作诸多事情。
等等。。。
■导航设计:
全局导航:提供了覆盖整个网络的通路
这种导航还是比较常见的,PC领域往往以顶部导航栏承载,比如UI中国网站的导航设计:
在移动端,全局导航往往以Tab(iOS设计规范)或者drawer(Android设计规范)的形式表现。同时移动端也可以玩出一些花样,比如天猫APP的下拉全局导航,基本上可以在任何一个页面通过下拉的方式,触达核心链路,以及进行分享或刷新的操作:
局部导航:提供给用户在这个架构中到附近地点的通路
PC端应用比较多的就是面包屑导航,移动端导航栏则是比较常见的局部导航。
辅助导航:主要作为一种辅助、快捷工具
上下文导航:是嵌入页面自身内容的一种导航
友好导航:给出超用户预期的导航,作为一种便利途径
■信息设计:
将信息根据不同任务、需要进行相应分类,可以运用的工具主要有线框图,它可以包括不同程度的细节。
5、表现层
一个产品的表现层犹如我们人类的外貌,是用户一眼就看的东西,主要的是感知设计。在这里,内容、功能和美学汇集到一起来产生一个最终设计,以完成其他四个层面的所有目标并同时满足用户的感官感受。一般用户感知产品即是通过视觉、听觉、触觉、嗅觉和味觉来体验产品,但不要求一个产品覆盖全部的感知,根据产品的定性和服务适用人群的特性重点突出某一或几个感知设计。如香水产品,应重点突出气味的研究与设计,而一辆汽车的设计,车内气味只是一个小小的影响因素。应用最为普遍的是视觉和触觉,在互联网产品的海洋中若想让自己的产品在同类竞品中脱颖而出,应让用户一眼捕捉到自己想要看到的东西,也就是视觉凸显。不只是产品布局、设计的美感还要同时有着让人愉快的内容呈现,来吸引用户跟随之前所设计的导航步骤一步一步完成我们最开始期望的目标。
界面感知设计既要保持一致性还要有对比,一致性要求界面整体整洁有条理,一般应用宫格形式,对比要求突出重点区域形成对衬,起到良好引导用户行为的效果。
左上图没有任何凸显,所有元素均衡分布,整体感觉一览无遗但却不知道该首先差点哪一点;而对比就可以彰显出部门元素或部分布局,正如右上和左下图示,对于没有目标性浏览的用户可以运用特色内容吸引其注意力同时将增大这些潜在用户的转化率;任何事物过犹不及,正如右下图示想要凸显任何一个内容就会导致混乱的感觉。
在移动端,由于屏幕变小,用户的使用时间变得更加碎片化,因此,有效信息的凸显变得尤为重要,高质量大图配合简约的设计,往往抵得上千言万语。
如上图,宫格设计思路下,网易严选,造作,虎嗅这三个APP,通过质量优秀的图片,能在一瞬间吸音用户的吸引力,内容的浏览量也会比较高,相应的,品牌,内容甚至APP的调性在用户心中也能得到比较好的深化。
伴随一个产品完整周期的必不可少的要素是用户体验、用户需求,以用户为中心对产品进行迭代以近完善。当然在开发过程中不能偏离最初确定的战略目标和产品市场愿景,听用户之声同时坚持主见才能造就越来越完善的产品。