赞助商
立即赞助

超全面!设计师必须了解的美术基础

手绘3年前 (2021)发布 流光
4.4K 0 0

编者按:章总结了想要审美和设计感,设计师必须要了解的美术基础。

一、美术的重要性

任何类别的设计师都需要有一定的美术基础,甚至要有一定的手绘。我们在电脑设计图形的时候实潜移默地在使我们储存在大脑中的美术知识和审美,即使再先进的人工智,代替设计师的审美和美术知识。说到软件仅仅是工具而已,要想你图形的审美和设计感,那么就需要补一美术基础的课了。手绘在互联设计中占的重在逐渐增多,对于我们 UI 设计师来说手绘成为一个绕过的技,但是要紧张,我们需要成为手绘大神或者插画师,只需要掌握一定的美术知识再练习即可。那么如果我们掌握了美术知识并可画还可的画,对我们会有么好处呢?

超全面!设计师必须了解的美术基础

△ 「Outlaws」Playing Cards by Mike

1. 美术在草稿中的优势

在作创作的初期,草稿对我们构思起了很键的作。如在 APP 项目、营图、图标绘制及一些图形的设计中,首先很多设计师会打开电脑直接开始作图,然后就陷入了对工具择的困惑中:我是该笔工具勾形状还是画笔工具呢。要纠结这些,你只要拿纸笔,手绘脑海中思考的图形就好了。等草图成后,再打开电脑善这个作。

超全面!设计师必须了解的美术基础

△ 「Outlaws」Playing Cards by Mike

2. 美术在案中的优势

在案之前通过手绘将自己的想法画来,和上司或者客户讲解自己的案方向,这种方法会避免上司对电脑图形设计细节的满意,毕竟我们还没时间成细节。如配图中的一个图标,从最初案到最终定稿,中间经历20多版的手绘稿件,如果每次案都是 PS 输效果交,在电脑绘制时要考虑的色彩细节会更多,同时会浪大量的时间。

超全面!设计师必须了解的美术基础

△ 手绘成的原图 作者:Anne

3. 美术在原图中的优势

开始视觉设计前,原图的沟通可节省双方很多时间。软件设计的原图有些抽象,会大了解具体容搭配的情况。而手绘的原图可帮助我们有更多的思考,仅可于沟通方案,还可后期包展示时放入,自己的作区别于他人。

超全面!设计师必须了解的美术基础

△ 手绘格的营图设计 作者:valiant_kwok

4. 美术在实际项目中的优势

越来越多的视觉稿都将手绘插画在当中,增视觉冲击感,给户带来全的体验。如 H5、页、APP 等项目,「walk up」APP 更是了大量的插画表现。然而我们浏览某些设计的时候,总会看到并吐槽一些到烂大的素材,到了自己工作的时候依然会择那些素材。再精致的素材有时候如一些手绘原创的图形,手绘的图形插画减素材感,给户耳目一的视觉展现。尤是现在闪屏、弹、营图,手绘图表现形式已经是态,它们可没有很精细,没有很美观,但是很独特、很有氛围感、很吸引眼球。如果你总是素材,如尝试一自己手绘原创一个图形,这样它的分量与值会更大。在你尝试手绘之前,我们先具体了解绘画的一些原再开始手。

超全面!设计师必须了解的美术基础

△ 手绘在实际项目中的使 作者:甘地xi

二、三大基本关系

首先我们要了解的是在美术里最重要的个要系,他们是:结构系、素描系、色彩系。

结构关系是物的透视关系(也就是近大远小的空间关系)和物的基结构(以把一个复的物拆成基的圆形、三角形、正方形、长方形等简单容易描绘的结构)等,结构关系是我们何理形的基础。

素描关系主要是研究光的关系,一个物体在光源下肯定会产生如黑灰等不同的暗变化就是素描关系了。素描关系中最重要的就是三大面和五大调,下面会详细讲。

色关系则是要研究不色互相融合生影响,比如比色、互补色、邻近色等,两个物体颜色不样也会生环境色、固有色等。

所以我们了用手绘或者电脑绘图描绘体时,可以从这三关系中审视对象,就会描绘加准确了。

超全面!设计师必须了解的美术基础

1. 结构关系

透视

