动效

今天咱们要聊的是“城市指南”（Big City Guide）网站这一概念设计案例研究。

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

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 不能像我们在物理中那样来衡量。能指和所指是语言学上的一对概念，能指意为语言文字的声音，形象；所指则是语言的意义本身。按照语言学家或者哲学家们的划分，人们试图通过语言表达出来的东西叫”所指”，而语言实际传达出来的东西叫”能指”。

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

小白叨一叨：九月份设计圈的干货 合集来咯，包括前端开发、设计神器、设计素材 （字体、PSD等）、以及一大波实用的酷站推荐，全是精选干货 ，快来收吧！

举个简单的例子，一个人字写得很好看，但他一定能写好文章吗？一个作家字写得极丑，但人家书写的好啊！所以人家才能成作家。

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.

译者语：本文是我在Smashing Magazine看到的一篇关于如何在移动应用设计中运用微动效的译文。初次翻译文章，很多词句用的可能不太妥当，在这里给大家作揖了！knock knock……

User Experience is “a person’s perceptions and responses that result from the use or anticipated use of a product, system or service”.— ISO 9241-210The extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use.— ISO 9241-11— Baekdal, T., 2006. The Battle Between Usability and User-Experience [Online] Available at: The Battle Between Usability and User-Experience–Nielsen Norman Group, 2007. User Experience – Our Definition [Online] Available at: http://www.nngroup.com/about/userexperience.htmlBy Alan Penn, director of the Virtual Reality Centre for the Built Environment at University College LondonReference:Why User Experience Cannot Be DesignediA | Can Experience be Designed?文章一：Eric Baczuk, Design and the (Ir)Rational Mind: The Rise of Affective Sensing
https://designmind.frogdesign.com/2014/05/design-irrational-mind-rise-affective-sensing-2;
文章二：Daniel H. Pink, A Whole New Mind Moving from the Information Age to the Conceptual Age
http://www.goodreads.com/book/show/99315.A_Whole_New_Mind“做项目久了，难免就会职业病发，没成想现在最大的爱好就是拆字玩儿，总想着能从字本身的意思去弄点洞察出来。现在哪哪儿都在说用户体验，说实话，这个概念本人听的是真有点腻了，凡是个东西都要扯上“体验”二字。顺手在网上搜了下在线词典，这下面倒是有对于体验的几种原生态解释：1.亲自处于某种环境而产生认识2.指通过亲身实践所获得的经验3.所谓亲身经历与实地领会4.也含有查核，考察的意思
从这些个解释里不难看出，从1，2，3的解释中，体验是包含有时间概念的：体验当下的那一刻，体验后的回想总结，以及建立下一次体验的心理预期和评判标准，其中反复强调的是“亲身”一词，这个时候，人的概念就被带出来了，不难看出所谓“体验”又包含了多少亲历者的主观意识；从4的解释中，个人觉得特有嚼头，这似乎是来了个总结：大多数的人都是带着“挑刺儿”的情怀去走完整个时间线的。
最后，简单的总结下我想说的1.体验设计的who 是别人，体验包含太多主观因素，设计师要懂得如何充分提炼每个人情怀背后的深层共性。2.体验设计是围绕过去，现在和将来这条完整时间线的设计，绝对不是一锤子买卖。3.只要是人，就会对你为他们所架构的体验进行“审核”，所以作为设计师，千万要宽容要大度，那个被“骂”的点或许就是支撑前行的机会。文章中揭示的“互联网产业中对于User Experience和Interaction Design的混淆”可谓是一针见血。作为一名有着一点用户体验sense的互联网从业者，我往往会花费很多时间去说服决策者将投入更多地精力去研究用户，用更加宏观的角度去看待用户体验，但由于自己对于用户体验理解和阐述的局限性，这样的尝试往往无疾而终。我觉得这篇文章提供了很好的逻辑结构和对比佐证，让设计师能够更好地理解用户体验的同时也可以更好地把这个概念传输给别人。
对于文章中提到的两个工具，Customer Journey Map和User Experience Questionnaire，在我看来虽然被证明在设计咨询和设计用户研究领域非常有效。但是在产品迭代迅速的互联网行业，决策者往往会更倾向于快速地推出产品、快速地试错、快速地更新迭代这样的“野蛮”方式来获取更加直接与准确的用户反馈。在这样的一种大环境下，相对传统的用户研究工具似乎因为周期长与结论的不确定性显得有些“笨重”，这也间接导致了部门互联网公司的决策者对于类似调研方式的抵触。如何做出改变，让这些有效地工具和理论在这样相对“野蛮”的环境中显得“接地气”，我觉得是作为一名设计师需要思考的问题。这篇文章很是解答了大家对于“用户体验”，“易用性”，包括“体验设计”的差别。非常赞同对于未来设计世界和人类世界对于情感化消费需求的方向，很多时候人们看似理性的消费实际上也是出于背后难以明状的亦或是潜意识亦或是外界的多重的信息刺激。神经科学（neuro science) 主张的决策下达从来都不是由内而外的，而是由外而内的。从这一点看，似乎“体验“还是可以被”设计“的，这种预设，结果当然越接近最终的现实越好。在《Thinking fast and slow》这本书中提到了诸多人们下决定的包括背后存在的偏见，所谓主观的意见实际也掺杂了背后潜意识的，本能的，直觉的迅速的判断，在这样的情况下，消费者的“体验”可以”被操控”的因素也大大增加了。说到底，人都是很有同理心（empathy）的动物，再正经地挣扎表现出理性的样子，也不过是那层薄如蝉翼的外壳罢了。“用户体验”就是在不停地触碰这层外壳，让“体验”直入你心。作为一个Service Design背景的设计策略师，用户体验之与我并不是虚拟产品中的手势，按钮，和A/B测试。用户体验融合在一整套服务系统里无形或有型的用户触点中。正如文章所提到的，实体体验的内容层级要远远超越互联网产品的易用性，它是一个更加复杂而庞大的系统，它需要深入挖掘人类需求的本源与动机，而并非只是依照某种需求本身位用户提供某类的便捷工具。
正如Pine II和Gilmore在The Experience Economy一书中所述，任何企业在喝消费者互动时都是在导演体验，以一种个性化，令人难忘的方式与消费者建立联系，以服务为舞台，产品为道具，以品牌故事为剧本，当我们购买的是体验时，我们花钱享受的事商家为我们提供的一场难忘的回忆，就如同参与一场戏剧演出，其价值将长久地存在于我们的心里。
试想一下MM巧克力世界，乐高积木世界，苹果体验中心，以及把体验做到极致的迪斯尼。他们永远不可能收到互联网产品的冲击。许多人说随着互联网服务的发展，电影院，商场，美容院，餐厅，所有的产业都将受到影响。然而，良好的体验是在一个人心理，生理，智力和精神水平处于高度刺激状态下形成的，这并非是互联网产品的良好易用性就可以轻易满足的需求。
对于“用户体验”而言，“易用性”是衡量整个体验过程中所需要的某一工具的标准之一，而体验则应该思考如何通过全方位的营造让服务变乃至于整个生活状态变的更加丰满和人性。“用户体验”被广泛的使用和探讨，说明随着经济发展，消费者的需求已不再单薄。以设计为主导商业创新挑战才刚刚开始，作为这个时代的设计师，我们更应该以开放和学习的心态来迎接新的挑战！关于用户体验的未来的展望非常有趣。说到底是对人的更深入的了解是用户体验的根本。传统上来说，用户体验是基于对于用户更深切的研究，是以用户研究为基础的。也就是根据用户的所说，所做，所想，甚至所感挖掘出真实的用户的能力，需求和期待。而从上文用户体验不能被设计上来说，Context of use和User两个都是影响的因素。也就是说，未来对于User本身的了解的加深， 以及Context of use的改变也会对用户体验本身有着极大的影响。

