通过对它们进行简单分析后可以发现:产品已经提供了12款濾镜,但用户还是找不到喜欢的,说明濾镜的品质可能欠佳;用户希望增加濾镜种类,可能是由于濾镜的差昇化不大,品质一般,难以满足用户的需要;很难找到上次使用的溏镜,可能是因为滤镜的差异化不大;希望增加自定义调节、同一款滤镜的不同强度、濾镜叠加,这些都是用户对濾镜个性化的需求,如图5-17所示。我们同也针对竞品做了简单分析,并查看了用户对竞品的评价,询问了
身边用户对竞品的意见,最后得出如下结论。

例如,在一个资讯类网站中,对于普通的新闻和特色模块采用了差异化的
表现形式。普通新闻采用文字列表的形式,特色栏目采用“图片+文字”的形式
使得每个区块之间可以明显区分开来如图644所示。这样既可以使页面显得灵活多样,减少用户的阅读疲劳,也可以更加突出特色模块。如果都采取相同的表现形式,满屏幕的文字列表或满屏幕的图片,用户对于信息的接受效率就会降低。

10设计师的自我修养
好的设计师
1对设计充满兴趣和激情2有天分3执行力强:不仅要有好的想法,还要坚持执行到底,不惧怕任何阻碍。4情商高5超出预期6有条理7有上进心8眼界开阔、知识面广9乐于分享

从哪几方面来提高
从这些表象上来看,设计师在工作中需要从3方面来提升自己,即专业、沟通、流程。
标准的流程虽然较为固定,但是结合具体况，每个公司、每个项目又会有所差别、设计师需要根据产员、项目的具体情况，选择合适的流程并执行下去、能灵适运用才是最重要的。

再否定中积极成长
1别害怕被否定
2学会忍耐和付出
3识别真相
4适度妥协
5超越自我

11设计师易忽略的工作意识
设计师的品牌意识
保证关联性
力求一致性（平台内一致、平台间一致、内部产品一致）
追求独特性（个性的标志、独特的风格、亮眼的细节）

项目中常见的沟通方式及特点
1通过文档沟通2通过邮件沟通3通过IM沟通4通过电话沟通
5面对面沟通6会议沟通

项目中常见的沟通问题
1敢怒不敢言2用批评代替赞扬和鼓励3单向沟通4思维方式、立场不一致导致的沟通障碍5性格差异导致的沟通障碍6沟通积极性差

如何更好的沟通
1放平心态2换位思考3积极主动4更多肯定、更少批评5真正认识沟通的意义

如果不遵守项目流程,会发生什么样的结果呢
1需求不确定,反复更改
2无具体排期,上线遥遥无期
3没有预留出走查时间,仓促上线
4产品经理一人独大，项目失控
5出现问题难以确定责任

测试过程中的注意事项
1切忌引导性过强
2操作行为永远是重点
3不要忽视现场反应
4考虑使用场景
5感谢被测者，并给予一定报酬

什么是A/B测试呢?
顾名思义就是A方案和B方案的比较。为同一个目标设计2个方案。一部分用户使用A方案,一部分用户使用B方案。通过用户的使用情况,衡量哪个方案更优。

1设定衡量标准
2对同一个用户呈现相同的页面
3保证两个版本同时测试
4单一变量

AB测试的延伸—灰度发布
如果你想对网站进行改版,但又不确定用户会不会喜欢新的版本,也可以采用一种与AB测试很类似的方法—灰度发布。灰度发布是一种能够平滑过渡的发布方式。将旧版作为方案A、新版本作为方案B,让一部分用户继续试用旧版本、一部分用户切换到新版本，然后观察用户反馈和产品数据。如果用户的反应很好,可以逐步扩大范围,直至全部升级。如果部分用户在使用新版本的过程中发现一些问题,可以及时优化。另外,还可以同时对比新版与旧版的产品数据,如P∨、UV、转化率、跳出率等,直观地看出改版的成果或差距。

定性的用户反馈和定量的产品数据
可用性测试和AB测试一般是在上线前和预上线时对设计进行的检验。用户反馈和产品数据则是上线后,用户在真实环境下使用产品的情况,是更加实实在在的检验。用户反馈的所有问题和产品收集到的所有数据,都能真实地反映出整个方案的优劣。
1收集用户反馈
2分析用户反馈
我们可以从内容、功能、使用流程、设计、新功能建议和现有Bug等几个方面对问题进行归纳。
3用数据检验产品目标