在结构关系中最重要的知识点就是透视了。透视是绘画理论术语,「透视」(perspective)来源于拉丁文「perspclre」(透),是一种在面绘画物体的空间关系的方法。物体由于近大远的空间关系所以在观察者视角就出现了变化,这种变化和空间位置正相关。能够准确描绘出近大远就能暗示出空间关系了。所以透视是画准结构的必要前提。

灭点

灭点指的是立体图形各条边的延伸所产生的相交点。透视点的消失点。灭点透视中,条或多条代表行线线条向远地线伸展直至相交的一点。行的线能在灭点上推进而聚的则同是以肉眼观察的现象为依据的。

超全面!设计师必须了解的美术基础

△ 灭点

第一种透视:视

一个物体如果是正面或者没有近大远的关系,那该物体横竖对齐即可。

我自己理解是,看个物体,正去看是没有透视。和你视线是平,没有任何偏离。

超全面!设计师必须了解的美术基础

△ 此图物体是平视,没有近大远小

第透视:透视

透视:透视来于个,形状变化与该距离相关。透视可以理解为在个空内多个物体生近大远小关系。

超全面!设计师必须了解的美术基础

△ 透视

第三透视:两透视

两透视:过两个灭立透视。像我们站在个比较庞大物体前,这个物体两侧都会生近大远小关系。把近大远小线延伸,它们会相较于视平线上两个灭。这叫两透视了。

超全面!设计师必须了解的美术基础

△ 两透视

第四透视:三透视

三透视:过两个灭和延长线进辅助。个高于观察者物体除了生两透视也会在其顶部生另个灭,三个灭都存在,我们称为三透视。

超全面!设计师必须了解的美术基础

△ 三透视

练习法:结构素描

结构素描,又称「形体素描」。这素描特是以线条为主要表现手段,不施明暗,没有影变化,而强调突出物象结构特征。 以理解和表物体自身结构本质为目,结构素描观察常和测量与理结合起来,透视原理运用自始至终贯穿在观察过程,而不仅仅注于观。这表现法相比较理性,可以忽视象影、质感、体量和明暗等在素。大家可以尝试在纸上绘制主要表现结构结构素描作为练习。结构素描于美术基础不好学也可以适用。要用尺子和圆规等工具搭配合适自动铅即可上手。

超全面!设计师必须了解的美术基础

△ 芬奇结构素描练习

超全面!设计师必须了解的美术基础

△ 芬奇结构素描练习

2. 素描关系

三大面:黑灰

有的候计经常会说黑灰关系,黑灰关系就是要介绍的「三大面」。三大面就是受光程度不同产生的:光得多就是受光面,光得少就是侧光面,光由折射或者完全遮住就是背光面了。这说比较容易理解:就好比是的地球,热带地就是受光面,温带地就是侧光面,北极南极就是背光面。这光源的距离和位置有关,越朝向和近光源越亮。立体形状在光源的照射下都有黑灰三个面,你可以观察析一下身边的事物。

超全面!设计师必须了解的美术基础

△ 三大面

五大调:亮面、灰面、暗交界线、反光、投

超全面!设计师必须了解的美术基础

△ 大:亮面、灰面、明暗界、反光、投影

五大调同是析光问题的,通过描绘光可以塑造立体。五大调是三大面的细,三大面五大调是每位计都需要记牢印在心的,在绘制一些拟物造型或者专题的候,为了塑造更逼真的觉,必须检查的造型有没有三大面五大调。

超全面!设计师必须了解的美术基础

△ 图中图标中的三大面五大调你能析出来吗?

  • 亮面:受光物最亮的部分,表现的是物直接反射光源的部分。
  • 灰面:高光暗交界线之间的域。
  • 明暗交界线:区分亮部与暗部区域,是物体结构转折处。明暗交界线不是条真实线,是这个区域般会决定亮灰势力范围,也跟随着形体来走,所以常要。
  • 反光:体的背光部分受其他体或体所处环境的反射光影响的部分。
  • 投影:物体本身遮挡光线后在空间中产生的暗影。

练习法:黑白素描练习

黑白素描练习是我们用铅笔来描绘象物体明暗变化。这素描相较结构素描来说比较难,需要练习上「调子」。调子是用铅笔排线而生明暗,需要定技巧。

超全面!设计师必须了解的美术基础

△ 丢勒素描作品

3. 色彩关系

三色

