广州北大青鸟计算机职业培训学校
互联网技术培训、软件技术培训、大数据培训、云计算培训、数据分析培训信息网
当前位置:网站首页 > 计算机学校 > 惠州计算机学校 > 正文

UI设计关于扁平化设计的做法

作者:hz_admin02发布时间:2022-06-09分类:惠州计算机学校浏览:870


导读:一些关于扁平化设计的做法,这里主要偏视觉侧

一些关于扁平化设计的做法,这里主要偏视觉侧

1.去掉特效

先来看一组对比图片

【UI 设计关于扁平化设计的做法】

同样是镜头的设计,在扁平化中去祛除了渐变,阴影,质感,等各种修饰手法,仅用简单的形体来表达,显的干净利落。

做减法,这第一步应该是最容易的。

2.简化提取

首先我们来看看做简化和提取的一个典型例子

毕加索画的牛

【UI 设计关于扁平化设计的做法】

一头牛从最初的写实到最后仅仅只用几根线条来表示,整个简化的过程也经历了好几个步骤,当然这里对设计师观察和提炼能力要求很高,要充分了解对象物的本质,懂得巧妙的取舍,用极简的要素,在没有更多特效装饰的情况下表达清楚内容,在界线与轮廓的高对比下,表现出物体的美感。

3.巧用色彩

在扁平化设计中,色彩运用的是否到位,无疑是这种设计风格中很重要的一个环节,看很多作品,在色彩上更多的强调更亮 、 更鲜艳。

【UI 设计关于扁平化设计的做法】

在以往的设计中,大多数情况下设计一个作品更专注在两三种颜色之间,而扁平化设计的色彩往往在6到8种。

以下收集了一些颜色使用频率比较高的,蓝,绿色,裸色(粉色),杏,灰色,紫色

这里除了颜色的搭配还有一点就是,在很多时候扁平化的视觉设计中,是很少有线条出现的,更多是用色块来表现各种关系。(怎么用色块表现,这里应该也可以有一个专门的分享)

【UI 设计关于扁平化设计的做法】
【UI 设计关于扁平化设计的做法】

当然也有一些是走复古风,同色系,和低饱和度⋯⋯等等的

重要的是各种调调放在一起看起来要和谐

【UI 设计关于扁平化设计的做法】

4.排版很重要

由于在扁平化设计中采用的都是极简的元素,所以,排版就显的尤为重要。

首先是字体:在扁平化设计风格种,字体的设计显的很重要,一种新奇的字体用来作为设计元素会发挥极其重要的作用,但是要小心,不能因为字体太新奇,而影响到了信息的传达。字体更多时候采用的是无 衬线 (sans serif)字体类型

【UI 设计关于扁平化设计的做法】
【UI 设计关于扁平化设计的做法】

其次是大图

一张好看的图片能吸引大家注意力和点击的欲望,在加上适当的排版,再配合扁平界面,瞬间设计感倍增,上档次了有木有

【UI 设计关于扁平化设计的做法】

再来是半透明

使用这些设计方式最大的好处就是创造对比,可以让设计师通过色块,图片上的大字体或者多种颜色层次来创造视觉焦急,传说中的大气应该有这样一种效果,哈哈

这种效果如果运用得当的话,效果会非常震撼,但是使用这种效果必须谨慎,因为这种效果很难处理得当,有一些原则需要掌握:

只有图片和文字都可以读时,半透明效果才有意义,在决定半透明位置的时候,你要知道遮挡了什么内容,这些遮挡是否合理透明度的使用错误会影响到整体的设计效果和阅读性,出于可读性考虑不要在对比强烈的图片上放置半透明元素(比如黑白对比或互补色)不要同时运用过多半透明效果

【UI 设计关于扁平化设计的做法】
【UI 设计关于扁平化设计的做法】

5.其他风格和细节

谁说扁平化就是单色平涂,扁平化也可以有其他风格和细节,我们来看看装饰画风格

【UI 设计关于扁平化设计的做法】

立体感

谁说扁平化设计就是色块堆积,来看看扁平化也可以有细节

色块间的变化呈现出凹凸感

【UI 设计关于扁平化设计的做法】

光感,长投影和阴影/高光

【UI 设计关于扁平化设计的做法】
【UI 设计关于扁平化设计的做法】

动感

看下面的例子,当时钟在转动的时候,画面下方的图标(汉堡/饮料等)也有一个相应的动态表现,饮料也能看上去象是在杯子里晃动。

【UI 设计关于扁平化设计的做法】

其实还有很多⋯⋯

小结

做好扁平化设计,并不是简单的去掉拟物设计的各种修饰效果,需要设计师更多的去观察,提炼。可以从古今中外的各种艺术表现形式上找到共同点并加以运用。

扁平化设计也不是简单的单色平涂,它可以有很多细节,也可以作出质感和动感,这需要设计师们耐心的去发现。


点击咨询直接了解更多相关资料,我在惠州北大青鸟新方舟等你。


本文内容转载自网络,版权归原作者所有,如有侵权请联系我们进行删除。


标签:惠州计算机软件培训惠州计算件软件开发惠州计算机软件基础惠州计算机UI设计软件开发惠州UI设计培训学校惠州UI设计培训UI设计基础教程UI设计是什么UI设计教程UI设计入门UI设计培训


惠州计算机学校排行
标签列表
网站分类
文章归档
最近发表