崔梦琳

　　（华中科技大学，湖北武汉430000）

　　交互设计时代下的扁平化风格综述
——以信息可视化设计为例

　　崔梦琳

　　（华中科技大学，湖北武汉430000）

　　扁平化设计是如今最为流行的一种信息设计风格之一，它摒弃了阴影、渐变、透视等元素，推崇“少即是多”的设计原理，将符号性、简洁性以及整体性完美呈现出来。本文致力于交互时代这一时代背景，通过阐述扁平化风格的概念、历史、特征、设计意义以及在信息设计方向的运用等，来系统的阐述扁平化风格对于信息可视化设计的意义以及未来的发展趋势。

　　扁平；界面设计；信息可视化

一、交互设计时代发展和研究领域

（一）交互设计时代的发展简史

　　交互设计时代源于20世纪80年代，但交互设计思想却在遥远的古代中国中运用，例如，以"狼烟”作为信号传达战争信息。交互设计自20世纪30年代以来经过了开创时期、奠定时期、发展时期，到目前已达到繁荣时期。

　　这是快速时尚的时代，也是眼球时代，人机工程学、人机界面设计、工业设计已经为交互领域奠定了基础，交互设计已经形成了快速选择、快速发展、快速淘汰的标准。

　　（二）交互设计时代的研究领域

　　交互设计所涉及到的领域众多，给"交互时代”一个明确的定义和界限是一件相当困难的事情。从技术层面讲，交互时代的设计涉及到计算机工程学、语言编程、信息设备、信息架构学的运用。从用户层面讲，交互时代的设计涉及了人类的行为、心理；设计层面，交互时代的设计涉及到工业设计、信息设计和界面设计等。

二、扁平化风格的相关理论概述

原研哉在《白》中曾写道，空不仅是指形式的简单，它提供给我们一个自由想象的空间，从来拓展了我们对于世界的感知力和理解力。

　　扁平化风格是当下最为流行的信息设计方式，它倡导的是极简的人性化设计，通过抽象化的视觉语言，使交互流程更加专注于功能本身。它之所以流行，起源于Windows和Apple为主的几大公司在信息设计上一改以往普遍流行的拟物化设计风格，崇尚简洁和平面化，给信息设计带来了一股新的风潮。

　　（一）扁平化的概念及前世今生

　　1.扁平化的概念

　　扁平化设计（Flat Design），亦称为抽象化设计，是与拟物化设计相对而言的设计。扁平化设计所表现出来的设计，一般为不使用或者少量使用高光、纹理、材质的简洁设计，仅仅使用具有隐喻特征的抽象图形或者色彩，摒弃多余的装饰元素，是一种删繁从简的设计形式。

　　2.扁平化的前世今生

　　扁平化设计这一理念最早是由Allan Grinshtein系统提出，旨在用最少的元素表达最佳的含义，即“少即是多”。瑞士风格和的网格性和层次性以及极简主义的几何图形和干净线条都对扁平化设计的形成和发展奠定了基础。

　　扁平化这一术语“名声大噪”实在2013年苹果公司推出IOS7系统之后，这一设计风格并逐步渗透到界面设计、导向系统设计等设计方向中。

　　（二）扁平化风格的特征

　　1.符号化图形

　　格式塔心理学家认为，人的先天性知觉有“简化”的倾向。简化并不是指一般意义上的简单，而是以一种象征性的符号来传达物体的含义。符号化图形包括图像符号、指示符号和象征符号三种。

　　图像符号，是由模拟对象而构成的，肖像是最典型的一种表现方式。人们对于模拟肖像有着特殊的直觉。如德国数字媒体艺术家Michael Bielicky的肖像以其独特性和识别性，成为了一个新媒体网站的符号。

　　指示符号，一般是导视系统的外在化。最典型的是路上的指示牌。现在国外最为流行的是动态的导视系统。

　　象征符号，是指所涉及的对象和设计出的符号不一定有内在联系，而是人们在文化的沉淀下所形成的约定俗称的结果。例如，松、竹、梅岁寒三友。

　　2.鲜活性色彩

　　由于扁平化风格放弃了传统繁琐的装饰，所以色彩在扁平化设计中显得尤为重要。相对于传统的拟物化设计的遵循自然的原理，扁平化设计则不受自然物质条件的限制，单纯的通过颜色的含义向用户传递信息以及感受，也暗示了功能性。因此，鲜活性色彩对于扁平化而言，没有过多的视觉元素的干扰，更能明快的表达出设计所传达的信息。

　　3.时尚型排版

　　由于扁平化设计要求元素简洁，首当其要的便是排版的重要性。字体的大小应该匹配整体设计，字体的使用也要求精简、干练。在排版过程中，一般使用简单的无衬线的字体，同过字体大小和比重来区分元素。相对新奇的字体的使用范围缩小。

　　（三）扁平化风格设计意义

　　1.开发成本较低