三色是指色彩中不能再解的三种基本颜色。相互混可以产生出所有的颜色。黑灰属于无彩色。色彩三色是红、黄、蓝。红+黄=橙,黄+蓝=绿,红+蓝=紫。屏幕三色为红(Red)、绿(Green)、蓝(Blue),也叫色光三色,是加色模式,相加混为色。但是 RGB 依赖于脑屏幕,不同的脑由于对色彩值的检测的重现都不一,所以存在色差。家的彩色视屏幕就是由这红、绿、蓝三种颜色的点组成,将这三种颜色按不同比例混,就可以有千变万化的色彩。

超全面!设计师必须了解的美术基础

△ 屏幕三色 RGB

印刷三原色为青(Cyan)、品红(Magenta)、黄(Yellow)是减色模,混合为深灰色,并不能生黑色,所以在印刷时加上黑色油墨,才能生纯正黑,是 CMYK 颜色模。

超全面!设计师必须了解的美术基础

△ 印刷三原色

色三属性

超全面!设计师必须了解的美术基础

色相:色相就是颜色的。就像人的脸一,都是独一无二的,也就是色彩的相貌。冷色、暖色、中性色,是色彩最突出的点,简来说,决定「是什颜色」。光谱上的红、绿、蓝等就是不同色彩的色相,黑色为没有色相的中性色。色相在人眼中的不同是光的波长的长短不同所造成的。红色的波长最长,紫色的波长最短。把红、橙、黄、绿、蓝、紫种颜色和在它各之间的红橙、黄橙、黄绿、蓝绿、蓝紫、红紫这种中间色作为12色相环。能够使人清楚了的出色彩衡和冷暖色、对比色等。由12色相环也可以衍生出更多的色相环。

亮度:亮度,我理解是,亮反义词是暗,那说明是与颜色明暗程度有关。色明亮程度,简单来说,是颜色从黑到白变化。亮度最低时是黑色,亮度最高时是白色。颜色深浅不程度,与波幅度有关,也取决于环境反射有多强。亮度高色新、明快感觉,让联想到蓝天白云和青。明度低色沉、稳定、坚硬感觉,让联想到石头和钢铁。

饱度:饱度,饱度从字面的意思理解,比较饱,太饱可能就会很刺眼,就与明度关了。色彩纯粹度,色彩的纯净程度鲜艳程度,饱度越低,颜色的色相就越不明显,也与光波的幅度关,饱度低的颜色给人一种很灰,不明亮的感觉,饱度0的颜色无彩色,就黑白灰。一张图中,饱度高的方给人的感觉很靠近,饱度低的方给人的感觉很远。高饱度低饱度的色彩都给人坚硬的感觉。

4. 色彩关系

互补色

红+绿+蓝=白色,在色环上相隔180度,是比最强色组,在三原色,这两相隔180度色等量相加会到白色。经典互补色有黄色和紫色(例如比球衣)、黄色和蓝色、红色和绿色。互补色在视觉上常大冲击力,所以在使用上常潮流、刺激、兴奋感觉。

比色

指在色环上相距120度到180 度两颜色。也是两可以明显区分色,括颜色三要素比、冷暖比、色和消色比等等。比色能使色效表现明显,形多样,极赋表现力。互补色定是比色,是比色不定是互补色。为比色范围更大,括要素更多,例如冷暖比,明度比,纯度比等。

邻近色

相互接近颜色在色环上距离相距90度,或者相隔五六个数位两色。色相相近。冷暖性质相近,传递情感也较为相似。例如红色、黄色和橙色是组邻近色。邻近色表现情感多为温和稳定,没有太大视觉冲击。

类色

色相性质相,色度有深浅分(在色环上相距15度以内颜色)。

超全面!设计师必须了解的美术基础

△ 色关系

5. 固有色、光源色、环境色

了解完基本色知识,我们来简单讲讲色和关系。如想描绘好象色,那我们必须了解象固有色、色、环境色以及它们关系和变化。

超全面!设计师必须了解的美术基础

△ Workplace by Igor Kozak for Rocketboy

固有色

最简单理解是物体本身颜色。物体固有色并不存在,在绘画过程为了观察便我们常引用 「固有色」这个概念。固有色是指在条件下物体占主导地位色,比如红色罐子、绿色植物等。

色

切物体有亮下才能观察到它色。有自然(太阳、天)和造(灯),这些都各自具有不颜色。太阳是白暖色,月是偏青冷色,阴天更多是蓝灰色天,普灯是偏黄色暖色。颜色物体颜色影响很大,红色下蓝色物体你觉会是什么颜色呢?

