PDA 个人数字助理

查看完全版本 : 像素画系列教程 工具的选择 [1]------作者:郎


jjnn
2004-07-14, 02:17 PM
像素画系列教程 工具的选择 [1]------作者:郎


编者:我们这里说的“像素画”并不是和矢量图对应的点阵式图像,像素画也属于点阵式图像,但它是一种图标风格的图像,更强调清晰的轮廓、明快的色彩,几乎不用混叠方法来绘制光滑的线条,所以常常采用gif格式,同时它的造型比较卡通,得到很多朋友的喜爱。绘制这种像素画除了须具备相当的耐心之外,造型、绘制方法也很重要。本系列教程将由浅入深介绍绘制像素画的各种绘制方法和技巧,希望大家喜欢。

  (注:文本插图中标注PIXEL FOREST字样的由本文作者郎绘制,其余插图由ICONCN的Jill绘制,在此表示感谢。)

  当许多不同颜色的点一个个巧妙的组合与排列在一块后便构成了一副完整的图象,这些点便称为像素(pixel),图象称之为Icon(图标)或者称为像素画。其它的点阵式图象虽然也由像素组合而成,但是它们在制图过程中并不是十分强调像素,甚至根本无需去考虑到像素的变化,与之相比像素画对于像素更是逐个描绘,处处见真章。
http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-01.gif http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-02.gif




  作为像素画来说应用范围相当广泛,直至今天我才恍然大悟,原来从小时候玩的FC家用红白机的画面直到今天的GBA手掌机;从黑白的手机图片直到今天全彩的掌上电脑;即使我们日以面对的电脑中也无处不充斥着各类软件的像素图标。如今像素画更是成为了一门艺术,深深的震撼着你我。下面我们就来谈谈第一步,工具的选择和使用。

  像素画欣赏(建筑)
http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-1.gif http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-3.gif http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-4.gif http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-5.gif http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-6.gif




  很多人被应该使用什么工具来制作像素画所困绕,其实选择什么样的软件,因各人的习惯而定,无论你选择了什么软件,其制作像素画的流程还都是一样的。制作像素画的软件一般可分为两种类型,一种是用来制作Icon图标的专用软件,比如Microangelo、Iconcool、Articons等等;另一种则是用来编辑位图的图形软件,比如:Photoshop、Fireworks、甚至Windons自带的画板工具。因为我偏爱于Photoshop的缘故,所以本系列教程所使用的软件皆为Photoshop 6.0。

  当以Photoshop作为绘制像素画的工具时,首先当然是要掌握Photoshop的使用,如果你从没有接触过Photoshop,那你可以先用Windons自带的画板工具来代替。

  其次是要善于利用Photoshop的功能上的优势:

  1、画布大小你可以随意设置(但是分辨率最好保持在72dpi左右);
  2、各类工具的快捷键以及便捷的复制粘贴功能;
  3、网格、标尺、辅助线功能帮助你正确定位;
  4、最最强大的图层功能,让你随心所欲,驰骋画布。
  5、双窗口功能,复制出一个内容、名称完全相同的视图,一个放大了绘制用,一个保持100%大小预览用,这对绘制像素画而言是很重要的一个功能。(菜单View/New View)
  6、历史记录功能等。


  像素画欣赏(人物)
http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-2.gif http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-9.gif
放大图http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-8.gif http://www.blueidea.com/articleimg/2003/12/1492/1/yl-021025-pixel-7.gif

jjnn
2004-07-14, 05:05 PM
正如组成汉字有基本的点、横、竖、撇、捺等笔划一样,在像素画中也有规范的笔划,我们称之为基本线条。每种特定线条都是根据像素特有的属性排列而成,并且广泛运用于各类像素画的绘制中。很多人画像素画时总感觉边缘粗糙,主要就是由于线条使用不当造成的。

  如下图所示,规范的线条所绘制出来的像素画画面细腻、结构清晰;而非规范的线条使用时像素点“并排”“重叠”现象严重。

http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_1.gif http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_2.gif


下面我们一起来看看像素画中常用的几种线条。

  1、22.6度的斜线

  选取铅笔工具并选择1像素的笔刷,以两个像素的方式斜向排列,共分为双点横排、双点竖排两种排列方法。此类线条较常用于建筑的描绘,因此3D建筑的统一透视角度也为22.6度。

http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_3.gif
2、30度的斜线

  选取铅笔工具并选择1像素的笔刷,以两个像素间隔一个像素的方式斜向排列,当竖向排列时则形成了60度的斜线,此类线条使用较为灵活,经常与其它线条配合使用,以便完成一些特殊的造型。
