沟通

刻板印象有好有坏。在合适的场景、时间、项目中，去最大化它的积极作用，尽量避免它的消极作用，才能真正的平衡设计、工作，甚至生活。

上篇文章介绍了交互框架与布局的设计， 详情请见《交互总结篇（一）：框架与布局》，而本文作为交互设计总结篇的第二篇——流程逻辑篇，主要是系统地整理一下交互流程设计所需要思考的方向。指由两个及以上的业务步骤，完成一个完整的业务行为的过程。

之前写过类似的文章，想写的东西太多，结果什么都没讲明白。所以重新写一套入门的教程，分「了解交互设计」、「交互设计的职能范围」、「交互设计的常用方法」……几个章节把我对这门行业的理解和经验做个分享。

Tiger, Run! ：我已经做了几个月的交互设计 师了，有不少人非常好奇想知道「没学历、没工作经验的我是如何找到工作的」。随着市场的逐渐饱合，我想分享一下我的故事，来鼓励那些没有任何设计经验、HCI（人机交互）学历的人，得以继续追求自己的梦想。

一直在看奇葩说，听到很多次的一个词叫“刻板印象 ”。而人之所以有“刻板印象 ”，是因为有categorical thinking（类别型思维），它往往使我们产生对事物的固有看法和理解，是在看到某些特定人、事、物时第一时间想到的，这些就形成了“刻板印象 ”。毋庸置疑，使用“刻板印象”（经验）能无形中提升工作效率；减少沟通和开发测试成本；也不会太多的打破用户习惯。然而，它也会带来负面影响，让我们对真实世界失去客观判断。

页面框架设计只是整个产品设计中的一环，不要把眼界局限在这一环，也不要只站需求、只站在交互、只站在视觉上思考问题，从多个角度看问题，你才会学会成长。

空状态，或称零数据状态，很多时候不太招设计师的待见。我们基本都是在主要流程界面的设计工作完成之后才会回过头来考虑完善一下，因为从表现上来看，空状态给人的感觉就是临时性的，有些微不足道。“用户会尝试多个同类app，然后在接下来的3到7天内决定其中的哪些不合适。对于’像样的’app，一旦用户决定保留超过7天，那么将会比较长久的存留下去。成功的关键在于怎样使产品在这3到7天当中保持与用户的良好互动。” Ankit Jain – Quettra“很多时候，人们放弃一款产品的原因其实都是我们可控的，例如他们无法一目了然的看出与你的app产生互动之后能给他们带来什么好处。” – Patrick Mckenzie

随着时代和技术的发展，网页设计 的流程正悄无声息地发生着巨大的变化。精准具体的设计交付列表不再是网页设计 的唯一标准，静态页面设计在整个设计流程中所占的比重也逐步降低，正如同Stephen Hay所说，我们所设计的不再是单纯的页面，而是包含诸多组件的一整个系统。

当谈及用户体验 相关的文档之时，线框图和原型相关的文档无疑是其中最重要的。但值得注意的是，用户体验 所涵盖的范畴不止于此，它们也仅仅只是个开始。实际上，我们发现还有四份文档也是日常用户体验 设计中极其实用的文档。这四种文档的诞生，是为了帮设计人员更容易了解用户，更方便作出争取的设计决策，打造优秀的设计和成功的产品。

鸿影：一份设计文档 的 结构大概可以分成Background项目背景、Schedule排期、History版本历史记录、Information Architecture信息架构分析（包括Site Map、Experience Map、Flow等）、Framework框架设计、Wireframe线框图和Mockup视觉稿等。取决于实际项目的情况，部分内容可以省略，也可以 加入更多，比如Storyboard故事板，Prototype可交互原型等。

交互设计 从来都不是简单的事情。可靠的交互通常需要借助对用户行为的深入分析，然后有针对性的精心策划。可是随着新的技术和新的交互模式的不断涌现，事情就变得不是那么容易了。

设计风格的配色除了要注意男女性的喜好差别，还应该重视通过冷暖色彩+明暗亮度搭配表现给用户的印象和心理感受。详见《色彩在移动APP设计中的应用》

在上篇《APP界面设计风格》确定下来后，产品经理（兼交互设计）还不用着急将所有的交互稿扔给设计师进行细致的界面设计。在细节设计启动前，拉上设计师和安卓前端开发、ios前端开发一起商议确定设计规范先吧！