环境色

物体围环境颜色是环境色。环境色物体影响常大,比如在个红色背景下白色石膏块,由于打到红色背景下也会「染」到白色石膏块身上,生淡红色色。所以我们在电脑作图时候也要想象环境色影响。

6. 练习方法:三大构成

三大构成指是:平构成、色构成、立体构成。三大构成起于豪学院,所在设计历史上非常重要的学术机构。三大构成是美术知识过渡计领域最重要的一个转折。掌握了美术知识并练习了一定的程度后,就可以开始三大构成练习了。

平构成:什么是画最小单位?、线、。如我们从到有需要构个画而不知所措时,可以尝试用、线、来开始。时也可以尝试用、线、来做命题进设计练习,这都是大多数高等院校设计专业进最有效训练。

色彩构:根据我们文学到的色彩知识,色彩原理、邻近色、对比色、互补色、环境色、固色,融入这些知识到一练习之中。比如用色黄色创作一对比强烈的画面。这就色彩构的练习方法了。

立体构成:通过对、重复肌、骨骼等维空间物体,成一组设计练习。通 UI 设计是二维平面的图形设计,立体构成练习可相对减弱。但是如果你对立体构成较感兴趣,可查相资了解。

超全面!设计师必须了解的美术基础

△ Cocktail Hour by Hayden Walker

超全面!设计师必须了解的美术基础

△ The Lamp by MUTI

超全面!设计师必须了解的美术基础

△ Pattern by Steve Wolf

三、色彩心理学

色彩心是美术知识习中非重要的一分,它研究的是色彩通过对人的视觉上的刺激,而引发的人的情感和感官上的变。通过对色彩的经验积累而变成的对色彩的心上的逾期感受。在生中,色彩心对人们对颜色的认知有很大的影响。而在生我们「亮亮」、「艳艳」、「淡红」、「苹果绿」来形容。如果开一快店,你会么颜色作为牌的色?为么交通灯红色表示停止通行而是绿色呢?这都是色彩心的相知识。这并是说色彩本身就具有这些含义和情感,而是我们社会和人为的认知,是于社会、生。好色彩心可带给户极佳的视觉体验,影响户的心情感和思维,引导户的感知和行为,并且促进我们自身的发展。

超全面!设计师必须了解的美术基础

△ Personal Website Final Concept by Jamie Syke

黑:黑是一种代表品质、权威、稳重、时尚的彩,同时也含有冷漠、悲伤、防御的消极情感。它是所有彩中最有力量的,能很快吸引用户的注意力。黑吸收所有光而且没有反射,以说是没有任何光进视,它和白相反。当你不想引人注目或想心处理情时常用。黑为一种无彩,能让和它合的其他彩看来更亮。所以在界面设计中,黑常与其他彩搭,使产品颜更加亮丽和时尚。即使是和暗系的彩相搭也很看。黑+红很引人注目,黑+黄活力突出有亮点。黑也有神秘、科技、稳重的彩情感,很科技产品使用黑,或用黑为背。是一种永远流行的主要彩。

超全面!设计师必须了解的美术基础

△ Stock Image Website by Anton Chandra

色:色是所有可见光进入视觉,包含了光谱中的所有色光的颜色,常被认为「无色」。色的度是最高的,并且它没有色相。在 RGB 颜色模式中,红绿蓝混得色。色传递一种简、纯真、高雅、致、任、开放、干净、畅快、朴素的情。一使用色不会引起任何情,但是当其颜色配使用,色能好的衬托,大量的留让其素脱颖而出。在界面计中,作为无彩色的色,常用于背景色,缓和各种颜色的冲突,以衬托其色彩,提高画面度,提高文字可读性。黑色和色是极端对立的色,但是黑搭配总是非常完美,远都不过。

超全面!设计师必须了解的美术基础

△ Accessories cards by Nicola Baldo

超全面!设计师必须了解的美术基础

△ 灰色按钮在计中通常代表不可点击

灰色:灰色是代表睿智、实、执着、严肃、压抑色。颜色介于黑色和白色,也属于色,没有色相也没有纯度,有明度变换。使用灰色很少会犯严误,它和任何颜色都能很好搭配,也常常用于背景色或用于突出其他色。在画,很少出现纯黑,基本都是用深灰色来代替黑色,也可以用浅灰色来代替白色。灰色不像黑色那么坚硬刺眼,它更有弹性,它比黑色更有深层力量。在 RGB 模下,红绿蓝三色数值相等为性灰,R=G=B=128为绝性灰。性灰图层常用于商业图,像精调皮肤质感。

