认识达内从这里开始

认真做教育专心促就业

扁平化UI设计中如何表达空间感?

发布：哈尔滨达内教育
来源：达内新闻
时间：2019-01-02 16:23

扁平化UI因其易用、高效、友好的特性使它广泛应用在移动终端，但是扁平并不完全意味着对空间属性的抛弃，它可以通过平面设计的语言和交互的隐喻来实现空间的表达，本文哈尔滨达内IT培训为大家介绍扁平化UI设计中如何表达空间感?

1、通过色彩表达空间感

在拟物化的UI设计中，可以模拟材质和纹理来表现空间感，通过对不同的质感、纹理和颜色组合形成丰富多彩的界面视觉空间。但是扁平化UI的典型特征就是不使用材质和纹理，主要通过色彩对比来形成空间的深度。不同的色彩具有不同的属性，我们可以利用色彩的明度、纯度和色相对比来获取界面的空间感。

一般情况下，暖色、纯色、高明度色、集中色等具有前进的感觉;而冷色、浊色、低明度色、分散色等则具有后退的趋向。冷色调给人以后退的心理感受，暖色调给人以前进的心理感受。在黑背景上，亮色具有前进感，深色具有后退感;在白背景上，亮色具有后退感，深色具有前进感。

2、通过形体表达空间感

在拟物化UI设计中，界面框体和图标造型会大量应用透视来表现空间感和其三维属性。而在扁平化UI中则通过形体与形体之间的关系如大小的差别(近大远小)，表现出空间上的距离感;或者以形体的重叠和覆盖使之产生前后和上下的空间感;放射状的阵列和疏密的利用也能营造空间和深度;还可以利用面的转折来表现空间感。

3、通过明暗关系表达空间感

在界面设计的空间表现上，为了塑造出生动的空间感、层次感，明暗表现有着不可替代的重要作用。物体接受了光源，会产生投影，投影可在形象的前面或后面，表现出形象的轮廓、体积。投影的存在使形象更富于真实感，它是空间感的反映。

时下流行的扁平化长阴影设计，更强化了界面中阴影对空间的表现力和形式感，就像冬天傍晚时分，物体长长的投影一样，格外引人注目。这种45°比一般情况要长很多的投影效果在保持扁平化的同时更强调了空间的表达。当然，扁平化UI中阴影和渐变的应用需要遵循少量精炼的原则，在合适和重要的区域添加才能起到画龙点睛的作用。

4、通过动态图形表达空间感

界面设计要求向用户传递信息过程中通过合理的空间表现或隐喻来呈现界面的层级结构和相互关系，将空间深度变化为能帮助传递一定信息的视觉表达元素，其存在意义的核心是“层次”和“秩序”。界面设计可以有效地利用动态图形，通过有组织，有目的的设计理念和设计手段，把时间与空间串联，结合现实中的三维空间及时间，从而扩大界面视觉语言的表现力。

< 上一篇：2019年UI设计师从哪些方面提升自己?

下一篇：适合程序员的10大编码挑战网站 >