UI界面中扁平化设计的原则与技巧

开篇：润墨网以专业的文秘视角，为您筛选了一篇UI界面中扁平化设计的原则与技巧范文，如需获取更多写作素材，在线客服老师一对一协助。欢迎您的阅读与分享！

摘 要 随着智能机的普及，手机上网成为当今主流之一。从拟物化设计到扁平化设计，手机ui界面设计两张风格并驾齐驱。拟物化设计已经发展得十分成熟了，设计形式千变万化。扁平化设计从2010年至今还处于一个探索的阶段。扁平化设计除去了过多的装饰，这可能给人以“缺乏真实感及生命力”的感觉，同时也降低了交互式体验，所以要想做出好的扁平化设计，需要了解到设计的原则，也非常需要技巧的。

关键字 扁平化设计；交互式；设计原则；少即是多

中图分类号U212.33 文献标识码A 文章编号 1674-6708（2014）118-0176-02

从2010年10月，微软公司正式了智能手机操作系统Windows Phone，同时将谷歌的Android和苹果的IOS列为主要竞争对手之时起，扁平化设计就开始逐渐进入我们的眼球。只是当时人们还热衷于拟物化设计所带来的超炫视觉体验。扁平化设计在当时甚至还遭遇到了嘲笑的声音。没过多久，在2011年，安卓4.0问世，扁平化设计被推上安卓的舞台，这也是安卓为了与苹果区别开来的手段或者说是方法之一。2013年，ios7开始扁平化设计，突然这股设计风潮一拥而来，席卷了整个UI界面设计。

设计千变万化，其实我认为设计是随着人们的审美的疲劳而变化的。拟物化设计（Skeuomorphic）给我们带来的是视觉上的“真实感”。故名思义拟物化设计，就是模拟现实物品的造型和质感，通过各种叠加高光、纹理、材质、阴影等效果对实物进行模拟再现，同时也可以用一些夸张的手法来增添更多趣味性，界面模拟真实物体，拟物设计会让你在第一时间就认出界面或者是图标是用来干什么的，它的功能是什么。交互方式也模拟现实生活的交互方式。那么，扁平化设计（Flatdesign）又是如何体系的视觉感受呢？首先，扁平化完全属于二次元世界，一个简单的形状加没有景深的平面。它摒弃了拟物化设计惯用的高光、阴影等能造成透视感、立体感的效果，通过抽象、简化、符号化的设计元素来表现。界面上极简抽象、矩形色块、大字体、光滑、现代感十足，让你去意会这是个什么东西。其交互核心在于功能本身的使用，所以去掉了冗余的界面和交互。设计师 Johnny Holland 将 Metro 语言比作是包豪斯风格――“少即是多”，并且指出，“因为去除了装饰，使得个性化的空间很小”，这可能给人以“缺乏真实感及生命力”的感觉，同时也降低了交互式体验，所以要想做出好的扁平化设计，需要了解到设计的原则，也非常需要技巧的。

以下是做好扁平化设计的基本原则：

1）拒绝特效

去掉了繁琐的装饰（纹理、高光、阴影、突起、羽化等），让一切变得简单明了，所有界面的元素的边缘都是干净俐落的。

2）使用简单的元素

常用一些简单的几何图形，矩形、圆形、正角、直角、圆角等。现在手机图标基本都是矩形块面的组合。

3）关注色彩

扁平化设计都有个共同的特点，色彩鲜艳、明亮，通过这个方面来增强图标的视觉冲击力。比如，其他设计基本上只包含两三种主要颜色，但是扁平化设计会平均使用六到八种颜色。蓝色、橙色、玫瑰红、紫色、绿色......等颜色颇受欢迎。

4）注重排版

字体的排版在设计中起着举足轻重的作用，它和界面中的其他元素是相辅相成的。在扁平化设计中，尽量不要用生僻的字体。如，扁平化设计的手机图案在交互式上可能或多或少有所减弱，那么文字的阐述就是人们认知它的另一个重要窗口。

5 准扁平化设计

不要以为扁平化只是把立体的设计效果压扁，事实上，扁平化设计更是功能上的简化于与重组。在扁平化设计的基础上，适当增加一种特效，如简单的阴影、梯度、深度、矢量的纹理等。比如，天气页面，用双层的色彩增加云图案的颜色层次。

扁平化设计的趋势已经势不可挡，但拟物化设计也没有被完全取代，那么准扁平化设计就成为它们之间的调剂品。在扁平化设计的学习中，原则是必备条件。技巧是必要方法。

纵观扁平化设计的平台，我们会发现一个现象：那就是难看的应用不多，但令人印象深刻的应用也不多。应用很有统一感，但是很难张扬个性，以至于有的开发者感叹，它们看起来都是一个样子，甚至连一向独成一派的ios7系统。根据扁平化设计的原则，及资料的收集，总结了以下几个设计技巧：

1）简单设计元素的运用

虽然是简单的几何图形，但是通过不同组合的排列、拼接、裁剪，可以得到意向之外的效果。

2）字体的设计

字体设计在扁平化中起到举足轻重的作用。字体设计的重点在于怎样协调笔画与笔画、字与字之间的关系，强调节奏与韵律，创造出更富表现力和感染力的设计，把内容准确、鲜明地传达给观众。

3）丰富的色彩

色彩是造型艺术的重要手段之一，色彩也具有打动人类的直觉，并可以直接诉诸于情感。色彩作为设计中重要的形式因素，其应用价值和审美价值毋容置疑。

4）简化交互式设计

开始于目标用户的需求和期望，结合人类自身的心理及行为特点，用最简单的方法创建易用、有效并让用户愉悦的设计。

5）伪扁平化设计

把某种特效融入整体的扁平化之中，是其成为一种独特的效果。比如说，在简单的按钮加一点点渐变或阴影，从而使这种风格成为其特色，产生出一种扁平化设计的变种。这种设计要比单纯的扁平化更具有适用性和灵活性。

扁平化设计是现今一个非常热门的话题，也是从2013年以来的一种设计趋势，并不是单纯的因为审美疲劳导致的为了变化而变化，而主要是因为数码化程度越来越高的日常生活中导致的。随着时代的变化，一方面是拟物化作用越来越少而退出主流，另一方面是扁平化更适应新时代的需求。我认为扁平化设计的当物之急，应该是寻求设计在情感上丰富，使之不那么冰冷。

参考文献

[1]张剑.UI扁平化设计在移动终端的应用与价值[J].文艺生活・文海艺苑，2013（11）.

[2]张军.关于UI界面设计课程设置的构思与创想[J].艺术与设计，2011（7）：99-101.

[3]张亚先.UI设计中图标设计的释义方式.机械设计，2013，30（6）.