超全面!设计师必须了解的美术基础

△ Video Gallery by Mikha Makhoul

色:传递喜庆、自信、斗志、权威、性感的感。色能刺激人视觉的一种颜色,甚至能引起一些理反应,例如跳呼吸加。易鼓舞勇气,引起人们的感波动,引发冲动消费,所以餐、电商行业的品牌多使用色,的就触发冲动,引人消费。例如肯德基、京东、小书。色的色感温暖,性格刚强外向,同时也易造人的视觉疲劳。也中备受喜被广泛运用的一种传统色彩,表吉祥、团圆喜庆。同时色也表了警示、告诫。所以界面设中常用色的文字按钮警示用户慎重操作。

超全面!设计师必须了解的美术基础

△ llustration of web design by Zoeyshen for Radio Design

绿色:是自然界中最见的颜色,代表生命、青春、希望、静、和平、舒适、全的情感。绿色是色+青色,是冷暖色之间的过渡,他可是偏向色的温暖的绿色,可是偏向冷的青色的蓝绿色。他很灵,可和各种颜色搭配产生同的感觉,起到平衡和协调的作。在生中被广泛,例如交通灯和全口的颜色。过绿色的饱和要好好控制,因为饱和的绿色人兴奋,人注意,交通灯中绿色代表可通行。

超全面!设计师必须了解的美术基础

△ Inside Intercom World Tour case study by Frantisek Kusovsky

蓝:是三原中的一种,代表永、灵、清新、自由、放松、舒适、宁静、务。在国外的 APP 中,蓝最常用。几乎没有人对蓝反感,蓝是天的颜,是的颜。深蓝常常给其他活跃极赋表现力的彩提供一个深远、平静的平台,给人强大而靠的感。被淡化依有很强的个,给人清爽、自由的感,种感还能转化为一种信任,吸引人们使用。即使在蓝中加少量的其他颜,也不对蓝的有大的影响。以让人的内心感到平和,有助人的头脑变得冷静。

超全面!设计师必须了解的美术基础

△ Urban Culture — Presentation Slides by Hrvoje Grubisic

紫色:紫色是一种代表优雅、浪漫、高贵、尚、神秘、梦幻、灵性、创造性的颜色。是孩和有创造力的人十喜欢的颜色。红+蓝=紫,在色盘上位于红色和蓝色之间,是冷暖色的交。紫色的度在所有彩色的颜色中是最低的。不同的颜色结会展现出不同的风格色。紫+常用于性化的产品调性,黄色是紫色的对比色。紫+黑略显沉闷,压抑。紫+,可以使紫色沉闷的性格消失,变得充性的魅力。

超全面!设计师必须了解的美术基础

△ Webdesign by Firman Suci Ananda

黄色:黄色是代表阳、青、活力、时尚、尊贵、年轻轻快、辉煌、希望颜色。红色+绿色生黄色。黄和蓝是互补色。是四个心理学基色。黄色明度极高,极为显眼,尽管在警示效上没有红色那么明显和强烈,是是能很醒目和危险感觉。时为过于明亮,也是常难以运用颜色,性格不稳定常有偏,和颜色配合使用易失去本来性格。黄+白看起来很刺眼,是黄+黑很有亮。例如 ofo 小黄和站酷都是黄+黑组合。黄+蓝也很流,它可以唤醒蓝色沉静,造成个高比度视觉冲击。在国代黄色也有特殊含义,代表着尊贵和权威。明度较低黄色会显很脏。

四、极简设计史

做为 UI 设计师,我们必须要了解些基本设计历史和美术知识,才能我们工作有个全认识。设计史是个内容常丰富、知识复杂庞大体系。没有投入足够时很难学习明白。所以般没有太大兴趣去阅读这么长文章,可是在我们设计往往需要我们明白些设计风格和设计历史背景。为了解决这件事,我用最简短简洁地介绍设计历史几个必须了解阶段,希望能够让大家设计历史有大概了解。

超全面!设计师必须了解的美术基础

1. 设计的工匠时期(Craftsmanship Times)

