浅谈设计中的索引色

http://www.itjxue.com  2015-08-07 22:15  来源:未知  点击次数: 

说到索引色,也许很多朋友都没有接触过这一块儿。

首先,我们要说,为什么要用索引色图片?我们在设计PC界面的时候,用的几乎都是真彩色,不受颜色的限制,可以直接生成PNG;或者BMP加一个透明色,由工程师直接透掉。可是,我们设计的域很广,我们不止要在PC机上做设计,还要在很多受限制的电子产品类上做设计,比如手机、数码相框、电视盒等等。这一类产品的蕊片不如我们的PC机的性能(当然,我说的也不是全部,有一些还是很高端),在这种类似的情形下,我们就需要牺牲一些绚丽的真彩色图片,而采用小而容易更换色盘的索引色图片。

我们要问什么是索引色图片,索引色图片是如何购成?索引,顾名思义,就是有一个东西在指索着它,而这个东西就是颜色表。说到颜色表,我们来了解一下较基础点的知识,大家知道,我们现在使用的图片格式,大至分为两类存储方式,一类点阵存储,计算机在存这一类图片的时候,对每一点存储的是位置和相对应的颜色值。像BMP、Png24、Tiff等图片格式都是采用这一种,这种图片的特点是颜色可以表现的很丰富,色感好,图片占用空间较大(png24采用了无损压缩技术,相对已经小了很多);另一类是在图片文件内包含了一个颜色表,计算机在存图片上的每一个点阵的颜色时,存储的是点阵的坐标和相对应的颜色表上的位置。Gif、Png8等采用的是这一种,这种图片的特点是图片占用空间小,可直接更换色盘来更换图片颜色风格,缺点受色盘限制,使用的颜色较少,不像真彩色可以把颜色表现的这么丰富。我们所说的索引色图片,其实就是第二类图片,我这么讲,不知道大家是否明白了呢?

索引色图片的制做方式。要做一个好的索引色图片,首先要设计一组好的色盘,注意,我说的是一组,不是一个,这一组色盘有统一的规格、颜色规律,以方便我们随时更换。(我们在刚开始做这一类图片的时候,就应该养成一个好的习惯,要为图片的扩展做好准备,所以我们设定的色盘一定要有规律,不能是杂乱无章的。)

先看一组我已经做好的色盘吧......

这是一组4位色的色盘,每一个总共16种颜色,其中第一个格里的颜色是要留做透明色用,所以,可用的颜色只有15种。由于每一款电子产品的设计模式都不同,有一些,在同一个界面内,是不能同时使用多个色盘的,当我们在设计这一类需求的色盘时,记得要留出字体颜色,所以我很习惯性的把每个色盘上都留有黑、白、灰的过渡色。色盘的制做模式很简单,只是有时需求不同,模式和规律比较难定,这就要在最开始做的时候,想的周全一些,因为后期色盘模式的修改将会是一件非常痛苦的事情。步骤如下:

一、随意新建一个PS空白文件;

二、图像菜单---->模式---->索引颜色,打开如下面板

三、在调板里选择“自定”,打开颜色表

四、颜色的分配。第一个格我们留做透明色用,点一下,选择一种我们不用的颜色,确定。鼠标拖拽,同时选中2至8格,弹出拾色器窗口,选择黑色,确定;又弹出拾色器窗口,选择白色,确定。(这里有点奇怪,如果不注意看文字的时候,会以后软件出错了,怎么确定了又会弹出拾色器,我第一次用时就是这样的感觉,嘿嘿!)OK,看一下,这7个格内的颜色已经被平均分配了,当然,如果感觉灰阶的颜色不满意,也可以手工一个一个去调。后面的蓝色过渡也使用同样的方法选择。

这里有一点要说明的是:当我们在做颜色的选择时,要尽量用拾色器横坐标顶端和纵坐标右端的颜色值,看下图我用黑色框框标出来的,经过的我的实验得出,只有这有这样二点选出的颜色才会均匀的分配在色盘上,如果要从1过渡到3,中间一定要有一个2来定位颜色,不然颜色就会乱,这一点大家可以自己做实践,当时如果有更好的方式,我也希望请教一下大家。

五、差不多了,存储一下我们设计的颜色表吧,下次用的时候,载入就可以了。

OK,色盘搞定了,把我们刚才存的颜色表加到色板,以方便我们使用,然后可以开始设计界面元素,设计方面的好像没有什么过多要讲的,这个主要看各人的创意,设计这方面的界面,学习一点像素画的基础会好一些。看一个我的例子吧,音量的选中条:

缩小看,还不错吧?

最开始做的时候,可以不用索引,直接在PS里分图层画,尽量吸色盘上的颜色画,存原稿,然后复制一份出来,图像菜单--->模式--->索引颜色,选好做的颜色表,做完这一切,记得检查一遍,看一下有没有异常,比如露点的现像,方法是:图像菜单--->模式--->颜色表,按着Alt键同时点透明色,可以把透明色透掉,放大检查一遍,有的话,在色盘上找相近的颜色补上。

一切做完了,记得存储噢,根据需求存就可以了,最常用的是bmp格式。

我在最开始接触的时候,在网上找了很多资料,都一直找不到想要的,现在我把自己知道的知识分享给大家,希望对大家有用处。

(责任编辑:IT教学网)

更多