交互设计

iOS10发布了，苹果遵循了一切从简但又增加了一些提升用户体验的功能，比如向开发者开放了更多接口，设计者又如何跟随iOS的步伐做好产品设计呢？本文是系列文章的完结篇，enjoy~Note
模板图片(template image)会丢弃图片本身的色彩，而采用图片视图使用的色调。请参阅UIImage中的UIImageRenderingModeAlwaysTemplate。TIP  对于多行或是多样式的文本输入，请使用文本视图。请参阅Text Views。

今天的文章，我们将会提供一些使用空状态来优化新用户引导的策略和技巧。

作为设计师有一个重要的技能：如何选择文字。这是因为文字是设计师和客户沟通的主要方式之一。那么排版就是决定你设计好坏的重要因素。GoldenRatio (1:1.618)
1.000x 1.618 = 1.618
1.618x 1.618 = 2.618
2.618x 1.618 = 4.236
4.236x 1.618 = 6.854
6.854x 1.618 = 11.089GoldenRatio (1:1.618)
…
11.089x 1.618 = 17.942
17.942x 1.618 = 29.03
29.030x 1.618 = 46.971
46.971x 1.618 = 75.999
75.999x 1.618 = 122.966MinorSecond 15:16
MajorSecond 8:9
MinorThird 5:6
Major Third 4:5
…PerfectFourth (3:4)
…
9.969x 1.333 = 13.288
13.288x 1.333 = 17.713
17.713x 1.333 = 23.612
23.612x 1.333 = 31.475
31.475x 1.333 = 41.956
41.956x 1.333 = 55.927FontSizes
Header1: 55px
Header2: 42px
Header3: 31px
Header4: 24px
Header5: 14px
Body:17px
Caption:14px

设计工作几年后，你有没有接到设计需求时不满足于之前的处理手法，想要突破自己，不想麻木的做设计？不希望自己在习以为常的设计中走向平庸，成为一个废柴……最近对国内外各种资讯文章的阅读和最新优秀产品的体验，梳理下今年的UI设计的趋势，希望在接下来的设计工作中，理性的前提下又不失创新。

面对完全不一样的媒介，设计师们会有不一样的目标，也会使用不一样的手法进行设计。 比如说一名 UI 设计师与平面设计师的最大区别，大概就是在于 UI 设计师能够以开发的视角来做设计。

本文作者将与大家探讨微交互是如何塑造优质的产品细节的，一起来看看吧~“最好的产品通常会做好两件事情：功能和细节。功能能够吸引用户关注这个产品，而细节则能够让关注的用户留下来。”

五一假期前的两天有幸参加了阿里UCAN2017用户体验设计论坛，很荣幸的领略了业内大牛们对于体验设计的理念与趋势的见解。本次论坛的主题是“新设计x新商业”，由阿里提出的新零售、新金融、新创造、新能源和新技术为起点，借助用户体验的设计赋能，来连接用户、商业与技术，实现最大化的商业目的。在沉淀了两天之后，我将从中学习领悟到的一些看法总结了下来。“利用人类的现实感官作为交互体验的手段，模拟与现实世界相似的场景，让体验特征表现的更加直观，真实。正是借助于科技的创新，一体性、真实性的交互体验才得以实现，人类与虚拟信息的交流才会越来越自然。”在既要满足一群人，又要满足个体中的一个人，包容一个人到参与群体的场景多样性。就是现在设计思维中所需要逐渐形成机器学习的共生方式。— 阿里妈妈UED总监 萧健兴“全链路设计是新技术发展下的必然趋势。”

今天要告诉大家的不是说怎么借鉴好的设计或者如何获取灵感，毕竟市场上好设计这么多，难道每个都去借鉴，到最后变成所谓的抄袭？我们应该站在自己产品的角度，去吸收好设计的核心点，然后找到真正解决问题的方法，而不是纯粹的“借鉴”。呆总，我平时看了不少图，但是做项目的时候没办法用上，怎么办呀？看得多没用的，要多想多做。（虽然是至理名言）

“注意用户做什么，而不是他们说什么。”
——雅各布 尼尔森“令你反感的客户是你最大的学习动力来源。”
——Bill Gates“想成长为设计师？花大部分时间考虑它的运作方式，而不是看起来如何。”
——乔希·帕克特

本文将介绍交互设计中的极简设计4策略，帮助产品经理或产品设计人员在进行产品设计时，可以打造一款真正为“用户”设计的产品。

