如何将原始图片变成图标

博客|社区|消息

成员向收集站点投稿。

首页关注泗县综合新闻保健时尚频道网络学院泗州论坛大寺县电影院

当前位置:大西县>网络学院>图像处理>:教你创建Windows XP图标。

出版日期

2004-03-30

主页关闭

教你创建视窗XP图标。

来源:编辑:阅读:4

教你创建视窗XP图标。

简介

微软？Windows？XP引入了新的图标设计风格。在下面的指南中，我们将讨论设计和创建Windows XP风格图标的具体步骤。

Windows XP图标有趣、色彩丰富且充满活力——这是因为它们是边缘光滑的32位图标。在矢量程序中画出每个图标后，用Adobe Photoshop进行处理，可以使图像更加完美。

这本指南是专门为设计师写的。在创建图像时，建议您与高水平的平面设计师合作，尤其是在矢量和3D编程方面具有丰富经验的平面设计师。

图1:图标示例

图标设计概述

本节的目的是让您熟悉Windows XP的新样式，并为创建图标做准备。

图标风格特征

色彩丰富，与Windows XP的外观相得益彰。

不同的角度和透视特征为图像增添了动态活力。

元素的边角非常柔软，略显光滑。

光源位于图标的左上角，有环境光照亮图标的其他部分。

渐变效果让图标变得立体，进而让图标看起来更饱满。

投影使图标更有对比度和立体感。

加个轮廓可以让图像更清晰。

日常物品(如计算机和设备)具有更现代的个人外观。

图标大小

Windows图标有四种尺寸——48×48、32 × 32、24 × 24和16 × 16像素。

推荐以下三种尺寸:

48 × 48像素

32 × 32像素

16 × 16像素

图2:常规图标大小

开始菜单右侧的图标以24 × 24像素的尺寸显示。该尺寸不需要由用户提供。

图3:开始菜单中的24x24像素大小

对于正在创建的工具栏图标，Windows标准尺寸为24 × 24和16 × 16像素。

图4:标准工具栏图标大小

图标颜色深度支持

Windows XP支持32位图标。32位图标是24位图像加上8位alpha通道。使图标的边缘非常平滑，并与背景融为一体。

每个Windows XP图标应包含以下三种颜色深度，以支持不同的显示设置:

24位图像加8位alpha通道(32位)

8位图像(256色)，加上1位透明色

4位图像(16色)，加上1位透明色。

图5: 32位、8位和4位图片收藏图标

调色板

下列颜色是图标中使用的主要颜色:

图6: Windows XP图标调色板

对象的角度和分组

以下是Windows XP样式图标使用的透视网格:

图7: Windows XP图标透视图

使用16 × 16的复杂图像，并不是所有的物体都能得到很好的效果。以下对象通常显示在直观的图像中:

文档图标

符号图标(如警告或信息图标)

单一对象图标(如放大镜)

图8:可视图标的例子。Jpg文档、搜索和收藏夹图标)

除非创建重叠的辅助对象可以更清楚地表达图标的含义，否则为了可读性和完整性，应该使用直观的图像。您还应该考虑如何分组查看图标，以确定如何对对象进行分组。

图9:重叠示例(添加或删除程序、打印图片和最近的文档)

项目

使用投影后，Windows XP的图标会更清晰、更立体。您可以在Photoshop中实现这种效果，本指南稍后将对此进行介绍。

要为图像添加投影，请在Photoshop中双击图像的图层，然后选择“投影”。然后将角度改为135，距离改为2，大小改为2。在这一点上，投影是75%不透明的黑色。

图10:向图标添加投影之前和之后。

概述

在绘制XP风格的图标时，给图像添加一个轮廓可以使其更加清晰，并保证图像在不同的背景颜色下都有很好的效果。

步骤1:概念

设计新图标时，建议先用纸和笔把基本思路画出来。

以下是Windows XP图片收藏图标初稿的示例:

图11:“图片收藏”图标初稿

设计图标时，请考虑以下因素:

利用已有的概念，确保用户的想法得到真实的表达。

考虑图标如何出现在用户界面环境中，以及它们如何作为图标集的一部分使用。

考虑图形的文化背景。避免在图标中使用字母、单词、手或脸。当人或用户必须用图标来表示的时候，请尽可能的让图标大众化。

如果图标中的图像由多个对象组成，那么就要考虑如何让图像变小。建议在图标中使用不超过三个对象。对于16 × 16的尺寸，我们也可以考虑删除一些物体或者简化图像，使其更容易识别。

注意:在图标中使用Windows徽标时，请遵守以下规则:

为了遵守商标和Windows品牌规则，除Windows Update图标外，请勿在图标中使用Windows徽标。

Windows logo只能在微软用？Windows？在操作系统提供的图标中使用。

Microsoft品牌组应审查图标中Windows徽标的使用。

常用图标

图12:Windows XP的常用图标

通用工具栏图标

图13:Windows XP的通用工具栏图标

第二步:画一幅图像

要绘制Microsoft Windows XP的样式图标，建议您使用矢量工具，如Macromedia FreeHand或Adobe Illustrator。使用图标设计概述中指定的调色板和样式功能。

使用手绘或Illustrator绘制图像。

分别创建三种尺寸的图像。因为投影会在后面加到图像上，所以创建的三个维度应该是46 × 46，30 × 30，14 × 14像素。

复制矢量图，粘贴到Photoshop中。

图14:粘贴对话框

注意:推荐Photoshop作为图像创建工具，因为Gif电影齿轮用来创建。ico文件可以直接导入Photoshop文件。Photoshop中“RGB”模式创建的图像都有alpha通道。如果图像或层是透明的，图标使用通道是有意义的。

步骤3:创建24位映像

将矢量文件粘贴到Photoshop后，下一步就是完成24位图像。

将三种尺寸的图像粘贴到Photoshop后，请检查图像的可读性和分辨率，尤其是尺寸为16 × 16的图像。可能需要像素移位。如果16 × 16的图像无法清晰显示，那么这个尺寸的图像就要用徒手简化。

要给图像添加投影，请双击图像的图层，然后选择“投影”。然后将角度改为135，距离改为2，大小改为2。此时，投影是75%不透明的黑色。

图15:设置投影

要将投影与24位图像合并，请创建一个新的空层。在“层”菜单中，选择“合并可见”将三个层合并在一起。

图16:合并层保留投影。

新建三个Photoshop文件，大小分别为48 × 48、32 × 32、16 × 16像素。复制并粘贴相应的图像。如果图像投影被截断，您应该在FreeHand中缩小图像大小，然后再次执行这些步骤。

将每个文件保存为. psd文件。不要将图像层与背景层合并。最好在文件名中包含大小和颜色深度。

步骤4:创建8位和4位图像

创建一个8位映像

现在你已经制作了一个24位图像(用于合成32位图标)，下一步是创建一个8位图像。8位图标将以低于32位的任何颜色模式显示。

8位图标没有8位alpha通道。所以8位图标的边缘要清理干净，否则边缘会有锯齿。

在Photoshop中，复制24位图像图层，并将图层重命名为8位图像。

新建一个空层，用深色填充(比如蓝色)。

将8位图像图层与新图层合并。

用纯色清理边缘，去掉抗锯齿像素。总是用一些方法处理边缘来淡化边缘的锯齿效果。

检查图像在浅色背景(如白色)下的外观。

图17:用8位色深清除图像。

新建三个Photoshop文件，大小分别为48 × 48、32 × 32、16 × 16像素。复制并粘贴相应的图像。

接下来，您需要将图像的索引颜色更改为256色。8位图标可以有一个自定义调色板。

在48 × 48的图像中，背景填充了一种独特的颜色——一种从未在图像中使用过的颜色。通常使用洋红色(R255 G0 B255)。

转到图像-& gt；模式->；索引颜色，然后选择拼合图层。

在调色板下拉菜单中，选择自定义。在自定义对话框中，单击确定。在“索引颜色”对话框中，单击“确定”。

将文件保存为. psd文件。

用相同的背景色和自定义调色板保存另外两种大小的文件。

将每个文件保存为. psd文件。

创建一个4位映像

为了使图标在较低的显示环境下显示效果更好，请使用16颜色的图标。

将8位图像的索引颜色更改为Windows 16调色板。

仅使用16调色板中的颜色清洁图像。

在图像的底部和右边使用黑色轮廓。

在图像的左边缘和上边缘使用深灰色或其他深色。

用相同的背景色保存三个尺寸。确保图像中没有使用背景色，因为背景色将被用作透明色。

图18:4位图标示例

步骤5:创建一个。ico文件

一旦所有的图像都准备好了，你就可以把它们编译成。ico文件。要创建32位图标，您需要使用Gif电影齿轮(GMG)工具。这个工具可以在Gamani(英语)网站上找到。

在下面的步骤中，我们将讨论创建典型的。三种尺寸和三种颜色深度的ico文件。

总共应该有9个文件* * *-每个颜色深度有三种尺寸:

48 × 48，24位

