血のばら
【教程】【转帖】像素画绘制教程

学画像素画之前,我们先要弄清楚什么是像素画.

像素画,是随互联网普及而发展起来的一个新画种.虽然是新画种,但对于它们我们一点都不陌生.从小时候玩的FC家用红白机黑白画面到后来的全彩GBA掌上游戏机,以及现在网页上的贴图手机上的图画等等,无不都充斥着像素画的影子.然而在以前像素画只是属于数码的范畴,制作它们的只可算是工匠,在近几年开始将像素画归为艺术类,出现大量的像素艺术品及艺术家,相信是大家对像素画热爱的一种表现吧.相信不久像素画就会被摆上艺术的殿堂供人品赏.

像素画是一种通过运用电脑技术绘制的绘画.像素画通常采用gif等格式,把不同画面在同一幅图中分先后显示,即可产生动画效果.不仅有空间艺术效果,还有时空综合艺术效果.像素画属于点阵式图像(dot),却又有别于同样属于点阵式的位图.但若像素画采用wmf等格式,可成矢量式图像.

若要区分两者的差别,首先让我们了解一下两者的制作原理.

像素画,顾名思义就是通过电脑屏幕显示的最小单位"像素(pixel=picture element)"来表现的绘画作品.对于像素大家也不陌生,像素是电脑上最小的图像单位.当我们用PS等绘图软件绘制或修改图片的时候,像素也是我们首当其冲考虑的元素.像素画的形象造型,可通过各种图片处理软件对原有造型形象的改变来获得,也可用鼠标等电脑工具进行绘制.它是一种图标风格的图像,更强调清晰的轮廓,明快的色彩,几乎不用混叠方法来绘制光滑的线条,精细得让人爱不释手.再加上通常它的造型比较卡通,深得人们喜爱.然而绘制这种类型的图画需要具备相当的耐心呢.

关于位图呢我们简单的概括一下.位图(又称光栅图)同属像素阵列表示图像的点阵图.当放大位图时,可以看见无数个方块,从而线条和形状显得参差不齐.然而从稍远的位置观看会发现图像的颜色和形状又显得是连续的.

那么如何区分两者呢?其实很简单.方法有许多种.

判断一张图是否像素画,用可以查看颜色表的绘图软件打开图片,查看颜色表,如果是256色,那肯定不能算是像素画.还有就是以上说的,像素画的轮廓线条十分清晰.如果放大以后看到的不是清晰的轮廓线,那么就肯定不是像素画.(如图)

大家都知道,去底时,边缘模糊的位图会有白边,非常麻烦,而像素画去底就没这样的烦恼.

相比之下,像素画的优势在于:

1容量小,省颜色,在相同的条件下质量要显得突出.

2方便更换调色板,相同的容量大小下可以取得成倍的效果.

随着电脑网络的进一步普及,像素画具有十分广阔的发展前景.例如:

  • 游戏.这是一个很大也是很早的像素画产业.虽然说现在是3D当道,但2D游戏并没有推出游戏产业的历史舞台.利用了像素画的短小精悍便于传输,由像素画构成的2D游戏在掌机和手机的游戏领域占了主导地位.许多怀旧的人们仍然乐此不彼的回顾着2D游戏的辉煌,运用各式各样的软件DIY着2D游戏.加上像素画比3D更具有表现力,就格斗游戏而言,大家依然喜爱着拳皇及街霸等经典的2D画面.所以在我看来,像素画构成的2D游戏是不会轻易从游戏的领域消失的.
  • 绘画.由于像素画明快的色调简单的造型.收到广大绘画者们的喜爱.那个以写实艺术为主的时代已经过去,迎合现代化思想的需求,像素画为艺术开创了一个新纪元.
  • 手机.手机游戏,操作界面,短信图片等等.当今手机业越来越发达,功能也越来越多,图案也相对的越来越缤纷了.
  • AVATAR.包括论坛头像设计,QQ秀等网络形象及换装.有关AVATAR的网站越来越火爆.
  • 设计.伴随着电脑发展的产物. 很多设计师被像素画的魅力所吸引,运用像素画来完成设计工作.例如设计字体,网站,制作平面图形,设计UI界面和Icon,Flash作品.像素画设计界总可以见到.更有一大门派Isometric,主要致力于建立成角无灭点透视(Isometric)的建筑和人物来表现我们生活中的场景.用像素画来设计用户界面(UI)也非常受欢迎。

好了废话说了那么多,赶紧进入正题吧.

