UI界面中扁平化设计的原则与技巧探索论文_柳子睿

UI界面中扁平化设计的原则与技巧探索论文_柳子睿

柳子睿

陕西国际商贸学院 陕西省咸阳市 712046

摘要:“UI设计”式包装设计的主旨是在于为人与包装之间建立一种新的交互方式。使用简易一致的UI设计理念来使装设计和消费者之间的互动,使消费者接收到包装设计所传递的产品信息,满足消费者的视觉需求及情感需求。随着智能机的普及,手机上网成为当今主流之一。从拟物化设计到扁平化设计,手机UI界面设计两张风格并驾齐驱。拟物化设计已经发展得十分成熟了,设计形式千变万化。扁平化设计从2010年至今还处于一个探索的阶段。扁平化设计除去了过多的装饰,这可能给人以“缺乏真实感及生命力”的感觉,同时也降低了交互式体验,所以要想做出好的扁平化设计,需要了解到设计的原则,也非常需要技巧的。

关键词: 扁平化设计;交互式;设计原则;少即是多

在2011年,安卓4.0问世,扁平化设计被推上安卓的舞台,这也是安卓为了与苹果区别开来的手段或者说是方法之一。2013年,ios7开始扁平化设计,突然这股设计风潮一拥而来,席卷了整个UI界面设计。 本文就此简单谈谈。

1 目前智能手机及移动应用界面设计主要存在的问题

(1)同质化严重。同质化在智能手机及应用界面设计方面的表现,一旦有手机系统或移动应用的界面或交互设计被发现体验很好,立即便有无数的抄袭者,导致在同一平台中同一类型的应用,如果不是加了各家品牌的文字或logo,几乎区分不出谁是谁。另一表现是盲目的跟随设计潮流,iOS7以前苹果手机界面为拟物风格,于是设计师把拟物风格做到了极致,如今iOS7以后苹果手机界面用了扁平化风格,各个系统及应用的界面风格又统统转向了扁平化。这种不加思考的追随不仅带来了同质化,还会限制设计创新。

(2)界面规范不统一。iOS及Android两大主流智能手机系统官方发布的设计原则、UI规范及交互规范各不同。但实际上,同一个应用会在两个平台上提交,设计上很难同时符合两种界面规范,导致互相乱用。腾讯2014年发布的最新版QQ2014图标为例,按照iOS7界面标准设计,为了不造成品牌上的损失并给用户造成困扰,选择在两个平台上用同一个图标,这种做法符合商业需要,但在非苹果手机用户的屏幕上显得极为丑陋。

(3)界面设计对技术及硬件设备升级的适应性差。从目前的趋势看,智能手机的屏幕会越来越大,而相应界面与交互设计的标准依旧是以小屏幕为准则制定,有研究表明同样面积的触控对象,在小屏幕上更容易触到,大尺寸屏幕上用户的效率更低。传感器的应用带来更多的新功能,如三星的眼球滚动翻页,只是界面没有做出相应的改变,缺少物理反馈的眼球操作全凭感觉,掌握了技巧才能翻,且不清楚自己会翻到哪,实际操作体验差,新功能如鸡肋。当硬件及技术升级时,应该想清楚用户的应用场景,并对界面做相应调整。

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

期刊文章分类查询,尽在期刊图书馆

2、做好扁平化设计的基本原则:

1)拒绝特效

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

2)使用简单的元素

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

3)关注色彩

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

4)注重排版

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

3 准扁平化设计原则与技巧

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

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

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

1)简单设计元素的运用

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

2)字体的设计

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

3)丰富的色彩

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

4)简化交互式设计

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

5)伪扁平化设计

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

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

参考文献

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

[2]张军.关于UI界面设计课程设置的构思与创想[J].艺术与设计,2011(7):99-101.

[3]张亚先.UI设计中图标设计的释义方式.机械设计,2013,30(6).

论文作者:柳子睿

论文发表刊物:《探索科学》2016年5期

论文发表时间:2016/9/5

标签:;  ;  ;  ;  ;  ;  ;  ;  

UI界面中扁平化设计的原则与技巧探索论文_柳子睿
下载Doc文档

猜你喜欢