计为多门类,建筑计、广告计、字体计等,究其历史相当久远。国的计可以追溯公前221年的秦朝。而在遥远的十九纪的欧,计并不是阳春雪赏心悦目,而是真实的生产力皇家用来炫耀权势的摆。就让把人类史上工业革命之前的计统称为工匠期好了。因为这个期计更近于能工巧匠。在欧,计在慢慢地向了更繁琐、更花哨的计风格。这是由于法国朝浮夸的要求而来的。法国朝炫耀权势,贪图奢,诞生了巴洛克风格(Baroque)和洛可可风格(Rococo)这的复杂风格。没错,现在还能偶尔在土豪的家中找一点巴洛克和洛可可计风格的,也有会计一些婚纱摄类网站和公网站也比较近这种丽堂皇的风格。

超全面!设计师必须了解的美术基础

△ 巴洛克风格

巴洛克(Baroque),是代表欧洲文化典型艺术风格。最早来于葡萄牙语(BARROCO)「不圆珍珠」,最初特指形状怪异珍珠。在法语,「Baroque」成为形容词,有「俗丽凌乱」意思。作为艺术风格,巴洛克最早是在16世纪下半叶在意大利发起,在17 世纪欧洲普遍盛,艺术批评家认为巴洛克是堕落瓦解艺术。

超全面!设计师必须了解的美术基础

△ 洛可可风格

洛可可风格指18世的欧洲,特别法易十五时的一种设风格。易十五执政后,宫廷活糜烂,追求复杂奢华的活。对这种洛可可风格喜加。洛可可风格的特点就妩媚矫揉造作。主表人华托(Jean Antoine Watteau,1684-1721)、布歇(Francois Boucher,1703-1770)弗拉戈纳尔(Jean Honorè Fragonard,1732-1806)。

2. 工艺美术运动(The Arts & Crafts Movement)

18世下半叶到19世半叶,业革命英展,伦敦世界博览会的新鲜技让当时的人们眼界。于办了厂,产了资本家人阶级……但我们今天讲的主设,那么设产了什么改变呢?就当的机器产不出巴洛克洛可可风格。于产品设变得很粗糙,那么家们设师们就只能把目光回以了。产了一次「设还以好」的运动,就被叫运动了。业运动中重新重视起了很多例如哥特风格,并且崇手反对机械产的产品设。

超全面!设计师必须了解的美术基础

△ 哥特式建筑风格的教堂

超全面!设计师必须了解的美术基础

△ 哥特风格的暴雪《暗黑破坏神》官网

哥特(Goth)最早是中世纪时期(公元5-15世纪)的艺术格,恐怖、超自然、死亡、颓废、巫术、古堡、深渊、黑夜、诅咒、吸血鬼等为元素。哥特式格黑暗、恐惧、孤独、绝望的艺术题。哥特原指哥特人。还有一种说法是 Gothic 源于德语 Gotik ,词源是 Gott 音译「哥特」(意为「上帝」),因此哥特式可解为「接上帝的」的意思。哥特广泛地在当时的建筑、、产设计上,是一种现在看来稍显非流的形式。

3. 德意志工业同盟(Deutscher Werkbund)

给设计一点时间,设计就会还你一个惊。在工艺美术和艺术之后,在当时工革命最领先的德意志,设计师们成立了德意志工同盟。这时因为工发展产生来了一种对繁复和过的厌恶情绪,当然是因为当时的机器生产很可无法把巴洛克和洛可可设计格演绎的很好。于是彼得贝伦斯(Peter Behrens)为代表的德国设计师们开始设计了一大简洁格的作。这些作的审美到今天都影响着我们,你现在肯定更宜、无印良的简洁设计,而你在里会发现自己爸爸妈妈总会给电视遥控器套一个洛可可巴洛克格的套子。而你的审美已经是工革命之后德意志工同盟时期就改好的了。

超全面!设计师必须了解的美术基础

△ 彼得贝伦斯(Peter Behrens)

超全面!设计师必须了解的美术基础

△ 彼得贝伦斯(Peter Behrens)作

超全面!设计师必须了解的美术基础

△ 彼得贝伦斯(Peter Behrens)作

超全面!设计师必须了解的美术基础

△ 彼得贝伦斯(Peter Behrens)作

包豪斯(Bauhaus,1919/4/1—1933/7)1919年的四月一,在国魏玛成立一所科学院。所学院也没有持续很久,就爆世界大战,是所学校就散。来在历史上是一件非常小的,是所学校的光辉一直照亮人类设计史。它就是包豪斯。