关于绘制像素画的工具,许多人会觉得困扰.其实选择什么样的工具绘制都无所谓,这些都是因各人的习惯而定的,无论你选择什么软件,制作的原理以及流程都是一样的.制作像素画的软件一般可分为两种类型,一种是用来制作Icon图标的专用软件,比如Microangelo,Iconcool,Articons等等.另一种则是用来编辑位图的图形软件,比如Photoshop,Fireworks,甚至Windons自带的画图工具都可以的。

所以如果你没有熟练的掌握PS,那么在Windons自带的画图工具上画也是可以的。[yct1]

准备好了嘛?那么我们就开始学习咯~

该贴已经同步到 血のばら的微博

血のばら
如何让你的画面动起来
展开Biu

八楼-如何让你的画面动起来

用photoshop制作gif动画图片指导

只要是photoshop6.0以上的就用自带ImageReady ,先找到你要做的原图 ,然后

第一步:

启动photoshop,并打开需要的两幅图!

第二步:

会弹出修改框,修改宽度和高度的像素。注意下面红线里的约束比例!要改成非比例的大小就把勾点去!然后将两副图片的大小调一致!

第三步

很多JPG格式的图在photoshop8.0里锁定的,所以双击图层里的背景项,会弹出一个选项框,选择好~将背景变为图层!(同理,另一幅图片也这么做。但注意在photoshop里通过点击图片来改变当前编辑的图片,所以改另一副图先点击一下)

第四步

选择左边工具条上面左边的工具! 然后点住一幅图片将它拖至另一副图片里! 这时在图层里应该是有两个图层!将两个图片根据画面的大小对对好~按保存!

第五步:

这时启动ImageReady,打开你刚保存的图片!

第六步:

在动画工具条里点击“复制当前帧”,复制后,在动画里会显示有两个帧!

第七步:

点击动画工具里的“过度...”按扭!点击后会出现过度对话框!在“要添加的帧数”里选择你希望的帧数,默认是5,这里我们也选择5,然后点击“好” 这时动画栏里会显示有7个帧!

第八步

这时看看图层里的当前图层是否为上面的图,不是的话点击来改变当前图层! (注意有兰色条显示的就是当前图层!)选择好当前图层后,点击动画栏里第二个帧!点中后第二帧应该是兰色的! 然后在图层栏那边改透明度!将其从100%改为80%

第九步

接着选择第三个帧 将其不透明值改为60%

第十步:

同样的方法点击第4帧!将其不透明值改成40%。

点击第5帧,将其不透明值改成20%

第十一步:

点击第1帧,点击“选择帧延迟时间”点击后会弹出个菜单!选择0.2秒延迟后,第1帧下面会变为0.2秒。当然可以根据你的喜好改变。

第十二步:

点击第7帧,和上面一样延迟0。2秒

第十三步:

点击“播放”按扭。就可以看到效果了

第十四步:

准备保存了,在转为GIF文件前,先设下优化值!在预设一项将其值改为 GIF 128 仿色 然后选择文件菜单里的“将优化结果存储为” 选择文件名后,就完成了

[查看全文]
血のばら
实例绘制教程
展开Biu

七楼-实例绘制教程(人物篇)

谁不想在BBS上有一个个性的头像或者在自己的留言本中有一套专用的人物图标呢。因此像素人物绘制受到很多人的追捧。越来越多的人正因为忠爱于这方寸之间的“精灵”,才渐渐走进了像素画的领域。

新建一32×32的文档,使用辅助线大致划分好中心线、头顶、眼睛、下巴、身体的各部分。紧更着就是用黑色绘制出人物的轮廓。绘制人物轮廓时人物的轮廓并不是一步就要求画完整,往往是需要反复的修改才能有一个比较合理的雏形。当然在这所有的之前,你首先要脑海里确立一个人物影象或动作,明确自己所要画的是人物风格是Q版的、漫画的、还是写实的。

塑造好基础造型以后(但是这里要提醒大家,人物造型虽然塑造好,但是在接下来的过程中始终还要边画边改,直至完成),可以开始上色了。首先确定MM的肤色,不容质疑MM是炎黄子孙,当然是黄皮肤。其次绘制兰色的褂子与红色内衣。这里衣服的颜色只是起到一个辅佐作用,以便协调整体颜色的布局。

刻画头发的颜色,为了把额头部分的头发与脑后的头发区分出来,我们用灰色填充前面的头发。同时也对头部的装饰物略作修饰。