08项目跟进—保障设计效果的实现
设计评审的目的
检验目标、发现问题、达成共识

评审前的充足准备
事先考虑所有可能的方案、准备各种设计依据、做好会议邀请工作

如何在评审中掌握主导权
主导流程、提高效率，控制话题、区别和收集有价值的反馈意见、评审后的分析与跟进

如何审核视觉稿
交互与视觉的联系可以说是非常紧密的，交互设计师完成交互稿之后,要向视觉设计师清楚地交代这个方案要重点表现出什么,传达出什么：视觉设计师在做完视觉稿之后，也会请交互设计师审核视觉方案。
我们需要知道:界面中的视觉设计不是艺术作品，正确地理解信息和传递信息是最重要的事、忽略内容而关注形式是不可取的。所以交互设计师要注意视觉稿是不是和交互稿传达的信息一致,是否传达到位、重点突出且层次分明。
1对交互稿理解是否正确
交互设计师需要注意改变是否合理，有没有违背交互逻辑,会不会引起用户的歧义。
2拒绝毫无发挥的视觉设计
3关注视觉层次是否足够清晰
4关注交互细节和状态标注
5在审美方面不要过分干涉

开发阶段，设计师该做些什么
1勤于沟通
2统一的规范和标准
3设计走查

09成果检验—设计优劣可以判断
可用性测试到底是什么?简单地说,就是通过观察用户使用产品,发现产品中存在的问题的一种方法。

设计测试任务该注意些什么
1给出使用目标,而不是直接地操作
用户在实际使用产品时,考虑的是使用目标,而不是具体的操作和功能。
2尽量选择最重要、最频繁的任务进行测试
3符合正常的操作流程

测试用户的选择
1选择有代表性的用户
2用户数量的选择
有调查表明,5名左右的用户可以发现大约85%的问题。所以一般小的功能点,测试3-5名用户即可。新产品,较大的改版和重要功能,可以测试5-10名用户。

设计规范的分类
从不同的维度考虑,设计规范有不同的分类。
从纵向考虑,设计规范可分为交互规范和视觉规范。交互规范一般要先于视觉规范。
从横向考虑,设计规范可分为产品战略级方向的大规范及单个项目中的设计小规范。

1产品战略级方向的规范
这里面又包含两部分内容:一是整个公司或一级部门主打产品的设计方向，如主色调,整套的VI系统吉祥物,门户页面风格布局等等,即品牌规范。
另外就是达成共识的,恒定不变的内容:比如基本控件的设计规范,基本交互的规范,等等
2单个项目中的设计规范
我们就需要根据不同的产品类别设计不同的规范,为每个产品设计详细的规格说明书,比如:流程说明、交互模型、图标规范、界面设计规范,界面实现规范、控件设计规范,等等。

什么时候开始设计规范?
在设计开始之前就制定规范,是很不切实际的做法。你会发现做好的规范在实际操作中是无用且白费精力。
一般在以下这几种情况下,我们可以着手去制定一些规范,从而指导和完善后面的工作。
1大型且重要的产品
2产品结构、页面类型、UI组件相对较单一,可复用的内容较多
3项目人手充足、时间较充裕
4产品线日益丰富,后续设计一致性和可循环的要求被提高
5品牌风格、主题风格已确定完毕,品牌备忘和梳理势在必行
6产品结构壮大,新人不断涌入,沟通和执行效率亟待提升

制定设计规范的原则
制定规范是为了给团队成员做设计指导,所以内容一定要简单易懂、条理清晰。
交互规范一般先于视觉规范,视觉是在交互的基础上做效果
设计规范一般遵循从大到小的原则，即：先制定大的设计方向，再制定项目中单个详细的说明；先制定团队的规范，在制定个人操作上的规范。