包豪斯的三个神对今的界面计都有响:

  • 设计是艺术与技术的统一。
  • 计的目的是人,而不是产品本身。
  • 设计必须遵守自然法则。

这不就是以用户为中心的计思想吗?包豪斯在互网还没有出现之前就有这的则。在解散后,包豪斯出来的一大批教和学生逃了美国、英国等地,为界计的发展做出了极大的贡献。比如蒙德安就是包豪斯建筑学的老。

超全面!设计师必须了解的美术基础

△ 包豪斯学

超全面!设计师必须了解的美术基础

△ 蒙德安作品

4. 现代主义设计(Modernism Design)

受包豪斯的响,在一战战后诞生了现代主义计。二战后也出现了后现代主义计。但是无论怎,现代主义计就是目前的计风格的基。喜欢的苹果脑、苹果机、SONY都是现代主义计风格。这个期诞生了多大家,比如柯布西耶(Le Corbusier),密斯凡德罗(Ludwig Mies Van der Rohe),迪姆斯(Dieter Rams),菲利普斯塔克(Philippe Starck)等。

超全面!设计师必须了解的美术基础

△ New York Chair(纽约椅)

超全面!设计师必须了解的美术基础

△ 日本品牌无印良品网站 现代主义计风格

超全面!设计师必须了解的美术基础

△ 安藤忠雄的建筑作品

超全面!设计师必须了解的美术基础

△ 耐克官网多使用矩形、减少装饰 现代主义计风格

5. 其他现代风格

虽然的代没有大规模的计风格变迁了,但是在现代主义之后还出现了后现代风格、解构主义等不同的风格,这些风格之前历史上的风格交融聚,诞生了一个多化的代。加上互网和移动互网的诞生,计艺术的风格空前多化了。

超全面!设计师必须了解的美术基础

△ 拟物风格图标计

超全面!设计师必须了解的美术基础

△ 乔布斯发布初代 iPhone 搭载了出色的拟物风格计

拟物风格realism

拟物风格更多的方面是在智能机流行后才逐渐兴起的。当机的图标和界面为了让大众更容易受一块黑镜上的按钮可以点,往往计成皮的质或者玻璃的质。这可以更好地让大家理解这是可以点击的。拟物风格流行了长间,直大家完全适应了屏幕化的人机交互形式,才觉得这种模拟真实界的计有些「多余」和「充噪音」。但拟物仍然是目前 UI 计中不可或缺的一个重要风格。

超全面!设计师必须了解的美术基础

△ 扁化的网页计

扁计风格realism

扁风格相较拟物风格来说,调简洁和克制。不允许计使用大量的材质和质,而是用形状和色彩来表达。最初的扁化要求更为苛刻,只允许纯色和形状。但是由于用户无法受,后来扁化的风格演化成了带有一定阴和渐变的风格。有些人说是拟物或者扁,都可以。其实就是在息传递上的噪音和表达情之中取一个中间值。

超全面!设计师必须了解的美术基础

△ 著名的波普艺术作品

波普艺术Pop Art

波普艺术来源于商业美术,点是将大众文化的一些细节,比如一些名人或者麦当劳爷爷等进行放大和复制。波普艺术于20纪50年代后期在纽约发展起来,60年代中期,波普艺术代替了抽象表现主义而成为主流的前卫艺术。在日常计中的运营计也常常见波普艺术的身。

超全面!设计师必须了解的美术基础

△ 《攻壳机动队》海报

超全面!设计师必须了解的美术基础

△ 大疆XAdidas 动海报

超全面!设计师必须了解的美术基础

△ 淘新势力周运营图

蒸汽波艺术Vaporwave

蒸汽波普是蒸汽和波普的混,起源于音,并在音频中发扬光大,那它究竟是一种怎的音风格呢? 蒸汽波(Vaporwave),vapor是蒸汽的思,加上浪的wave组成了一个充复古调、妖艳配色的风格。这种风格给人一种复古的潮流。蒸汽波在中国互网计圈火也著名,也受用户喜欢。

超全面!设计师必须了解的美术基础

△ 《银翼杀》概念图

超全面!设计师必须了解的美术基础

△ 香港 – 赛博朋克觉的地

赛博朋克风 Cyberpunk