Terry Cao是UXPin（一款线框图与原型制作APP）的内容策略专家。要了解如何掌握现在交互设计的艺术，可以参考免费的电子书籍《Interaction Design Best Practices》。这本书中含AirBnB、 Google、 Apple、Etsy 以及其他诸多公司的30多余交互案例。“Modality Interactivity对用户来说更有说服力。因为这使用户在浏览网站的时候更有趣，更吸引他们，并且帮助用户对网站信息产生更积极的态度。” 一位来自罗伯特·莫里斯大学的通讯系助理教授Jeeyun Oh如是说，“交互（Interactivity）通过让用户更深层次地理解网站信息而更具说服力。”欲更多地了解现代交互设计的艺术，可以阅读《Interaction Design Best Practices》一书。

最近离职了，空暇之余正好对之前一年多的工作内容进行个总结回顾。主要分两块，一是负责公司App和游戏在App Store及Google Play商店的视频创意设计和制作，可参见我写过的文章《AppStore预览视频AppPreviews制作心得总结》，以及前两天上站酷首页的《2015 moonjoin showreel》。

译者注：本文译自苹果官方人机界面指南 iOS Human Interface Guidelines (2015年10 月21日)，由腾讯ISUX设计师翻译整理，非发文者一人之作。

本文是移动原型工具Proto.io的设计团队8月份在自家博客上发表的一篇“软文”，通过与移动设计界大牛们的对话，帮助大家了解在进行移动设计时应该特别注意的禁忌，顺便推了一下Proto这个工具。大家可以回顾一下自己团队的应用正在触犯哪些禁忌，想必会有点意思。读完本文，相信你能找到优化自家移动应用设计的方向。

首先要说这里写的“微信公众号”不是指微信的公众号服务，而是指企业申请公众号以后企业在公众号里提供服务。

如何打造一款看起来非常惊艳的应用，我想大家应该有所了解，借助有趣的故事、流畅的流程和令人难忘的视觉设计就好。但是仅有这些并不够，你需要拿出一些真正能打动用户心灵，产生情感联系的东西，让他们感受到应用真正鲜活的一面。

如下为规范汇总页，里面囊括了许多大家熟知品牌的规范。1.Brand Style Guide Examples

今年的双十一，你剁手了吗？不管你剁不剁，反正我是剁了。剁手的同时，不妨来看看，电商购物车的哪些设计让你剁了还想剁。本文主要讲四个电商网站的购物车，分别是淘宝、京东、唯品会和聚美优品。

这会可以不用慌张，我们先给自己一天或者半天时间去了解它，最快捷的办法是开动大家的脑洞，然后再用自己的脑洞想办法，三个臭皮匠顶一个诸葛亮，联 系你认识的设计群体人脉，询问做过类似项目的设计师，最后总会有惊喜的收获。记得罗胖讲过，在这个时代，我们应该善于运用我的网状关系链，我就是从朋友那 里在短短的一个小时之内了解了手表项目的大概（虽然人家并不是做的苹果手表），他大致陈述了一下手表的特性还给我几个手表相关的网站进行浏览。给我的网站 可以推荐给你们，这里当然包括苹果官网，你可以在苹果官网上看到成熟的上线产品的模样，另外一个网站相对概念，可以参考一些简单的操作动效。

给用户及时、恰当的反馈，是交互设计非常重要的一项原则。由搜狐新闻客户端团队撰写的《设计之下》一书中，对操作反馈从形式、内容、位置几个方面做了非常详细的总结，满满干货。今天@青溪Joanna 这篇读书笔记提取了书中的要点并配上实例，分享给大家。