扁平化设计

DNA图谱 / 问答 / 标签

扁平化设计风格海报-如何从零开始学习图标设计

一篇文章,助你看懂艺术流派和设计风格虽然现在的设计大多是快餐式呈现在大众面前,但是这其中也凝聚了一批批设计师的创意和想法,引领了一个又一个设计潮流,从拟物到扁平再到如今的轻拟物,已然经历了一个小小的轮回,然而这些设计风格的形成,像极了几个世纪前的艺术流派。本文将对几个艺术流派和设计风格进行横向分析,找出他们的相似之处,目的是为了启发大家,从经典发掘闪光,并将之注入到设计中,如果运气好说不定还能开创一个全新的设计趋势哦。艺术流派和设计风格为什么会说艺术流派和设计风格非常相似呢,首先我们来对比一下他们的产生及运营方法,这里做了一个表格来简单表述艺术流派和设计风格这两个概念:我们不难发现,尽管间隔几个世纪,他们的产生和运营方式却非常相似。虽然设计不能被称为纯粹的艺术,但不能否认他们是有内在联系的。也许拟物→扁平→轻拟物这些设计风格的演变和几个世纪前的艺术家们并没有半毛钱关系,但是罗贝尔托·隆基说过:“艺术作品永远都不是单独存在的,它永远都离不开其他的艺术作品。”所以这种事情,谁又能说的清楚呢?既然说不清,那索性大胆说一说好了。本人博览群书(《艺术流派鉴赏方法》),终于在艺术流派发展的漫长历史中,寻找到了照亮现代设计的点点星光。它们就是:新印象主义→立体主义→抽象艺术(按照时间顺序排列)相信大家对于这三个流派的感受多半是熟悉又陌生的,本次分享我们就从这三个流派出发,寻找他们与现代设计的相似之处,而这之后出现的新造型主义,是否会对未来设计趋势有所预示,本人虽才疏学浅,但也想分析一番。新印象主义与扁平化设计说到新印象主义,有这样两个作品不得不提,保罗·西涅克的《早餐》和乔治·修拉的《大碗岛上的星期天下午》。保罗·西涅克当时在创作《早餐》时的突破点在于将分割画法和点彩融合,分割画法负责构图平衡,点彩负责视觉混合,这是一种非常理性的绘画方式。整个画面安静沉稳,可以挂在任何一个餐厅的墙壁上。△保罗·西涅克的《早餐》乔治·修拉的《大碗岛上的星期天下午》,本头有幸在国家博物馆看到过这幅画(可惜也不是原作),这幅画中的背景形状细致,人物轮廓规整,整体布局运用力学原理,构图稳定。打破了当时视觉原理束缚,使画面拥有全景既视感。△乔治·修拉的《大碗岛上的星期天下午》仔细观察这两幅画我们可以发现,新印象主义的这两位代表画家的代表作,在人物造型上与几年前开始流行的扁平化矢量人物非常相似。新印象主义绘画作品中的人物,几乎可以用基本图形分解出来。为了让大家更容易理解,本人将《大碗岛》这幅画中最右边的撑伞女子,用基本图形分解出来,单独呈现,是不是也十分优雅好看呢?如果我们将整个作品进行分解,得到的画面会极具现代气息,好像这么久远的作品穿越时空回到我们的鼠标下。所以,分析了解新印象主义的作品,对于现在人物图形的设计会有非常大的帮助。有了这些参考,一定会让我们设计作品中的人物看起来更生动自然,具有文艺气息和艺术厚度。再来看看我们经常在国外设计网站上看到的插图风格。这种风格的插图越来越多的出现在Behance,Dribbble等设计师网站上,本头也曾效仿过,在开始研究艺术流派之后本头猛然发现,这类图形与新印象主义的绘画风格拥有非常相似的人物表现形式,虽然作者在画这张图时多半没有想到我们修拉老师的《大碗岛》,但如果他能吸收一些,一定能让画面更丰富有趣。立体主义与轻拟物风格我们来看立体主义的代表作品,乔治·布拉克的《埃斯塔克的房屋》。乔治机智的把房子和树木简化为几何形,运用颜色过渡对成群的树木和房屋进行区分,这在当时是一种介于平面与立体之间的全新表现形式。我们不难发现,追随新印象主义之后出现的立体主义与度过扁平化潮流如今正流行的轻拟物渐变风格略有相似,不同的是立体主义存在的目的是全角度表现一个物体,而轻拟物只是粗浅的将扁平化物体扭转至45°角,再稍加一些渐变。虽然粗浅,却也符合当下审美趋势。假如我们吸收立体主义流派的一些特点,是否能让所谓的假3D作品不那么粗浅呢?仔细观察《埃斯塔克的房屋》,乔治用非常丰富又整体的色彩表现明暗过度,而不仅仅是同色系的明暗过度,艺术作品中对色彩运用的考究,完全值得被用在我们的设计中。抽象艺术与点线面说到抽象艺术,必须祭出我们的抽象派大神康定斯基了。他的《玫瑰灰》与《红黄蓝》就是将点线面元素运用到极致的画作。看不懂?不要紧,康定斯基就是要我们放弃无谓的猜测、揣摩与思考,在色彩、线条的舞动中,尽情体会艺术的纯粹与美丽。但是从另一个维度去看,康定斯基又极其理性的将几何形状抽离出画面,用浮动的活跃元素体现运动效果,同时构图也非常讲究。△康定斯基《红黄蓝》△康定斯基《玫瑰灰》康定斯基的作品现在看来依然充满时尚感,或许是因为点线面是构成画面永恒的元素,驾驭了点线面,就能够变化出无穷的画面。现在的招贴画,海报设计,也越来越多的运用到点线面元素,但大多不作为主体,而作为填充画面空白处的元素,即便如此,也能够提升整体的活跃感。聊到这里,本头觉得是时候强行展望一下未来设计趋势了。按照套路,我们首先需要一个艺术流派加持,那么在新印象主义,立体主义和抽象艺术这三个流派之后出现的新造型主义必须是不二之选。单说新造型主义,也许大家并不熟悉,那我们来看下图:△蒙德里安《黄,红,蓝的构成》大家一定见过吧,蒙德里安的这幅《黄,红,蓝的构成》(其实还有黑白灰)已然成为了一个经典logo,在时尚界和建筑界纵横多年,也曾在多年以前踏足UI界,只不过最后随着某些品牌一起销声匿迹了。下图是曾经微软公司为手机系统设计的界面,配色和布局基本是仿照《黄,红,蓝的构成》来设计的,用户可以根据需要移动模块进行布局。虽然这个设计被微软放弃了,但是,本头认为这种蒙德里安式的设计理念不应该被放弃,在移动设计已经完成了一个拟物,扁平,轻拟物循环之后,蒙叔重返战场的时刻终于到了!大家千万不要小看这幅《黄,红,蓝的构成》,事实上,许多朋友在看到这幅画时都会产生“什么鬼,劳资也能画”的傲慢心态,为了消除这种心态,我们近距离观赏一下这幅作品。在距离足够近的情况下,我们可以看到这幅画的每一个色块都是突出画面的,并且在不同平面上,而分割这些色块的黑线看起来就像钢条一般坚硬,色块甚至被勒出了一条毛边。所有这些细节,都是非常难临摹的。回到这幅画本身,蒙叔看似在画格子,其实他画的是对立与平衡,他让三原色(红黄蓝)和三非色(黑白灰)形成对立,将画面分解到极致。我们可以看到,这幅画中没有任何一个部分是完全对称的,却能让观者同时能感受到一种精神上的平静和宇宙间的平衡。这些特点都和我们现在温和平淡的设计截然不同。最后新造型主义是在新印象主义,立体主义和抽象艺术之后出现的,它吸收了之前流派的特点并继续进化,才有了现在我们所看到的蒙德里安,那么对应到现在,我们如果想跳出拟物,扁平,轻拟物这个循环,也许可以借助蒙德里安的艺术,找到新的突破口,在界面,海报,动态图形等设计领域创造一个全新的风格,让《黄,红,蓝的构成》重新引领设计圈潮流,而看到这篇文章的你,也许就是设计界的蒙德里安。如何从零开始学习图标设计想要学习图标的制作,需要学习图标设计的方法以及工具,那小小的图标其实中间应该包含了很多设计知识。一组的图标需要满足产品特点和风格,而且需要有辨识性,整体需要保持统一有需要有稍许区别,让人能够看到图标就能够了解点击图标后的功能。图片来源:阿多比设计学院学生作品一、设计图标的工具可以设计图标的工具很多,我们选择PS和AI,去学习一下这两款设计工具如何使用。1、PhotoShop如果是初次接触PS,那我们需要了解PS的基础用法,所以下面我们会从PS界面,基本设置,新建文件,视图操作、保存,导出,移动工具去带大家一步步了解PS。让大家能够熟悉PS工具在平面设计中的常用功能及具体用法,能够使用PS进行基本的图片处理。打开PS工具,简单了解界面的组成部分以及工具的作用。然后再去了解PS常用功能及具体用法,比如图层关系及应用、填色、魔棒抠图、选区和复制、锁套和羽化、去污点工具、修补工具、液化效果_⑹嫡健⑽淖(字符和段落)、形状裁剪、变形。当了解PS基础功能后,需要进一步了解图层关系、抠图、钢笔工具,橡皮工具,吸管工具,画笔工具等常用工具、蒙版、滤镜,从而熟悉图层样式,具备版式排版应用、海报合成设计的能力。色阶、对比度、曲、色相饱和度、色相平衡、调色融合案例、剪切蒙版、混合模式、图层样式1、图层样式2、滤镜效果。2、AI工具的使用最好的方法不是给出大段的文字描述,介绍每个功能,而是找具体的实例去操作,从实例的操作去学习该软件的功能。我们通过以下几个实例去简单讲讲AI的使用方法,了解AI的基本操作、AI复制、旋转、转换矢量图、AI的分割、剪切蒙版、平滑、扩展、AI路径文字、效果、形状生成器、AI渐变、立体字、AI二方连续、四方连续等。从而达到熟练结合应用PS和AI工具对素材进行处理,根据要求完成3D效果、混合效果等各种特殊效果的设计。二、制作图标的视频教程掌握了设计工具,那我们来简单分享几个不同风格的图标,去看看这些风格的图标应该如何制作呢?1、剪影图标剪影图标大多数是单色表现,当然也有双色图标。剪影图标简洁大方、高度提炼出图标的意义,能够通过最简单的线条的表现出该图标代表的作用。看似简单的剪影图标,其实考验了设计者对于产品需求的高度提炼,突出理性与感性在功能传达上的逻辑思维。2、扁平图标扁平化设计风格在APP的设计中常常都能看到,那图标也不例外。所以学习扁平化的设计风格有很高的通用性,在平时设计工作中也会经常遇到。那扁平化风格其实是从iphone开始流行起来,其特点就是所有元素的边界都干净利落,没有特效、没有过多的装饰效果,组成元素简单,能够直观的传达信息。3、临摹图标都说学习图标设计最好的方式是先临摹,那我们选择毛线图标、毛球图标和播放器图标去看看,这类的图标是如何设计出来的呢。毛线图标和毛球图标是两种图标的表现形式,毛线型的图标绘会将毛线针织的一针一线体现在设计中,有中温暖和温馨的感觉。如果毛线的质感运用得恰当,会让设计出彩,那毛球图标也是一样。虽然这类的图标实用性较小,但是了解一下增加一下自己的设计知识储备。4、拟物图标虽然现在大多数应用都是扁平化发展,但是流行是个圈,拟物化风格又在悄悄开始流行起来了。想必UI设计师们都能感受到“新拟物风格”这股风现在刮的多么凶猛了。那我们通过拟物话筒图标、拟物篮球图标、拟物伞、水滴图标、拟物甜甜圈图标的学习去紧跟这个流行趋势吧。三、图标网站学习的过程汇总需要大量的临摹素材或者是灵感来源,在这里分享几个图标类的网站。1、阿里巴巴矢量图标库:国内功能很强大且图标内容很丰富的矢量图标库,提供矢量图标下载、在线存储、格式转换等功能。图片来源:阿里巴巴矢量图标库2、IconStore:是一个提供一流的免费图标包素材的站点,汇集了很多优质的icon素材。图片来源:IconStore3、Flaticon:图标设计丰富。图片来源:Flaction4、MaterialDesignIcons:包含常用的图标,如用于媒体播放、通讯、内容编辑、连接等等。图片来源:MaterialDesignIcon5、LogoMaker图片来源:LogoMaker除了以上图标设计网站,优秀的图标设计网站还有icons8、iOS11IconPack、IconsMind、IconStore、iconfinder、Icons|FontAwesome、徽标实验室-测试您的徽标、标志情报局-全球LOGO新闻和品牌设计趋势权威媒体(LOGONEWS)、SimpleIcons等。图片来源:阿多比设计学院学员作品设计图标,获取灵感最快的方式还是手绘,所有图标的初稿可能都来源于图纸,再通过电脑制作反复打磨出符合产品特色的终版图标。想要做出完美的图标实际还是很困难的,这不仅需要设计的经验还需要很高的图形处理能力、想象力和逻辑思维。图标是人机交互的重要组成部分,它具有高度的视觉化和形象化等特征,就是说图标设计师用设计的图标去抽取表达产品的功能、动作的寓意以及实现。因此,它承载着向用户传递交互信息的任务,促使用户正确认知从而实现正确的操作。所以小小的图标背后有大大任务,希望以上图标学习的内容能够带你了解入门图标设计,也希望你在今后的工作中能够设计出优秀的图标。这6种常见的插画海报风格你知道吗?2020年可以说是插画的天下曾感动无数人的《热干面好久不见》到最近的各种节日品牌海报都能见到插画的身影那插画常见的风格有哪些你知道吗?小A将通过这篇文章带大家了解一下插画海报的常见风格!扁平风格插画主要由色块构成,造型几何化,外轮廓光滑,信息更加直观,能够让人一眼看上去就知道界面所传达的信息。扁平化的界面也能够更好地实现画面的转化,网页加载得更快,因此,扁平风格插画被广泛应用于各个领域。描线风格,是在扁平化风格之上的延伸。在扁平化元素中添加外轮廓和描边,描线插画的外轮廓加上描边,相对于扁平化风格来说,更加地立体,可爱,往往会用在海报、引导页面、logo等之中。肌理风格插画也叫做颗粒噪点风格,是扁平化风格的又一个分支,将页面叠加颗粒肌理,呈现出一种磨砂质感,有点像沙画的感觉,但又比沙画细腻。主要表现形式是运用大量色块的表现,元素单一干净,肌理常叠加在元素的高光及阴影处,通过颗粒感来增加画面中的细节,画面过渡自然,立体生动,画风轻松随意。浮世,佛语里是指“繁华又空虚的人世间”,浮世绘是将人世间的浮沉聚散不定地用绘画的形式表现出来。浮世绘画风以传统版画为基础,强调线条及色块的平涂,色彩艳丽,以鸟、鱼和海浪等为主要表现形式。MBE插画是由Dribbble的一位设计师创造的风格,采用黑粗线条描绘元素,除去画面中不必要的元素,色块有明显的区分,圆润可爱。和小元素配合,常用于引导页、启动页、logo等。水彩插画是近几年比较流行的一种画法,简单的线条加上温和的色彩,宁静自然,线条简单随意,水彩插画的创造性特别强,既能够表现写实、抽象、魔幻等各种风格。插画是我们在生活中最常见的设计元素之一近几年逐渐成为海报设计的主流不同风格的插画风格带给人们不同的视觉感受你更喜欢哪一种呢?