写交互说明的诀窍
1尽量使用真实、符合逻辑的数据内容
2不遗漏特殊状态的描述
3避免过长的说明
4避免流水账式的说明
流程图代替文字说明、用表格罗列各种状态、巧妙组织文字说明，如巧妙组织文字说明。用if、else、case"等来组织说明文字也是我喜欢的方式,当然开发人员对此更为喜欢。（case1库存下降且少于用户的购买量，case2:价格变动，Case3: Case1& Case2，else:跳转到订单成功页面）、制作动态效果
5关于重复出现的模块
比如下面这个模块,在购物车、个人中心等多个页面都会出现。为了节省时间,提高效率,我把这个模块独立出来,并起名为“迷你收藏夹"”然后在其他页面上只留个空位就可以了。
6如原型有修改,不要口头沟通,而要更新交互说明并告知大家

什么是设计规范
设计规范包含很多内容,比如交互规范、色彩规范、Logo规范、UI图标规范、控件规范,等等。

没有规范统一出现什么问题
1不同频道/模块独立设计
2同类功能组件存在多种样式
3同类元素多样性
即使是同一个设计师,设计同样的元素，也不可能保证和之前的结果完全一致，过多的样式不仅会增加大家的工作量、隆低工作效率、也会对界面的友好性、易用性、品牌的传达等造成很大影响。
4设计效率低下
5设计质量难以把控

规范解决了什么问题
1“一致性”形成鲜明的产品特征，增强用户粘度
2提高易用性
3满足团队协作需求
4其他

你真的会画线框图吗
1通过明暗对比表达
2不使用截图和颜色
3合理的布局
建议在确定页面布局时，提前和视觉设计师沟通商量，避免不必要的返工。
4遵守栅格规范
先简单介绍一下栅格的概念。删格设计系统，是一种平面设计的方法与风格。运用固定的格子设计版面布局，其风格工整简洁，已成为当今出版物设计的主流风格之一。
5标记第一屏高度
我们都知道,最重要的内容,尤其是重要的操作按钮一定要在第一屏内完全显示,否则用户第一眼看不到,就有可能放弃这个页面，从而严重影响转化率。
如果不那么严格的话,第一屏高度也可以定为600像素,在原型稿上标明即可。
6表达清楚UI逻辑
当没计一个内容元素较多、逻辑层级较复杂的页面(如表单)时,为了避免混乱，我们需要提前整理一下这些内容,以保证文字、链接、操作等内容的样式符合它们所代表的重要程度,并把各种复杂的情况归类成有限的几种形式，给用户一个合理的视觉引导。
比如设计收藏夹页面时,里面既有主导航、又有二级导航、既有链接，又有文本:既有需要重点突出的内容,又有需要虽弱化的内容。如果每种情况都出一个样式的话,那就会有无数种样式。但我们知道,一个界面的字号和颜色应尽量不要太多,那具体该怎样处理呢?
一般来说,操作的优先级大于链接，链接的优先级大于文本，最重要的操作一般是用按钮来表现的，如收藏夹中的“加入购物车”按钮，然后是普通操作,比如“对比”等；最后是消极操作，如“删除”。我们可以把普通操作和需要重点突出的链接设计成同样的样式。
7考虑视觉实现后的效果
交互没计师在绘制线框图时,不仅要考虑到清晰的逻辑,还要考虑视觉实现后的效果。不然很可能会导致视觉设计师频繁的返工。
8了解视觉趋势
时刻关注一些视觉趋势,有助于我们在审美上和视觉设计师站在较为一致的立场,使大家的沟通更加顺畅。

状态:包含默认状态、常见状态、特殊状态等。
状态主要指默显示的文字、数据、选项等。这些内容需要注明,否则开发人员可能难以意识到这是用户填完的效果、还是默认就有的。
常见状态主要指针对某一个模块,经常遇到的一些状态。这些状态都需要在原型上表述出来。比如一个普通的积分模块,一般会出现3种状态:未登录状态、登录后未签到状态、登录后已签到状态。
特殊状态一般指非正常情况下的样式、文案、说明等。

操作:包含常见操作、特殊操作、误操作、手势操作等。
常见操作主要指正常操作时得到的反馈状态。
特殊操作主要指一些般极端情况下的操作。一般,用户不会这么操作,但是一旦遇到极端情况,还是要想好应对措施,因为对于开发人员来说,不管是正常的还是极端的操作情况,他们都要去编写对应的代码。
误操作主要指当用户操作错误时的情况。不过我们在设计时要尽里避免用户犯错的机会。
手势操作主要指用户使用移动产品时的操作方式。常见的有点击、双击、长按,捏,伸、滑动,等等。