http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_4.gif

  3、45度的斜线

  选取铅笔工具并选择1像素的笔刷,以一个像素的方式斜向排列,此类线条掌握比较简单,较常用于平面物体以及建筑斜面的绘制。
http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_5.gif
  4、直线

  选取铅笔工具并选择1像素的笔刷,同时按住Shift键,拖动鼠标就可准确的绘制出直线来。
http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_6.gif
  5、弧线

  因为弧度大小的关系,因此弧线画法有很多种。选取铅笔工具并选择1像素的笔刷,分别以像素3-2-1-2-3、4-2-2-4、5-1-1-5的弧型排列,其排列具有一定的规律性以及对称性,如图所示。此类线条较常用于人物头像、动物的绘制。
http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_7.gif
  一副像素作品如果总是要一个个点出来啊,实在是受不了,所以把常用的线条笔划以及基础图形定义成笔刷,可以大大的提高工作效率。

  自定义笔刷具体步骤如下:

  步骤一:新建一个文档,大小随意,解析度设置为72dpi左右以及RGB色彩模式,选择背景色为白色,前景色为黑色。

  步骤二:选取铅笔工具并选择1像素的笔刷,分别绘制线条或者基础图形。

  步骤三:绘制完一个线条或者一个基础图形之后,选择Edit—Define Brush(编辑—定义画笔),这时画面上你绘制的线条或者基础图形就会定义成一个新的画笔,画笔控制面板中也会出现。

  步骤四:当你自制完自己的所有个笔刷后,你可以把原有的笔刷一个个清除掉,然后点击画笔控制面板上的圆形小三角,选择“存储画笔”,这样一个完全属于你自制笔刷文档(.abr)就完成了。你可以随时根据你的需要,“载入画笔”或者再增添新的笔刷。
http://www.blueidea.com/articleimg/2003/12/1492/2/softyl201101_8.gif

jjnn
2004-07-14, 06:03 PM
  掌握了像素画基本线条的画法之后,我们来尝试基础图形的绘制。通过本章的学习,我们将初步了解到线条之间的组合规律。
http://www.blueidea.com/articleimg/2003/12/1492/3/yl-021105-ps-1.gif

  等边三角形

  选取铅笔工具并选择1像素的笔刷,绘制一条60度的斜线(图示红色部分)然后再绘制一条与之相对称的斜线,最后连接两条斜线,等边三角型就完成。如果把60度的斜线换成45度斜线的话,则能完成直角三角型的绘制。
http://www.blueidea.com/articleimg/2003/12/1492/3/yl-021105-ps-2.gif

  矩形

  众所周知四条直线就能构成一个矩形,但是在像素画中当矩形非水平位置时,画法就有所不同。选取铅笔工具并选择1像素的笔刷,以双点横线与双点竖线的画法构成矩形,如图所示。
http://www.blueidea.com/articleimg/2003/12/1492/3/yl-021105-ps-3.gif

  圆角

  选取铅笔工具并选择1像素的笔刷,任意画一个矩形,选择其中一个直角,在直角线内画弧线,最后删除多余的部分,完成圆角。弧线的弧度决定着圆角大小,弧线的弧度越大则圆角就越大。
http://www.blueidea.com/articleimg/2003/12/1492/3/yl-021105-ps-4.gif

  圆形

  在像素画中四分之圆弧直接决定着整个圆型的大小。选取铅笔工具并选择1像素的笔刷,使用画圆角的方法绘制一段弧线,把握好弧线的对称性,最后通过水平翻转和垂直翻转那短弧线组合成圆形。
http://www.blueidea.com/articleimg/2003/12/1492/3/yl-021105-ps-5.gif

jjnn
2004-07-22, 01:31 PM
  在像素画中如果只绘制单一角度的形态,始终是缺乏表现力的。如果要转变角度,那就涉及到透视的规律。

  在透视学中,透视可分为形体透视(几何形透视)和空气透视。

  形体透视是根据光学和数学的原则,在平面上用线条来图示物体的空间位置、轮廓和光暗投影的科学。

  空气透视研究和表现空间距离对于物体的色彩及明显度所起的作用。因为透视现象是远小近大,所以也叫“远近法”。

  按照灭点的不同,分为平行透视(一个灭点)、成角透视(两个灭点)和斜透视(三个灭点)。而像素画中绘制一点、两点以及三点透视的线条很难有规律可寻循,因此像素画中的透视法简化变通了上述的透视规律。根据像素线条的特有属性,一种没有灭点的俯视平行透视被广泛的运用起来。
