图标的制作

无法贴图。。
原文地址：http://xuhel.cn/ui-design/icon-design-and-made.html

经常收到朋友关于 .ico 格式的图标相关求助，在下也是无赖了，在网上有没有找到一些简单明了的教程之类的东西。虽然 Rokey 那有个图标设计的教程，但是他更换了Bolg程序后丢失了。我就拼凑了一个出来。

设计图标的第一步就是用设计工具吧图标的设计出来。一般工具选用 Photoshop 和 Illustrator。用 Illustrator 只是为了方便的进行尺寸的大小缩放，其实  Photoshop 的钢笔工具也可以满住这个需求，不过钢笔用起来就有点麻烦了。

.ico 格式的图标文件包含了48×48、32×32、16×16这三种尺寸和 32位色、24位色、8位色的图标。这样看来 .ico 格式的图标其实就是把不同尺寸的图片和不同位色的图标打包为一个 .ico 文件的图标集合。不过这种格式图标只有Windows才支持。不过很可惜的是很多程序员都不知道到这个，都认为这个 .ico 格式的图标都只有一个尺寸大小。想起这个就想骂以前公司的那些傻程序员。

好了，就此打住，要不然就会偏题了。

那现在就开始设计一个简单的图标吧。

现在打开 PS 新建一个 128×128 的空白文档。为什么要128×128 这个尺寸来设计，一般来说是要看个人的习惯了，这是我的习惯。当然我这里用做例子的图标只是个示意了。

好了128×128 的做好了，接下来就是 48×48 的了。其实还可以做成 96×96、64×64 的。不过这样一来 ico 格式的文件就太大了。

我们现在只需把尺寸 128×128 的这个文档另存为 一个新的文档，并缩小为48×48 的。这下新的问题就出现了，大尺寸的图标缩小后出项了边缘和部分细节不清晰的问题。要解决这个问题的最好方法是重新绘制一个48×48的，其实还有个简单的方法，就是用像素画的方法来处理就行了。

右边的就是经过像素画处理了的细节部分和边缘就清晰了。

尺寸为 32×32 的也是用这个方式来处理。

左边是用128×128 直接另存并缩小成 32×32 的。右边是缩小后经过像素画处理了的。对于32×32 这个尺寸，要是你所绘制的图标细节过多的话那就要舍弃部分细节了。

对于16×16 这个尺寸的两种处理方法：一种是用上面的方法直接缩小然后像素化处理边缘；另一种是用像素的方法重新绘制一个。那这个实例的图标来说只需去掉它的透视就可以了来。

这个图里面左边的是直接缩小成16×16的，右边的是像素重绘的。清晰度一看就明了了。

当然其他尺寸的也可以重新绘制的。不过要看你的时间多不多了。

现在 所有的尺寸合在一起

最后把这些尺寸的图标去掉背景图层，并按尺寸单独的保存成PNG 透明的图片。也就是 128×128 的存为一个png图片文件。48×48的、32×32的、16×16的，共4个PNG图片。

为什么用PS 而不用 Illustrator，主要是 Illustrator 有的功能都可以在PS里面找到替代的方法。当然设计用的工具你可以用 Illustrator 来画好然后用 PS 来修饰一下细节和边缘。这个就依照个人的习惯来设计了。

好了现在图标是设计好了。怎样才可以生成一个ico 的文件呢？这里介绍个简单的方法，那就是直接用 PS 的 IconBuilder 滤镜就可以生成了。不过 IconBuilder 滤镜是收费的。我还是给个 iconbuilder 滤镜是界面图来说说好了。

安装 iconbuilder 滤镜后通过 PS 的滤镜菜单就可以打开 iconbuilder 滤镜了。选择要建立的图标格式的模板，比如 Windows 的图标格式，还是Mac 的图标格式。然后移动不同尺寸范围的选区到对应的位置，调整好了后点击保存按钮，选择文件的保存位置就搞定了。

好了，PS 的演出到此为止了。现在改用别的工具来转换成 ico 格式的图标了。

Windows 方面：

创建 Windows 的 .ico 格式图标的软件很多，不过我推荐用 Axialis 公司的 IconWorkshop。

Axialis IconWorkshop是一款专业制作图标的编辑软件，通过它可以非常轻松地制作出图标。它还内置了不少滤镜模糊、平滑、锐化、细节、等高线、浮雕等和图像调整色调、饱和度、亮度、对比度等的工具，以及还可以缩放尺寸、任意角度转动、翻转等；增强的与 Adobe和Jasc色彩文件相兼容的色板和调色板管理系统；还有自定义Windows图标的功能等等。

IconWorkshop 的使用教程自己个噢噢过了一下就有很多了，我这就暂时不写了。等下次吧。

基于我的这个教程，建议用 IconWorkshop 新建一个 空白的 Windows 图标，然后建立对应的规格，用 IconWorkshop 打开 用PS 导出的PNG 图片。

将对于的尺寸的图复制并粘贴到 空白的Windows 图标里面。

然后现在是 32位色的图标，为了兼容其他版本的Windows 还要创建每个尺寸对应的 256色的图标就可以了

然后保存文件，ok 现在一个Windows 的 ico 格式图标就此创建完毕了。

最后给个 IconWorkshop 的从图像创建图标的设置参考好了。

Windows 的就到此为止了。

Mac OS X 方面：

创建 Mac 下的图标有个很方便的软件那就是 Icon Composer 了。

Icon Composer 最方便的地方就是直接吧 尺寸相同的图片拖到对应的图片框里面，然后保存即可生成一个符合 Mac 系统规范的 icns 格式的图标了。当然 icns 格式的图标是可以通过 Axialis 公司的 IconWorkshop 转换成Windows 所支持的 ico 格式的图标的。

欢迎补充，呵呵。