反馈:用户操作后得到的反馈动作,包含提示、跳转、动画等。
提示主要指操作后,系统反馈给用户的文字说明等。
跳转主要指点击某个链接后,页面跳转到哪里。设计师需要在原型上注明跳转时是“原页面刷新”还是“新页面打开”。
动画主要指用户操作后,系统通过动画的方式反馈给用户。动画给人的感觉比较友好、趣味性较强,是非常常见的一种反馈形式。
在移动应用中,动画反馈的形式更为常见。因此设计师一定要在原型上表述清楚动画的形式,必要时可以制作一段动画演示效果给开发人员。
总而言之,写交互说明时主要应记住2条内容:除静态页面外,还需考虑各种动态情况；除正常情况外，还需考虑特殊和错误情况。

简要说明与信息结构
1变更日志:同需求文档一样，原型的设计也不可能一次到位,一般都需要经过沟通,评审后略做调整。尤其是对于比较大型,周期较长的项目,不可能等原型全部设计完毕再进行评审,往往是做一部分评一部分,评审后定期更新。在这种情况下,填写更新日志就显得非常重要了。这样可以方便项目成员看到每次更改的内容,然后重点关注这部分内容就行了,从而大大提升了工作效率。变更日志一般包含日期、变更内容、变更原因、备注等内容。


2版本说明:和更新日志类似,只不过更新日志以天为单位,而版本说明以版本号为单位,适合快速迭代且迭代周期比较固定的项目。比如某产品,每两周固定迭代一次,那么就需要列出版本说明,告诉大家此版本改变了哪些地方,让项目成员一目了然。
版本说明需要包含版本号、日期、更改内容等。

3信息结构:产品内容都有什么,它们是如何组织起来的,页面层级又是如何分布的,等等,这些在信息结构中都有体现信息结构可以让项目成员快速浏览到产品内容,功能、结构等重要信息,做到一览全貌。

任务流程与页面流程
任务流程:是指用户使用产品时,它的每一步操作会遇到什么结果,系统如何反馈,等等。
页面流程:比任务流程图更清晰,具体。通过页面流程图,不仅可以看到具体的页面,还可以看到用户如何通过操作,从一个页面跳转到另一个页面的完整过程。任务流程图是页面流程图的基础和依据。

线框图与交互说明
原型既包含静态的页面样式,也包含动态的操作效果。线框图代表静态的部分,而交互说明则代表动态的部分。

交互说明主要有以下几种类型
限制:包常范围值、极限值等。
范围值主要指数据的取值范。比如,当你的界面上出现了下拉菜单、筛选按钮、滑块等控件时,你必须标注清楚它们的选择范围,否则开发人员就不清楚该如何设定。
限制值主要指数据的显示限制。比如,最多应该显示多少字数,超过时如何显示，是否折行等。

2惊喜的力量
惊喜通常会令人开心,因为这是超出预期的体验。有些网站在一些小角落中隐藏着一些小惊喜。这些“惊喜”虽然在功能方面没有什么实际的用处,但偶然间发现后,会增添一份特殊的喜悦和乐趣。这些“惊喜”还可以引发用户的好奇心,增强他们的探索欲望。这让我想起了小时候玩超级玛丽时,误打误撞顶到了隐形蘑菇时的惊喜。在之后每次玩的时候,都要再去相同的地方找那个隐形的蘑菇。

3情境的烘托
为产品设计一个故事情节,通过视觉、动画和音效的烘托,把用户带入一个情境中。这种讲故事的方式可以很有趣味性,也可以很感人,能够有效吸引用户的注意力,调动起用户的情感。
情境烘托很适合用在活动页面的设计中。活动页面一般都会有较大的空间来设置一个完整的故事。如果选择人们比较有共性的经历,就很容易勾起用户的回忆。