用户体验的概念一路成长壮大，系统性概述的书籍和理念层出不穷，可执行落地的方法技巧随着技术的进步在不断变换。然而无论概念、环境如何变换，都是让产品通过媒介与人建立关系。所以其研究人性、塑造人类行为的目的却一直未变。本文从人对控制感的喜好出发，通过一些方法来保护用户的控制感或利用控制错觉给用户一些虚拟的控制感，­­­­来保护用户体验或强化用户体验。

希望这篇文章，能够在你做LOGO设计时，提供一些方向和思路。

智能车载系统的概念变得越来越火热，智能驾驶的理念也越来越普及。现阶段，国内外各大互联网巨头都在联合传统汽车企业一起探索智能汽车的设计研发。可以预见的是，在不久的将来，驾驶员在车内将更加自由，就像智能手机一样，智能汽车将为驾驶员带来前所未有的丰富体验。本文作者Adhithya，通过一系列的访谈调研，探索现阶段驾驶员在驾驶过程中的行为方式，并依此为未来的智能车载系统的交互方式设计提供了科学的思路。“我知道在手动挡车上转速表的作用，但当我换了自动挡后我就很少去看它了“
——被采访人1
”我并没有真正的去关注过它，对我来说，这部分信息没有什么意义。“
——-被采访人2
”可能在爬坡的路面上我会看一下转速表了解一下车况，但当我在城市里平坦的路况行驶时，我很少会看它。“
——-被采访人3

本文作者将对魅族最新研发的交互方式—mBack进行分析，从谈论手机操作系统方式与电脑的操作系统方式有着两个较为明显的差异，到分析mBack的缺点，值得一看。乔布斯说：伟大的产品都是只有一个按键的。在已经将交互优化到已经不能再删减时，如何有效的组织和隐藏就显得尤为重要。随意性用户可能使用过类似的产品或服务，有兴趣使用更为复杂的产品，但是不愿意接触全新的产品，除非新功能足够简单。主流用户是最大地群体。他们使用产品的目的是完成任务，他们永远也不会产生学会所有功能的想法。

译者按：对色彩的研究通常要么太过随意缺乏逻辑，要不太过理论化难以理解，这篇文章用非常浅显易懂的方式，讲述了一个专门研究数据可视化的团队探寻图标色彩搭配的历程，给出有力的论证，并得出很棒的结论，非常值得一读。对色盲色弱来不够友好*：原文中问题一的标题是“Low Accessibility”，通常用形容来产品对残障人士的友好度不够，这一点在欧美国家经常作为需要重视的产品硬指标（也是由于他们的色盲色弱发病率比亚洲高很多）。因为在中文里没有简短精准的说法，所以我在写的是“对色盲色弱不够友好”。
逻辑性较强的人*：原文的写法是“left-brained folks”，直译是左脑型的人。通常左脑型的人被认为逻辑严谨，右脑型的人被认为有艺术天赋。因为这种说法在中文里不是很通用，所以我写的是“逻辑性较强的人”。

本文介绍一些关于响应式图像的适配应用策略，回退原理，SVG的换色技巧，雪碧图的百分比定位计算公式等相关的一些小知识点，目的在于帮助一部分同学快速的理清图像应用思路，以及一些web图像的应用技巧。data-src
data-srcset
在加载到的时候更换为
src
srcset容器元素的尺寸：elW * elH
单张图片的尺寸：imgW * imgH
Sprites图片的尺寸：spritesW * spritesH
单张图片在Sprites图上的位置：imgPosX, imgPosY点的位置为 (x, y)
容器上的(x, y)点与容器左上角的距离为 cX, cY
Sprites图上的(x, y)点与本张图片左上角的距离为 sX, sYelW = imgW, elH = imgH
cX = sX, cY = sYcX = elW * x
sX = spritesW * x – imgPosX
elW * x = spritesW * x – imgPosXx = imgPosX / (spritesW – elW) = imgPosX / (spritesW – imgW)
y = imgPosY / (spritesH – elH) = imgPosY / (spritesH – imgH)

本文作者将来着重谈谈APP中的Tab Bar 是固定好还是不固定好，你觉得呢？

网站运营者的目的是为了增加阅读量，用户停留时间。而大部分用户一般是比较迷茫的，他们不知道自己想要读什么。

色彩在任何一种设计中都起着很重要的作用，相差不多的色彩却能给用户带来完全不同情感效果。因此，好好利用色彩与生俱来的魅力，就能让你的设计更出彩。