来源:网络 作者:佚名
美术的重要性
任何分类的设计师都需要有一定的美术基础,甚至也要有一定的手绘能力。我们在用电脑设计图形的时候其实也在潜移默化地在使用我们储存在大脑中的美术知识和审美,即使再先进的人工智能,也不能代替设计师的审美和美术知识。说到底软件仅仅是工具而已。要想提高你图形的审美和设计感,那么就需要补一下美术基础的课了。互联网视觉设计中手绘在互联网设计中占的比重也在逐渐增多。对于我们UI设计师来说手绘也成为一个绕不过去的技能,但是不要紧张:我们不需要成为手绘大神或者插画师,只需要掌握一定的美术知识再加练习即可。那么如果我们掌握了美术知识并可以画出还可以的画,对我们会有什么好处呢?
"Outlaws" Playing Cards by Mike
美术在草稿中的优势
在作品创作的初期,草稿对我们构思起了很关键的作用。比如在APP项目、运营图、图标绘制以及一些图形化的设计中,首先很多设计师会打开电脑直接开始作图,然后就陷入了对工具选择的困惑中:我是该用钢笔工具勾形状呢还是用画笔工具呢。不要纠结这些,你只要拿出纸笔,手绘出脑海中思考的图形就好了。等草图完成后,再打开电脑完善这个作品。
"Outlaws" Playing Cards by Mike
美术在提案中的优势
在提案之前通过手绘将自己的想法画出来,和上司或者客户讲解自己的提案方向,这种方法会避免上司对电脑图形设计细节的不满意,毕竟我们还没时间完成细节。如配图中的一个图标,从最初提案到最终定稿,中间经历20多版的手绘稿件,如果每次提案都是以PS输出效果提交,在电脑绘制中要考虑的色彩细节会更多,同时也会浪费大量的时间。
手绘完成的原型图 作者:Anne
美术在原型图中的优势
开始视觉设计前,原型图的沟通可以节省双方很多时间。用软件设计出的原型图有些抽象,会让大家不了解具体内容搭配下的情况。而手绘的原型图可以帮助我们有更多的思考。不仅可以用于沟通方案,还可以后期包装展示时放入,让自己的作品区别于他人。
手绘风格的运营图设计 作者:valiant_kwok
美术在实际项目中的优势
越来越多的视觉稿都将手绘插画运用在当中,增加视觉冲击感,给用户带来全新的体验。比如H5、网页、APP等项目,“walk up”APP更是运用了大量的插画表现。然而我们浏览某些设计的时候,总会看到并吐槽一些用到烂大街的素材,到了自己工作的时候依然会选择那些素材。再精致的素材有时候不如一些手绘原创的图形,手绘的图形插画能减少素材感,给用户耳目一新的视觉展现。尤其是现在闪屏、弹窗、运营图,手绘图表现形式已经是常态化,它们可能没有很精细,没有很美观,但是很独特、很有氛围感、很吸引眼球。如果你总是运用素材,不如尝试一下自己手绘原创一个图形,这样它的分量与价值会更大。在你尝试手绘之前,让我们先具体了解绘画的一些原理再开始动手吧。
手绘在实际项目中的使用 作者:甘地xi
三大基本关系
首先我们要了解的是在美术里最重要的三个主要关系,他们是:结构关系、素描关系、色彩关系。这三个关系简单来说就是,结构关系是物体的透视关系(也就是近大远小的空间关系)、和物体的基本结构(可以把一个复杂的物体拆解成基本的圆形、三角形、正方形、长方形等简单容易描绘的结构)等,结构关系是我们如何理解形体的基础。素描关系主要是研究光影的关系,一个物体在光源下肯定会产生如黑白灰等不同的明暗变化就是素描关系了。素描关系中最重要的就是三大面和五大调,我们下面会详细讲。色彩关系则是要研究不同的色彩互相融合产生的影响,比如邻近色、互补色、邻近色等,两个物体的颜色不一样也会产生环境色、固有色等。所以我们为了用手绘或者电脑绘图来描绘物体时,可以从这三个关系中来审视对象,就会描绘地更加准确了。
结构关系
透视
在结构关系中最重要的知识点就是透视了。透视是绘画理论术语,“透视”(perspective)来源于拉丁文“perspclre”(看透),是一种在平面绘画物体的空间关系的方法。物体由于近大远小的空间关系所以在我们观察者视角就出现了变化,这种变化和空间位置正相关。能够准确描绘出近大远小就能暗示出空间关系了。所以透视是画准结构的必要前提。
灭点
灭点指的是立体图形各条边的延伸所产生的相交点。透视点的消失点。灭点透视中,两条或多条代表平行线线条向远处地平线伸展直至相交的一点。平行的线能在灭点上推进而聚合的原则同样是以肉眼观察到的现象为依据的。
灭点
第一种透视:平视
一个物体如果是正面或者没有近大远小的关系,那么该物体横竖对齐即可。
我自己的理解就是,看一个物体,正面去看就是没有透视。和你的的视线是平行的,没有任何的偏离。
此图中的物体就是平视,没有近大远小
第二种透视:一点透视
一点透视:透视来源于一个点,形状的变化与该点的距离相关。一点透视可以理解为在一个空间内多个物体产生的近大远小的关系。
一点透视
第三种透视:两点透视
两点透视:通过两个灭点建立透视。就像我们站在一个比较庞大物体的面前,这个物体的两侧都会产生近大远小的关系。把近大远小的线延伸,它们会相较于视平线上的两个灭点。这就叫两点透视了。
两点透视
第四种透视:三点透视
三点透视:通过两个灭点和延长线进行辅助。一个高于观察者的物体除了产生两点透视之外也会在其顶部产生另一个灭点,三个灭点都存在,我们称之为三点透视。
三点透视
练习方法:结构素描
结构素描,又称“形体素描”。这种素描的特点是以线条为主要表现手段,不施明暗,没有光影变化,而强调突出物象的结构特征。 以理解和表达物体自身的结构本质为目的,结构素描的观察常和测量与推理结合起来,透视原理的运用自始至终贯穿在观察的过程中,而不仅仅注重于直观的方式。这种表现方法相对比较理性,可以忽视对象的光影、质感、体量和明暗等外在因素。大家可以尝试在纸上绘制主要表现结构的结构素描作为练习。结构素描对于美术基础不好的同学也可以适用。只要用尺子和圆规等工具搭配合适的自动铅即可上手。
达芬奇的结构素描练习
达芬奇的结构素描练习
素描关系
三大面:黑白灰
有的时候设计师经常会说黑白灰关系,黑白灰关系就是我们要介绍的“三大面”。三大面就是受光程度不同产生的:光打得多就是受光面,光打得少就是侧光面,光由折射或者完全遮住就是背光面了。这么说比较容易理解:就好比是我们的地球,热带地区就是受光面,温带地区就是侧光面,北极南极就是背光面。这与光源的距离和位置有关,越朝向和接近光源越亮。立体形状在光源的照射下都有黑白灰三个面,您可以观察分析一下身边的事物。
三大面
五大调:亮面、灰面、明暗交界线、反光、投影
五大调:1.亮面 2.灰面 3.明暗交界线 4.反光 5.投影
五大调同样是分析光影问题的,通过描绘光影我们可以塑造立体感。五大调是三大面的细分,三大面五大调是我们每位设计师都需要记牢印在心里的,在绘制一些拟物造型或者专题的时候,为了塑造更逼真的感觉,我们必须检查自己的造型有没有三大面五大调。
图中图标中的三大面五大调您能分析出来吗?
亮面:受光物体最亮的部分,表现的是物体直接反射光源的部分。
灰面:高光与明暗交界线之间的区域。
明暗交界线:区分亮部与暗部的区域,是物体的结构转折处。明暗交界线不是一条真实的线,但是这个区域一般会决定亮面灰面的势力范围,也跟随者形体来走。所以非常重要。
反光:物体的背光部分受其他物体或物体所处环境的反射光影响的部分。
投影:物体本身遮挡光线后在空间中产生的暗影。
练习方法:黑白素描练习
黑白素描的练习就是我们用铅笔来描绘对象物体的明暗变化。这种素描相较结构素描来说比较难,需要练习上“调子”。调子就是用铅笔排线而产生的明暗,需要一定地技巧。
丢勒的素描作品
色彩关系