07设计标准—好的设计需要表达
原型的由来—设计方案的表达
原型是设计方案的表达,是设计师的重要产出物之一,也是项目团队参考评估的重要依据。它是产品功能与内容的示意图,既包含静态的页面样式(线框图），也包含动态的操作效果（交互说明）。
需求文档也包含了对功能和内容的说明,但原型并不是简单的图形化的需求文档，它必须经过设计规划阶段,通过设计加工，形成最终结果。

为什么要学习原型制作?
除了能够更好地表达自己的设计方案,提升设计师的专业水平以外,原型还有一个非常重要的作用:它是项目开发的标准和依据。原型的使用者有产品经理，初觉设计师、前端工程师、开发工程师、测试工程师、可能还有商务，法务人员等。

低保真原型：与最终产品不太相似的原型。它可以是纸面原型(草图),也可以是用软件绘制的线框图。

高保真原型：在外观、操作上与最终产品基本一致。通过软件制作的高保真原型,其实就是告诉大家,在用户做什么操作后会出现什么结果。高保真原型相当于一个高级模型,更适合做展示用,并不等同于真实的产品。

2积极的反馈
人们在表达之后,总是希望得到积极的反馈。提供积极反馈是与用户互动的一种方式。想象一下,如果在操作之后,网站长时间没有响应,用户就会有种和人们交谈却被忽略的感觉,怀疑自己的操作是否正确。这种感觉令人感到泪丧。当用户操作有误时,系统往往直接给出错误提示。一个红色的叉又常会令人产生挫败感。但当用户成功完成某项操作时,我们是否赞美鼓励过他们呢?人们在社会交往时具有的期望,在使用互联网产品时也会有。积极的反馈可以增强用户的信心,提升用户体验的愉悦感。

3贴心的提醒
在使用产品时，用户难免会有遗忘或是疏忽的时候，此时给予用户一些贴心的提醒，可以提升用户对产品的好感。
登录网站只需要花费十几秒的时间。对于一些登录框设计的细节,也许很多用户都不会察觉到。但如果有一天,你在使用一个不常登录的网站时,发现自己忘记用户名是邮箱还是昵称,甚至根本想不起来自己到底有没有注册过时,你也许会选择重新注册网站,或是干脆放弃登录。这样的经历不仅会让用户感到沮丧,还会降低网站的转化率。

如何调动用户的情感
产品能通过功能满足用户需求,是重要的,容易让人学会并顺利使用,也是重要的,更重要的是,产品要让人感到愉悦并能深深地吸引用户。

1互动的乐趣
人类是社会化的动物,在意情感的双向表达。在使用互联网产品的时候，人们希望可以体会到互动的乐趣,而不是单向地接收信息。无论是灵动的交互动画、操作后的反馈效果、误操作时的提示,还是像对话一样亲切的文案,都是机器和用户互动的结果。应该让用户感觉到,自己的一点一滴都能被系统感知,满足用户的参与感和被尊重感。利用互动因素可以极大提升用户界面的趣味性,调动用户的情感。
丰富的动效可以使界面更加生动、充满活力,也可以提升产品的品质。

捕获用户的芳心
1拟物化的视觉
最直接的借鉴现实世界的设计方式就是拟物化。通过模拟现实中的物体，使用户产生熟悉感,让信息与功能更加易于识别和理解。随着苹果产品的风靡全球,拟物化成为了很多产品调动用户情感的设计方法。
有些产品会从形态,色彩、肌理材质,环境光照等方面直接拟物，在视觉设计方面，表现的精巧而考究。逼真的视觉效果，打破了用户对虚拟界面冷冰冰的印象,让用户感到自己仿佛是在使用现实生活中的物品。

2隐喻化的操作
直接拟物化的设计也有一定的局限性。并不是每种界面中的元素都可以在现实中找到对应物品的。视觉表现难以拟物时,也可以通过模拟现实中的操作，使用隐喻的方式让用户对操作感到熟悉。《 ios Human| nterface Guidelines)
里面是这样解释隐喻对体验的影响的:当应用中的可视化对象和操作与现实世界中的对象与操作类似时,用户就能快速领会如何使用它。
比如很多手机应用的设置界面,都设计在主界面的背面。当单击“设置”按钮时,主界面采用翻转的动效,与设置界面形成一种空间关系。

贴心的设计惹人爱
1可控的感受
调查表明,如果界面没有任何提示,80%的用户等待超过2秒就会直接关闭窗囗。如果界面有提示或是加载状态,用户的离开率就会极大地降低。加载状态提示可以增加用户对界面的可控感,形成操作预期,使用户安心。
为了增强用户的可控感,界面还需要预先提供提示,向用户透露一些接下来将要发生的事情,让用户建立预期。系统需要根据用户的操作收集信息,掌握规律,正确地预计未来可能出现的问题,并提前采取措施或提醒用户,将可能出现的冈险消除在萌芽状态。如果在写笔记时,操作失误,关闭了浏览器窗囗，而系统却没有提醒我们,就像是在公路上开车,前面有个坑,却没有任何警告,会令我们措手不及。