基础的颜色绘制完毕之后,拟订好从左至右的光照,开始用较深的颜色刻画发部、面部以及衣服处的暗面。绘制时你会发现虽然是左部受光右部背光,右部暗于左部,但是经过光照之后,它们就会产生相互影响的关系。比如,额头的毛发使面部产生阴影,而人物的头部又直接影响脖子与肩膀处的明暗关系。

为了继续充实画面,在有限的空间里营造出古典美女动人的形象,我们考虑给她头部添加饰物。饰物造型可根据发型来决定,总之既要简单又要能出效果用来充实发型的单调平板的地方。最后绘制出一面的饰物之后,在通过复制、粘贴、水平反转出另一面的饰物。

修饰脸部,在皮肤色与暗面这两种颜色的基础上,使用添加中间色的方法使面部颜色过渡更为自然与饱满。同时眼睛四周的颜色也要稍作刻画,使其与面部更为融洽。

为了表现出额头部分的头发的质感,也要做深入的刻画,根据头发垂直的条理,顺着竖向添加亮色烘托头发的质感。在放大与正常显示之间进行比较,可再作修改。

最后就是统一整体和一些小细节的刻画了,比如修饰一下环形发髻,画出亮部;描绘眼睛的颜色,用褐色把本来的蓝色部分替换掉等等。一副像素人物作品就算完成了。如果要使你绘制的作品更传神,那就一定要把握人物性格,同时也要溶入自身的感情,作品才会更精彩。

[查看全文]
血のばら
实例绘制教程
展开Biu

六楼-实例绘制教程(建筑篇)

当一幅幅以像素画构筑的城市出现在电脑屏幕上,那些精致小巧又气势十足的建筑群在吸引我们眼球的同时也深深的震撼着我们的心灵。

新建一文档,文档大小200×200PX左右,虽然实际绘制中并不需要这么大文档,但设置稍大点有助于把握空间感。其次考虑绘制建筑物的角度,一般来说22.6度双点线构成的角度是首选。使用双点线构筑出建筑物最为原始的几何形体,那第一步就算完成了。

在几何形体上继续绘制屋顶,为了表现出屋顶的倾斜面,这里使用了45度线。同时还要注意的是屋顶是扣在房身上的,其面积应该大于房身。

进一步刻画房屋的造型。划分楼层以及房子的门窗。

在造型完成后的基础上简单的为房子上一层颜色,绘制出黄墙红顶的效果来。注意区分明暗面,记住如果左面是暗面的话,那右面就是亮面这个道理。

上完基础颜色之后再继续对每层楼的窗户以及大门绘制出玻璃的蓝色来。

淡化屋顶墙面原本划分区域的黑色线,当黑色线变成淡淡的勾勒线时,此时的房子的效果应该已经出来了。

别急着收工,我们再来加工一下房子的质感,在刚刚勾勒的墙线下面我们在提亮一个线,使墙面更具立体感。然后对屋顶也处理一下,这样才能算完成了。如果想在继续做的完整,可以如图一所示对房子的周围进行装饰,添加草坪、树木、花坛等等来美好你的房子。

[查看全文]
血のばら
实例绘制
展开Biu

五楼-实例绘制(动物篇)

像素画中绘制动物造型有着写实与卡通之分,但因像素画皆以小巧可爱著称,所以绘制像素动物画时也大都采用卡通造型。

绘制卡通动物,有几个好处,一是不用刻意准确把握现实中动物的形态,适度的夸张变形可以让形象更加生动可爱;二是上色更为简洁明了,容易博得别人的好感;三是图片资料随手可得,想画什么就什么。

一只卡通狮子的绘制来阐述一下动物类ICON的绘制全过程。

新建一32×32的文档,绘制出狮子的轮廓。在绘制左右结构对称的作品时,你可以先出绘制一半来,而后再复制粘贴出另一半来,最后水平翻转对齐两半就可以了。这个狮子的造型,我主要参考了迪士尼的狮子造型再加以修改就成了现在的样子了。参考造型时要抓住动物的特点,才能为自己所用,比如狮子显著的特点就是鬃毛、鼻子、脸部等。

因为整个狮子轮廓是对称的,看上去就显的不够真实。所以就要对对鬃毛做些调整,如狮子额头,下巴的毛从新整理之后就显的更为自然了。其次就要为狮子整体铺上颜色,这里无须考虑很多,只要区分出皮肤,毛发这两个块面就足够了。

