iPhone

在很多人眼里，Google的产品一直与优雅设计无关。但现在，搜索巨人比其他互联网巨头都懂得如何打造一款设计优雅的软件（互联网）产品，如果你不相信这个判断，不妨放下你对苹果产品的钟爱，做个深呼吸，好，现在我们来对比一下Google与苹果在移动操作系统的设计：Android vs iOS。

注：“可读性”是说动画绘制者如何定义动画的精准度，用来清晰而容易地理解正在发生的事情。例如：不可读=不清楚发生的事情很易读=它非常清楚，立刻能懂弹跳背后的物理理论：球刚开始被放开的时候，它有一个相对缓慢的速度。在重力的作用下，球的速度持续增长，直到接触地面的那一刻速度达到最大。地面给球反作用力，使它以几乎相同的速度反弹回去。当球移动时，两种力量作用正在球上 - 反弹的力、想把它拉下来的重力。反弹的力量正在慢慢释放，这使得球随着升高逐渐减低速度，直到它耗费掉所有的反作用力，最终到达反弹的最高点。它在顶部停留一微秒，直到重力把它拉下来，使它像之前一样加速下降。我用言语来描述这句话是有原因的。我们试着将一种自然行为分解为具体的步骤，这样我们就可以重新创造它。注：不要羞于“照搬”大自然。你的观众会更快地与动画关联起来，从而更容易读懂动画。注意：这一术语有可能与其它术语混淆。如果你正在阅读传统的卡通书，例如迪斯尼的《生命的幻象》或《动画师的生存工具》，那么这些书会告诉你，当一个物体开始减速然后加速时，这一过程被称为渐慢(ease-out)，因为它的姿态在“缓慢输出”。但是，在软件产业（CSS动画，Adobe Edge等），这一过程被称为渐快(ease in)！我不确定这一不同之处是怎么来的，但是不幸的是，这就是它的形成过程。所以，当你在阅读一篇文章时，而这篇文章把它们把“渐快”称为“渐慢”，那么不要觉得困惑。看一眼你所在的网站你就懂了:D。时间    Y轴的位置(秒) : (像素)—————-0.0  :   00.1  :  34
0.2  :  68
0.3  : 102
0.4  : 136
0.5  : 170时间    Y轴的位置(秒) : (像素)—————-0.0  :   00.1  :   2
0.2  :  10
0.3  :  36
0.4  :  87
0.5  : 170注意：你会在软件中看到更多用于设置缓冲的选项，例如二次的、三次的、四次的等等。它们只是缓和程度更高的选择，但是概念是相同的。只需记住——缓和的程度越高，你就会得到更多的缓和度。并不是规则，只是工具（There are no rules. Only tools）- Glenn Vilppu

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

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

移动优先的设计策略将使产品拥有高度任务驱动的体验。用户可以将注意力聚焦在需要完成关键任务上，而不会被传统桌面产品中过多的无关因素所干扰。

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

“想清楚一点，你的智能手表应用为何存在，既然有iPhone应用。”“设计师：理解用户的体验，精确把握介入时机。”“如果你只能描述你所设计的功能，而不是相对应的时刻，那你还有很多事情要做。”

刚刚落幕的2015百度世界大会，百度推出了秘书化搜索工具“度秘”。这是李彦宏在宣称All in O2O后，做出的最符合百度风格的一件事情，也是百度希望能继续主导服务分发的尝试。

最近写黑魔法上瘾了，每天稍微有点空闲，Glen都在思考互联网行业都有哪些黑魔法。有机会大家还可以探讨一下魔咒课、魔药课、占卜课等哈利波特魔法课程。

iOS 9如今已公开发布。带来了一些细微的变化，但iOS 9的系统字体变成了苹果新推出的旧金山字体，代替了之前用的Helvetica Neue。

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.

用了两个星期时间断断续续读完iOS的guidelines英文原版，原文是写得有点啰嗦，所以精选了以下觉得比较重要的点，并加以自己的解释；当然如果你有时间，还是推荐阅读英文原文。首先是因为翻译的版本基本是不全的、旧的，就像ISUX的翻译的对比原文就会发现中间省略了好多。本文的作用并不像多数的翻译那样，让你粗略地了解里面的内容，而是精选出一些点使你体会到苹果的设计思想。 我读guidelines的目的不仅仅是要看他们是怎样规定的，而是要看他们为什么这样规定，在了解了制定规则背后的原因之后不仅便于记忆规则本身，还能了解苹果的设计思路，当吸收了设计思路之后，就不再是墨守成规，而是更自信和灵活地运用规则，甚至创造属于自己的规则。就像tweetie发明下拉刷新手势之后苹果反而把这种手势加进了自己的guidelines。 读英文原版还有一个显然易见的好处就是熟悉专业英语表达，guildlines的措辞显得优美而精确，值得去读读。

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

2012年6月，我在CNN.com工作时，接到了为“选举之夜”进行用户体验设计的任务。接下来的5个月我为那1个晚上贡献了全部精力——但我的成功对选举的胜利方没啥影响。我所关注的是页面的可读性，数据的可视化，可变形的画布，以及在iPhone上怎么实现该死的鼠标悬停弹窗效果。在当时，CNN.com首次上线了响应式体验站点，同时，我也第一次面临响应式体验设计。

前言：一直有在梳理自己的知识结构，也靠这些所谓经验做了几年行业培训，今年是从业的第十一年，觉得差不多是时候把这些最初来自同行、互联网和书籍的知识再还给行业，我会把所有所得分章节逐渐整理发出，希望能对行业尽一份绵薄之力，同时也作为一种仪式，好让自己重新出发。

也许是刚毕业的你最该看的一篇干货。如果你已经习惯了等别人给需求，然后开Photoshop，再等别人说改哪里就改哪里，肯定谈不上工作成就感。想掌握设计的主动权，证明自己不仅是个画图的，建议把这篇文章提到的3个方法好好实践一番，绝对会有大收获（严肃脸）。

如果你是一名经验丰富的设计师，你一定会认同一点，受他人启发并不是在抄袭UI设计。这是一种最佳的研究实践。它也要运用各种设计模式，也要遵循设计规范，也需要确保选择用户熟悉的模式来建立可用的界面。

前言：一直有在梳理自己的知识结构，也靠这些所谓经验做了几年行业培训，今年是从业的第十一年，我觉得差不多是时候把这些最初来自同行、互联网和书籍的知识再还给行业，我会把所有所得分章节逐渐整理发出，希望能对行业尽一份绵薄之力，同时也作为一种仪式，好让自己重新出发。举个栗子：假设我是个潮人，同时我也是个医生，那我就有两个角色。如果给我设计一款音乐播放器，应该给我一款酷炫的，我会喜欢。但当我坐在办公桌边，给病患开药的时候，我电脑的开药软件需要很酷炫吗？我一边摇晃脑袋踩着节奏，看着充满特效的界面开出来的药，你敢吃吗？所以医院的软件需要简洁，保证开药的准确度。（然而需要强烈的视觉表达情绪的设计例外）。