根据生活的经验,我们已经对投影所产生的暗示习以为常,能根据投影的结果下意识的对界面内容做出判断。所以,设计师在设计过程中如果对投影没有进行很好的思考,就无法设计出符合规律和逻辑的投影,界面就会产生违和感,而作品也因此大幅降低了质感。
在进入了扁平化的设计环境后,投影有很长一段时间被抹除,因为大家认为那是拟物的遗毒,就怕设计里用到拟物元素显得不够时髦。
到了 Material Design 发布以后,谷歌在规范中增加了 Z 轴的概念,也就是为平面预设了立体的空间,设计元素可以定义与空间中水平面的距离,并通过投影来表现。
下图中,Z 轴数字越大,代表和水平面的距离越远,上升得越多。而带给我们这种感受的原因,就是投影的暗示,元素本身的 XY 坐标并没有任何改变。
即然增加了投影,那么谷歌的专业设计团队,肯定不会很随意的制定其参数。当我们打开谷歌的官方 UI kits 源文件进行查看时,就能发现其中的奥妙。它们为元素创建了两层投影,即本影和半影,有时也称为 top shadow 和 bottom shadow。
并且,还有一个在第一部分没有提及的要点,投影的深浅与元素的距离是非线性的,即中心到边缘衰减的速度是越来越大的,用坐标轴标示就是非线性的函数关系,而大多数软件中的投影只能以线性的模式呈现。
在 UI 设计师接触的平面类软件中,只有 PS 具备完美复现这种投影的能力,即控制投影的等高线。
上面出现的投影都是黑白灰,但在现在流行的设计作品中,最常见的是应用了彩色的投影,摄影中也经常会应用彩色的投影渲染氛围。
飞特游客
委托设计