上完主色,就要考虑明暗了,假设光源是从左至右照射过来的,那么狮子的左侧就应该是受光部分,右侧就背光部分(暗面)。遵循这个原理在原有颜色的基础上加深颜色绘制暗面。同时由于狮子下巴鬃毛对胸口的影响,所以胸口也应该出现阴暗面。

此时狮子的皮肤上已经有了原色与暗面这两种颜色,我们可以继续在这两色之间添加中间色,使其肤色更为饱满生动。

其次刻画细部,调整一下颜色,如狮子的眼睛,鼻子,嘴巴等部分。由于下巴上的毛是往下生长的,适当柔化一下下巴与鬃毛之间的黑线,用深于毛色阴影的颜色描边。

最后,由于左侧头部毛发反光的关系,所以还要在这个部位提亮颜色。一幅像素动物作品就大功告成了。

[查看全文]
血のばら
色彩及明暗关系
展开Biu

四楼-色彩及明暗关系

要理解和运用色彩,必须掌握进行色彩归纳整理的原则和方法,其中最主要的是掌握色彩的属性。像素画中色彩运用当然也遵循着这种规律,但是在这里我们并不会去解析这些烦琐的问题。毕竟这只是一篇像素画的教程,如果想要深入这些问题,不仿可以找些关于色彩的明度、色相、彩度以及色彩混合、色彩对比、色彩搭配等。

针对像素画色彩运用,我们大致可以简单的理解成为:平面的纯色填充、中间色的过渡、色彩明暗关系的确立。而其中平面的纯色填充,并没有任何技巧性的东西,只要有足够的耐心就可以了。因此本章着重于像素画颜色过渡规律的学习。

像素画颜色过渡方法之一、均匀过渡

同一色系中把颜色由深至浅或者有浅至深的排列,以起到均匀渐变的效果。此种过渡方法普遍运用于小范围的像素绘画中。如图所示:

像素画颜色过渡方法之二、双色过渡

  根据其中一种颜色点的疏密排列,产生过渡效果,此种过渡方法较常用于平面的绘制上。绘制这些点因为具有规律性,所以这时你可以使用一下复制与粘贴功能,将会大大改善你的工作效率。如图所示:

像素画颜色过渡方法之三、圆柱体过渡

  同一色系多种颜色的渐变过渡,以至达到一种立体感,此种过渡方法适合于圆柱类物体的上色。如图所示:

像素画颜色过渡方法之四、网点渐变过渡

  另一种平面的过渡方法,在一种颜色的基础上再叠加网格,绘制出的物体过渡自然,颜色饱满,但是难度较高,不易掌握。如图所示:

[查看全文]
血のばら
透视造型
展开Biu

三楼-透视造型

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

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

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

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

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

1、22.6度透视

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

如图所示,正方体的透视就是以22.6度的双点线构成,左右两个面透视角度一样,并且每个面都是平行四边型;整体结构清晰明朗,造型表现直观,并且易于掌握。

2、45度透视

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

3、圆柱的透视

  以顶面的椭圆的圆度来决定俯视角度的高低,如果椭圆越接近圆则俯视角度就越高,反之椭圆越扁则俯视角度就越低,如图所示

4、锥体的透视

  锥体分为四面锥型,圆锥型等等,但是画法是没有区别的,底面决定锥体的大小,斜线控制着锥体的高度。总的来说,还是要多加练习,尝试用不同角度的斜线来绘制各种高度的锥体。

基本造型:

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

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

造型方法之一、把造型复杂的东西简单化

如图所示,这是一个打开的盒子。在构思一个打开的盒子时,首先想到的不是打开的盒子如何难画,而是盒子的整体形态是什么,根据这个形态再去想象出盒子的大体的形状,最后才去考虑把盒盖如何打开。此种方法虽然过程烦琐,但是有利于把整体不至于产生严重的变形,非常适合初学者。

造型方法之二、逐步深入刻画

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

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

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

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

[查看全文]
血のばら
基础绘制方法
展开Biu

二楼-基础绘制方法(线条图形等绘制方法)

我们的教程选择用PS来教大家绘制像素画,其原因是:

  • PS已是一款普及量十分大的软件,基本上没有人不会使用它了.
  • PS的画布大小可以任意设置,画面也可以任意放大缩小.
  • 图层功能可以使你随心所欲的绘制.
  • 网格标尺等定位工具的辅助.
  • 各类工具的快捷键方便快捷.
  • 强大的历史记录功能画错了也不怕.
  • 双窗口功能,可以复制出一个内容完全相同的视图,一个放大了绘制,一个保持实际像素的大小预览.这个功能对于绘制像素画而言十分重要.