http://www.blueidea.com/articleimg/2003/12/1492/4/softyl201107_00.gif

  1、22.6度透视

  因为像素画通常是用来绘制精致小巧的造型,并且我们知道像素画中线条运用十分讲究,因此为了符合人们的视觉印象和便于绘画,这种以22.6度双点线组合而成的俯视平行透视成了像素画透视绘制的最常用透视。

  如图所示,正方体的透视就是以22.6度的双点线构成,左右两个面透视角度一样,并且每个面都是平行四边型;整体结构清晰明朗,造型表现直观,并且易于掌握。
http://www.blueidea.com/articleimg/2003/12/1492/4/softyl201107_01.gif

  2、45度透视

  虽然转变了角度,但是每个面都是一个平行四边形这个透视规律是不会改变的。但是由于左右两个面透视角度一不同,所以在实际的绘制中很难把握好,大家应该多观察多动手。
http://www.blueidea.com/articleimg/2003/12/1492/4/softyl201107_02.gif

  3、圆柱的透视

  以顶面的椭圆的圆度来决定俯视角度的高低,如果椭圆越接近圆则俯视角度就越高,反之椭圆越扁则俯视角度就越低,如图所示。
http://www.blueidea.com/articleimg/2003/12/1492/4/softyl201107_03.gif

  4、锥体的透视

  锥体分为四面锥型,圆锥型等等,但是画法是没有区别的,底面决定锥体的大小,斜线控制着锥体的高度。总的来说,还是要多加练习,尝试用不同角度的斜线来绘制各种高度的锥体。
http://www.blueidea.com/articleimg/2003/12/1492/4/softyl201107_04.gif

练习示例
http://www.blueidea.com/articleimg/2003/12/1492/4/softyl201107_05.gif

jjnn
2004-07-22, 01:40 PM
http://www.blueidea.com/articleimg/2003/12/1492/5/yl-021123-pixel-0.gif

  造型是体现像素画特征的基本要素。造型的能力一方面来自于平时生活中知识的积累;另一方面则可以借助图片资料作为参照;甚至通过临摹优秀的像素作品以及对素描、速写等艺术学科的参透也能提高我们的造型能力。

  通俗一点来说造型就是用来表现作品形态的一种构图概念。学习造型没有捷径可寻,只有通过多看、多记、多学、多练才能有所提高,因此本章学习的并不是教你如何去造一个型,而是引导你有一个正确的造型思维方式去造更多的型。
  造型方法之一、把造型复杂的东西简单化

  如图所示,这是一个打开的盒子。在构思一个打开的盒子时,首先想到的不是打开的盒子如何难画,而是盒子的整体形态是什么,根据这个形态再去想象出盒子的大体的形状,最后才去考虑把盒盖如何打开。此种方法虽然过程烦琐,但是有利于把整体不至于产生严重的变形,非常适合初学者。
http://www.blueidea.com/articleimg/2003/12/1492/5/softyla201122_5_02.gif http://www.blueidea.com/articleimg/2003/12/1492/5/softyla201122_5_01.gif
 
 造型方法之二、逐步深入刻画

  在鼠标随意绘制出来的草图基础上,一步一步的深入下去。如图所示,海豚的造型过程,粗糙的草图通过一步步调整形态、柔化线条之后出现了精致的造型。此种方法虽然虽然简便,但是对于没有一定美术基础的人来说不易掌握.
http://www.blueidea.com/articleimg/2003/12/1492/5/softyla201122_5_04.gif http://www.blueidea.com/articleimg/2003/12/1492/5/softyla201122_5_03.gif

 造型方法之三、寻找图片资料作为参照

  当你为表达不出心中所想而困惑时,不妨试着找找相关的图片资料。如图所示,那是一台笔记本电脑的图片,通过对图片的提炼与加工,很容易一幅像素画就完成了。其实通过图片绘制像素画更有小窍门,比如在Photoshop中打开一个图片实例,缩小并且降低该图片的透明度。随后新建一层,选取铅笔工具并选择1像素的笔刷勾勒出造型的轮廓,这样就把一造型简单绘制出来了。

  但是要注意的是这样做虽然有了造型的形,但是还是缺少造型的神。还是那句话多看、多记、多学、多练才是造型的学习方法.

http://www.blueidea.com/articleimg/2003/12/1492/5/softyla201122_5_06.gif http://www.blueidea.com/articleimg/2003/12/1492/5/softyla201122_5_05.gif