　　不同的触摸屏和分辨率的产品所需要的尺寸和设计形式不尽相同，扁平化风格更适应于响应式的开发与设计，为开发者和设计师带来极大的便利性。同时，由于移动产品的界面相对较小，扁平化风格在此设计中有极大的优势，有益于移动产品的未来发展。

　　2.设计成本较低

　　扁平化风格的盛行，使设计师的门槛相对降低。扁平化不似拟物化设计，对于设计师的技术功底要求很高，这就给初学者和艺术爱好者开通了一扇通向设计的大门。

　　3.更加适应未来信息设计发展

　　Google glass的日渐流行，使交互过程进一步简化，界面将遍布生活的每一个角落，用户所使用的不仅仅是仅限于智能手机，而是可能会出现更加方便随身携带的物品，甚至是无形的产品。

三、扁平化风格在信息可视化设计中的运用

（一）交互界面案例研究

　　1.讲究简约的iBooks界面

　　iBooks是苹果公司官方的手机阅读应用，它的界面视觉形式和功能删繁就简，基本上都沿袭了扁平风格，在扁平风格上体现出一种轻质感之美。无论是封面还是内文都有传统书籍质感的气息。iBooks书店中有两种截然不同的、讲究质感的书籍类型。一种是皮质书籍的图书封面，一种是简单的色彩和文字堆叠得封面。前者将书籍的质感表现出来，一般为古典名著。后者为现代主义风格，不受条条框框的约束。

　　2.Facebook的扁平美学

　　Facebook的界面从最初版本到目前最新版本，一直信奉扁平美学。除了按钮的轻写实，其他界面的元素一直是遵循扁平路线。尽管网络上一直在Facebook界面风格过于简洁，但它依然是用户依赖最多的产品之一，可见体验性大于视觉性。

　　（二）城市公共信息导向系统

　　1.英国伦敦地铁图设计

　　伦敦作为建立地铁最早的城市，设计一个复杂的交通服务体系信息图，是英国政府十分关注的问题。从最开始菲利斯·皮尔萨尔（Phyllis Pearsall）女士设计的第一套写实性设计图到哈利·贝克（Harry Beck）设计的图解式信息图，渐渐突破了时间和空间的局限，设计变得简明扼要。如下图为贝尔设计的1933年伦敦地铁信息图，该图用原点代表交叉地点，用直线代表运输方向，直线与直线的长短并不局限于实际距离。

　　2.德国科隆·波恩机场形象识别系统

　　科隆·波恩机场（简称CGN），是德国的主要机场之一，著名的设计公司Toan Vu-Huu完成了机场的全套形象识别系统。机场的形象识别系统通过扁平的字体、色彩、版式、图形标识、辅助图形等系统设计，使得相关信息结构化、清晰化、系统化。

　　该设计在飞流程类的信息处理上，尤其是定点信息的处理（如停车场、等机舱等），设计师赋予了表意符号以运动的生机，标新立异的剪影的轮廓化信息符号大量运用在建筑、飞机等载体上。在对载体信息说明的基础上，更是赋予了机场的独特的视觉语境。

四、信息视觉扁平不如信息层级“扁平”

前面所论述的扁平化风格不仅仅是指视觉效果上的扁平，更应该衍生为信息层级上的“扁平”。视觉上的扁平只能作为一种风格暂时存在，就像人们看腻了古典主义，开始崇尚极简主义，极简主义沦落后，又在其基础上加装饰性的构造。风格永远都是潮流性的，真正可以一直延续发展的，是符合现代社会需要的快速体验。

　　正如当下扁平化浪潮可谓是如日中天，但过于扁平的风格，有时候会受到点击的限制，人们分不清一个按钮是可以点击还是不能点击。这就是扁平视觉的限制。而扁平化更应该衍生为一种内在的设计思想。并不局限于功能表达和认知障碍，信息层级的简化也是提高信息提取效率的重要方式。信息层级的越少，用户体验越愉悦。

五、结语

以视觉效果而言，无论是简约洗练的扁平化还是繁缛写实的拟物化，都只是视觉风格中的一种，任何一种风格无法永远立于不败之地。无论是平面还是立体、简洁还是繁琐、现代还是古典，用户都各有所好，但所有的用户都要求有良好的交互体验。

　　从信息层级而言，信息层级越“扁平”，用户的欢迎度越高。在快速化、时尚化的现代社会，用户的操作性和便捷性大于任何风格形式，只有符合时代发展需要的设计风格与形式，才能立于不败之地。

　　［1］原研哉.白［M］.桂林：广西师范大学出版社，2012.

　　［2］董建明.人机交互——以用户为中心的设计和评估［M］.北京：清华大学出版社，2010.

　　［3］汪大伟.现代主义风格的UI设计之兴起［J］.现代装饰（理论），2012（09）.

　　［4］孙奕颖.图形用户界面的符号学解读［J］.郑州轻工业学院学报，2008（02）.

　　J51

　　A

　　1005-5312（2016）08-0048-02