理性的规划∨S感性的界面
在细化个个具体的界面时,我们又常常纠结于各种细节中而无法自拔。比如界面内容如何排布?图片应该大一些好还是小一些好?按钮放左边还是右边?对于功能类似的表单,可以在视觉效果上做成完全一样的吗?
出现这种状况，是因为在做设计的过程中,设计师需要用到不同的思维方式。在需求分析、设计任务流程，信息架构、导航、操作逻辑等阶段，设计师需要使用偏理性、逻辑的思维方式。在绘制界面细节时，设计师又需要使用偏感性的思维方式。因为用户使用产品时是相对感性的。他在使用你的产品时不会刻意去思考，而是通过感觉来判断你的产品是否适合他。

1以人为本的界面设计
目标明确的用户在使用产品时会按照流程一步步完成任务,而对于目标不明确的用户,则需要通过更多的展示内容来吸引他。用户被吸引了才有可尝试操作,进而完成任务。

2帮助用户找到想要的东西
信息组织与分类的目的,就是要让信息易于找寻。让有明确目标的用能够快速找到所需信息;有不确定目标的用户,通过浏览和寻找,一点点时确自己的需要,最终找到信息;让没有目标的用户在探索中激发需求。所以,互联网产品中信息的组织与分类,要满足这3种情况。通过合理组织网站所要承载的信息,帮助用户找到他们真正想要的东西。

3吸引无目标用户
对于无目标或目标不明确的用户来说,我们不能再用理性、逻辑的思维方式来对待他们,而是要充分地换位思考,用感性的思维方式来给他们营造贴心、友好,有吸引力的界面。

4符合用户心理模型
在设计过程中,设计师也该充分考虑到用户是如何理解产品的,并在交互设计的表现形式上更贴近用户的心理模型,避免将枯燥的逻辑直接呈现给用户。

信息量太大，页面怎么摆

1让页面层次不言而喻
根据“用户想看到什么”和“我们想让用户看到什么”为内容模块排列优先级。
逻辑相关的信息在视觉上分为一组，内容或重要程度不同的信息在视觉上体现出差异，逻辑上有包含关系的信息在视觉上进行嵌套。

逻辑相关的在视觉上分为一组:让相关的信息在视觉上分为一组。可以利用“接近原则”,将相关内容组织到一起,以使页面之间的逻辑关系更清晰。
在设计界面时,将元素分好类后,在模块与模块之间、段落与段落之间、广告与内容之间、标题与正文之间划分几个固定的高度。在为整个页面排版的时候，严格按照这几个间距进行排布，从而形成整个模块与模块、内容与内容之间的节奏感。用不同的间距表明界面内容的关系。

内容或重要程度不同的在视觉上体现出差异:对于同类信息可以使用“接近原则”，对于内容或重要程度不同的信息就要使用“差异原则”。因为不同信息,如果表达形式过于类似,会造成误解,需要强化差异对比。

逻辑上有包含关系的在视觉上进行嵌套:逻辑相关的部分,在视觉呈现上也应该是相关的。要让用户一眼就能看出内容之间的关系。

2让重点信息“跳出来”
我们可以通过视觉设计的方法,如字体加大加粗，色彩对比、添加背景色留白等,强调界面的重点元素。而其他非重点的元素应该尽量藏起来,或是显得暗淡些,从而使界面的重点“跳出来”。

3将次要信息“藏起来”
随有产品的发展、功能的增加，很多网络产品正在变得越夹越臃肿，界面上的元素也越来越多，调查表明,80%的用户只会使用20%的功能，所以，设计者不应将那80%只有专家用户才会使用的功能放在显眼的位置。为了不影响新手和中间用户使用,我们应将那些次要的信息“藏起来”,待用户需要时再将它们展示出来。

无论是电商网站、门户网站还是社交网站,大多数都会设计列表页。列表页往往要展示很多信息,用户会通过快速扫描的方式,捕捉关键信息。