赛博朋克(cyberpunk,生化人 cybernetics、朋克 punk 的结词),是科幻说的一种风格。现在赛博朋克的情节通常围绕黑、人工智能及大型企业之间的矛盾开始,背景在不远的将来的反乌托邦地球。赛博朋克的主题往往是克人、生化人等有识以后人类相同的一些颓废和迷幻的受。国的香港和成都的一些建筑因为地貌的因往往体现出一种后现代的科幻。多也会来这些城市采风,计的赛博朋克风格。

超全面!设计师必须了解的美术基础

△ 蒸汽朋克风的标志 – 黑死病期的鸟头面

蒸汽朋克风 Steampunk

蒸汽朋克是一个成词,由蒸汽 steam 和朋克 punk 个词组成。蒸汽然是代表了以蒸汽机作为动力的大型机械,朋克则是一种边缘文化,蒸汽朋克的作品往往依靠某种假的新术,如通过新能源、新机械、新材料、新交通工等方式,展现一个行于19纪西方界的架空界观,努力营造它的虚构和怀旧等点。蒸汽朋克风格略带颓废和黑暗的受,有些近刚才介绍过的哥风格。

超全面!设计师必须了解的美术基础

△ 西班牙计 Álvaro Peñalta 的装置作品

超全面!设计师必须了解的美术基础

△ Camille Walala 为伦敦计节做的空间

超全面!设计师必须了解的美术基础

△ Lee Broom 为英国瓷器品牌 Wedgewood 计的孟菲斯系列

超全面!设计师必须了解的美术基础

△ 知乎在地铁投放的带有孟菲斯面计风格的广告

孟菲斯计风格 Memphis Style

孟菲斯(Memphis style),是1981年由大利计 Ettore Sottsass 为首集结组成的计体,被称为「孟菲斯集」。孟菲斯的计风格颠覆了传统计观念,将对立的不同素进行拼和碰撞,使用快的色彩和怪诞的素去表达其极风格的文化内涵。孟菲斯风格在色彩上破配色规律,用一些纯度高,颜色亮的色调,尤其是红、绿等鲜艳的色彩,再加上多的图形线条组成计。孟菲斯计可以尝用在互网运营图中。

6. 设计风格的现状

生活的代是一个艺术繁荣、计多的代。以现代计为主的品牌例如:无印良品、宜家等已经成为生活的必需品了,加之多不同风格诸如洛可可和巴洛克、哥等风格的产品,组成了生活审美。在做计甲方或者产品经理总是在提「高端、大气、上档次」,实际上可能是在描绘现代主义计;「奢」可能是巴洛克和洛可可的复杂风格。所以下次在提计需求,不妨和讲解一下计的不同风格和历史,会有需求方更好地表达出想说的语言。

美术知识和设计历史常有意思,希望过以上介绍让大家设计师必须掌握知识体系生研究兴趣。是知识终归代替不了练习,如你希望学习手绘,是拿起纸和笔去练习。

欢迎关注作者的微信公众:「见」

超全面!设计师必须了解的美术基础

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

用什么样的造型手法,就呈现什么样的效果,这篇文章的目的不是要罗列 logo 图形有多少种风格,而是从不同维度(形、色、质、...
logo
编者按:我们经常会推荐各式各样的工具,但是什么样的工具推荐最有意义呢?在我看来,除了工具本身各种显而易见的功能和属性...
UI设计工具
@Daidai丶呆 :今天这篇文章的内容虽然较短,但是意义却非常深刻,值得各位 UI 设计师细品。 该项目旨在遵循以用户为中心的...
App图标
编者按:互联网让全世界都无线互联,大家可以无视距离随时浏览世界另外一头的设计师所上传的设计作品。无论是 Dribbble、Beha...
创意灵感
编者按:设计原则总是看起来简单抽象不言自明的,但是在细分的设计领域,这些原则其实有着各自不同适用情况,有着「特定的条...
ICON
@研习设K先生 :什么是正负形?这种表现形式的优势在哪?如何设计出一款让人惊艳的正负形?今天的内容会帮助你系统的梳理一遍...
logo
2019年就要过去了,这很有可能是年底最后的几波干货之一。这次的干货大合集的设计工具多数都偏向前端和开发,但是结尾推荐的...
干货
一. 智能后视镜时代背景 随着社会的发展和科技水平的提高,人们对驾驶汽车的安全性、娱乐性提出了更高的要求。汽车的中央后视...
交互设计