32 × 32，24位

16 × 16，24位

48 × 48，8位

32 × 32，8位

16 × 16，8位

48 × 48，4位

32 × 32，4位

16 × 16，4位数字

打开Gif电影齿轮(GMG)并将每个图像文件拖入窗口(或使用文件->；插入框架).每个图像将成为一帧。

当您将24位图像(或带图层的. psd文件)拖到GMG时，会出现一个对话框:

图19:在Gif电影文件中设置24位图像

请确认设置如下:

图层是多帧动画。

未混合:每层一帧。

保持背景透明

每个24位图像的背景层将显示为一帧。选择帧并按Delete键删除这些空白帧。

现在，总共应该有9帧。图标要按照颜色分辨率升序排序:前三位是4位(16色)，后三位是8位(256色)，后三位是24位颜色加8位alpha通道(*** 32位)。

图20:GIF电影齿轮中的帧序列

注意:要检查图像的属性，请将鼠标移动到图像上。工具提示框将显示每个图像的分辨率信息。默认设置包括尺寸、透明度和位数。您可以使用Edit-& gt；首选项-& gt；框架提示添加或删除显示的项目。

对于8位和4位图像，背景应该是透明的。GMG用暗黄绿色表示“透明”的颜色。您可以使用视图-& gt；“透明为”菜单项设置自己的颜色(或仍使用默认背景色)。所选颜色仅用于查看图像效果，不会影响图像本身。

若要使8位和4位图像透明:

选择一个框架，然后单击“拾取透明度颜色”工具栏图标(吸管)。

图21:使用透明工具

将打开一个对话框，显示您的图标。用吸管工具单击图标的背景色。此颜色将更改为暗黄绿色(或在GMG选择为透明背景色的颜色)。

重复所有4位和8位帧。

要保存图标，请选择文件-& gt；图标另存为...。

创建工具栏

Windows工具栏图标使用与其他图标相同的样式，只是它们不使用投影。因为工具栏图标非常小，所以建议您使用简单的图像。如果能通过直观的方式显示图像，清晰地表达图标的含义，就不需要使用其他复杂的方式。

Windows工具栏显示两种图标尺寸:24 × 24和16 × 16像素。图标有两种状态—默认和活动(鼠标悬停在图标上)。对于活动状态，我们需要稍微增加图像的饱和度。

创建工具栏图标的过程与创建非工具栏图标非常相似，只是图像在。bmp格式-基本上是一排按顺序排列的图标。

在徒手画出各种大小的图标后，请复制粘贴到Photoshop中。把24 × 24的图像放在一层，16 × 16的图像放在另一层。

在每一层上，为每个尺寸画一排盒子。一排16 × 16的盒子，一排24 × 24的盒子。

图22:工具栏图标框的例子

将每张图片按所需顺序放入框中。确保图像之间没有重叠。

图23:在工具栏框架中放置图标

保存Photoshop文件。

接下来，您将在Photoshop中创建一个活动图像。

复制24 × 24和16 × 16图层。重命名图层并将其标记为活动版本。

对于每个活动版本，选择图层并转到image->；调整-& gt；级别，然后将中间的箭头移动到0.75。单击确定。

图24:改变色阶以创建“活动”图像

创建活动图像后，每个草图都应该有一个层:默认24 × 24，活动24 × 24，默认16 × 16，活动16。

接下来，为每个草图创建一个单独的文件。

一种方法是使用裁剪工具将文件剪切到适合草图的大小，然后保存文件。草图必须从第一个框的开始测量到最后一个框的结束。

将每个草图保存为24位。psd文件。

图25:Photoshop中24位工具栏的草图

如果您想要将草图存储为32位图像，请将它拖到GMG中。删除所有空白框架。转到文件-& gt；导出为-& gt；电影胶片.在“胶片导出”对话框中，确认选择了“BMP/DIB和带Alpha的24位”。

创造AVI

Microsoft Windows XP使用8位AVI。创建的过程。avi文件与创建图标是一样的——在Photoshop中准备一个图像，然后将其拖到GMG中。请按照下面的说明创建一个8位图标。

要使用GMG保存AVI，请转到文件-& gt；导出为-& gt；AVI档案？。

创建时。avi文件，考虑以下因素:

使用洋红色(R255 G0 B255)作为背景透明色。

在Photoshop中，重要的是不要有杂散像素。请将填充容量设置为0，并确保未选择抗锯齿。

炉顶封闭

上一篇:FR渲染的金酒杯3DSMAX下一篇:MAYA玛雅中下颌的建模方法