1、用户角色（Persona）：Persona文档（控制在2~5个）通常需要包含你的目标用户。作为Persona中的虚构的角色，它的属性和特征是 基于产品研究和用户定位来设定的，用作后续设计过程中所面对的“理想用户”，本质上，它就是一个占位符。作为人物设定，其中会包含个人信息，远不止于年龄 和收入信息这么简单。Persona 文档的目标是利用角色来验证你的目标用户是如何感受如何看待你的设计的。
2、移情地图（Empathy Map）：它像是一个轻量级的Persona文档，在资源短缺时间紧的状况下，可以使用这个文档。Empathy Map 将 Persona 中的角色的个性和性格部分移除了，更加专注于用户在特定情况下的感受。
3、用户剧本（User Scenario）：如果Persona 是帮你设计了一个故事中的角色，那么User Scenario 就是故事的剧本。用户剧本通常是围绕着一个特定目标来设计的。比如说，第二天是母亲节，要为母亲预订一份礼物。目标很明确，要达成目标，用户需要点击几次 按钮，走哪些流程，需要多长时间，如何在过程中融入情感，贯穿始终。对整个用户流程有了预判之后，设计师对于UI和UX的设计就有了把握。
4、用户地图（Customer Journey Map）：这份文档同上门的用户剧本很像，但是它比起前者跨度更大，贯穿体验设计始终。设计人员可以对产品的背景有更深入的了解才能更好地设计，而产品投 入使用之后也不是最终结束，这也是跨度如此之大的原因所在。用户旅图将会涵盖角色信息、用户剧本和移情地图的全部信息。这么设定并不是要让用户旅图成为一 个大杂烩，而是要将用户性格和用户流程、交互过程结合到一起来看待问题，每个阶段不同环节，都牵涉到不同的情绪和情感。Affordance 是 James J. Gibson 造出来的一个词，Gibson 是20世纪最重要的认知心理学家之一，他的生态学式视知觉论和直接知觉为认知心理学开辟了新的领地。affordance 是 afford (提供、给予、承担)的名词形式，环境的 affordance 是指这个环境可提供给动物的属性，无论是好的还是坏的，所以我认为“可供性”是一个合适的翻译。Gibson 用来解释 affordance 的例子是这样的：如果一块地表面接近水平（而不是倾斜的），接近平整的（而不是凸起或凹陷的），以及充分延伸的（与动物的尺寸相关），如果地表面的物质是 坚硬的（与动物的重量相关），我们可称它为基底、场地或地面，它是可以站上去的（stan-on-able），可让四足或两足动物保持竖直姿势，它是可以 行走（walk-on-able）和跑动（run-over-able）的，它不像水表面或沼泽表面之于一定重量的动物那样是可陷入的（sink- into-able）。列出的四项属性——水平、平整、延伸和坚硬——它们是这个表面的物理属性，如果以物理中使用的度量衡去衡量它们的话，但是对于特定 动物的支撑可供性，它们必须与动物关联上才可以被衡量，它们不是抽象的物理属性，它们是为所指动物特定的，与动物的姿势和行为相关，所以 affordance 不能像我们在物理中那样来衡量。能指和所指是语言学上的一对概念，能指意为语言文字的声音，形象；所指则是语言的意义本身。按照语言学家或者哲学家们的划分，人们试图通过语言表达出来的东西叫”所指”，而语言实际传达出来的东西叫”能指”。

这事发生在国外，其实真实情况未知。纽约时报出了一篇报道，称亚马逊逼流产员工立刻回来上班，很不人道有没有？

在公司工作，任何职业都不可能单兵作战，协作是永恒的主题，而每一个需求和任务的实现，都是各方通力合作的成果。作为交互设计师，除了做好自己的设计工作之外，还需要花费大量的时间与产品、运营、客户端开发、前端开发、后端开发一起协作和沟通。

[核心提示] Google 为什么要换 logo，这个新 logo 是以什么样的理念和思路设计出来的？来听听 Google 设计团队自己的解释吧~

Specifies the initial zoom factor for the window or viewing area. This is a magnifying glass type of zoom. Interactively changing the zoom factor from the initial zoom factor does not affect the size of the initial or the actual viewport.A two-dimensional transformation is applied to the coordinate system an element renders in through the ‘transform’ property. This property contains a list of transform functions. The final transformation value for a coordinate system is obtained by converting each function in the list to its corresponding matrix (either defined in this specification or by reference to the SVG specification), then multiplying the matrices.The value of the transform property is a list of applied in the order provided. … specifies a scale operation using the [sx,1] scaling vector, where sx is given as the parameter. … specifies a scale operation using the [1,sy] scaling vector, where sy is given as the parameter.

译者语：无论是对于印刷、网站或是电视广告来说，排版都是我们用来沟通信息的主要方式。排版之重要性我想已无须赘述。然而，“理解”和“实践”还是相差十万 八千里的，特别是在网页设计中，“一个字号走天下”的想法可以歇歇了。我们或许都听说过响应式网站，但我想你们中可能很少有人知道什么是响应式排版吧。