其实如果还是嫌麻烦.Windows自带的画图软件是个不错的选择.简单实用.

首先我们从最简单的如何绘制线开始.正如我们写字一般.每个字都有规范的笔画,不论是汉字还是E文字母.像素画也一样.每个点都有自己的排列方式,才能构成一条条线,一条条线正规的排列起来,才能构成漂亮的图形.

先新建一个文件~

多大都无所谓,但是640X480就足够了,但是分辨率一定只要72像素(如图 )

可以把标尺网格都打开.绘制的时候最好放大到400%以上.(我是放大了600%[yct1] )

选择铅笔工具,随便选一个笔形,将像素调至1(如图)

之后就可以开始绘制了.

1. 直线

只需按住Shift键,拖动鼠标即可准确的绘制出直线.(如图)

2. 45°的斜线

以一个像素的方式斜向排列,此类线条常用于平面物体及建筑的斜面绘制.(如图)

3. 60°(30°)的斜线

以两个像素夹着一个像素的方式斜向排列,当竖向排列时则形成了60°的斜线,此类线条经常与其它线条配合使用,以便完成一些特殊造型.(如图)

4. 22.6°的斜线

以两个像素的方式斜向排列,可分为横竖两种排列方法.此类线条较常用于绘制建筑,因此3D建筑的统一透视角度也为22.6°.(如图)

5. 弧线

弧线的排列方式有许多种,这里列举常用的4种.分别以像素①5-1-1-5,②4-2-2-4,③3-2-1-2-3,④2-2-2-2的弧型排列,这些排列具有一定的规律性以及对称性,常用于人物头像或动物的绘制.(如图)

基本线条介绍完了,可是一幅画全部都由铅笔一个一个的点出来那可受不了呀.所以我们可以将常用的线条制作成自定义笔刷或者图案,这样就省事多了.

制作笔刷的方法:

1.先在纸上绘制出所需要的线条.如图→(一定要不透明哦)

2.编辑中选择定义画笔预设.如图→

3.起个好听点的名字啦~

4.最后就会有许多现成线条的画笔啦~到时候想用哪个就用哪个,大大节约了时间提高了效率.

学习完线条的基本绘制,我们现在来学习如何绘制图形.

1 .矩形

众所周知的四个直线就能构成一个矩形,但如果矩形不处于水平状态的话,就不是那么简单的画直线了.

我们可以运用上面所教的,两个像素的横向和竖向的组合排列构成这种矩形.(如图)

偷懒的话,可以先绘制①红色部分再将其复制旋转180°构成②,这个形状就形成啦.

2.等边三角形

运用上面所教的绘制一条60°的斜线(红色部分),再绘制另外一条与之相对称的斜线(当然水平翻转也可以.)最后连接闭合这两条斜线,等边三角形就大功告成了.(如图)如果把60°的斜线换成45°的斜线的话,就变成了直角三角形了.这里我就不演示啦~

3.正菱形

绘制方法和直角三角形一样,可以先绘制①(红色部分)再将其复制旋转构成②,就完成啦~(如图)

4.不规则菱形

这里使用的是22.6°的斜线绘制出①(红色部分)再同上复制旋转构成②就大功告成了.(如图)

5.圆角

画任意一个矩形,任选一个角,绘制弧线(红色部分二本),再将多余的部分(如图②中的绿色部分)擦去.最后就会看到如图①中显示的那种圆角啦~

6.圆

我们先将圆分为四个部分来看(如图).四分之一的弧线大小决定着这个圆的大小.首先绘制弧线①(红色部分),要把握好对称性YO~再运用水平翻转和垂直翻转的方式复制出②③④,最后将空缺的地方添补上(黄色部分),圆形就大功告成啦~

好啦~线条及图形的教程就告一段落.下面我们会学习怎么上色的

[查看全文]
血のばら
像素画定义及其使用软件工具介绍
展开Biu

一楼-索引

0楼-像素画定义及其使用软件工具介绍

2楼-基础绘制方法(线条图形等绘制方法)

3楼-透视造型

4楼-色彩及明暗关系

5楼-实例绘制教程(动物篇)

6楼-实例绘制教程(建筑篇)

7楼-实例绘制教程(人物篇)

8楼-如何让你的图画动起来

9楼-声明感谢以及绘图工具材料发布

[查看全文]