加入收藏
 地图
 用户登陆
 帮助中心
电子商务 SEO动态 SEO技术 SEO软件 SEO推荐 网站留言 SEO用户 SEO专栏 电子商务   SEO培训
今天是:2019年6月26日 星期三   您现在位于: 首页 →  SEO技术 → 计算机技术(软件频道)

创建Windows XP图标教程(中)

2019/6/26  电子商务网  浏览选项:    本文已被浏览 1281 次
投影
使用投影后,Windows XP 图标将更清晰且更具立体感。可在Photoshop 中实现这种效果。
若要为图像添加投影,请在 Photoshop 中双击图像的图层,并选择 Drop Shadow。然后将 Angle 更改为 135,Distance 更改为 2,Size 更改为 2。此时投影为 75% 不透明黑色。

                                      
图 10:为图标添加投影前后
轮廓
绘制 XP 样式图标时,为图像添加轮廓可使之更清晰,并可保证图像在不同背景色上都具有较好效果。
步骤 1:概念
设计新图标时,建议先用纸笔将基本思路绘制出来。
以下是 Windows XP “图片收藏”图标的初稿示例:

                                      
图 11:“图片收藏”图标初稿
设计图标时,请考虑以下因素:
使用已有概念以确保真实表达了用户的想法。
考虑图标在用户界面环境中以何种形式出现,以及如何作为图标集的一部分使用。
考虑图形的文化背景。避免在图标中使用字母、单词、手或脸。必须用图标表示人或用户时,请尽可能使其大众化。
如果图标中的图像由多个对象组成,应考虑如何使图像尺寸更小。建议在图标中使用的对象不超过三个。对于 16 × 16 的尺寸大小,还可考虑删除某些对象或简化图像使之更容易辨认。
注意:在图标中使用 Windows 标志时,请遵守以下规定:
为遵守商标及 Windows 品牌规则,除 Windows 的 Update 图标外,不要在图标中使用 Windows 标志。 
Windows 标志只能在 Microsoft® Windows® 操作系统所提供的图标中使用。
Microsoft 品牌组应审查图标中 Windows 标志的使用情况。
公用图标

                                      
图 12:Windows XP 的公用图标
公用工具栏图标

                                      
图 13:Windows XP 的公用工具栏图标
步骤 2:绘制图像
若要绘制 Microsoft Windows XP 的样式图标,建议您使用矢量工具,如 Macromedia FreeHand 或 Adobe Illustrator。按图标设计概述中指定的操作使用调色板和样式特征。
使用 FreeHand 或 Illustrator 绘制图像。 
分别创建三个尺寸的图像。因为稍后将为图像添加投影,所以创建的三个尺寸应为 46 × 46、30 × 30 及 14 × 14 像素。
复制矢量图,并将其粘贴到 Photoshop 中。 

                                       
图 14:Paste(粘贴)对话框
注意:建议使用 Photoshop 作为图像创建工具,因为创建 .ico 文件所用的 Gif Movie Gear 可以直接导入 Photoshop 文件。在 Photoshop 中通过“RGB”模式创建的图像都具有 alpha通道。如果图像或图层具有透明度,对图标而言,使用通道将非常有意义。
步骤 3:创建 24 位图像
将矢量文件粘贴到 Photoshop 中后,下一步就是完成 24 位图像。
将三个尺寸的图像粘贴到 Photoshop 中后,请检查图像的可读性和分辨率,特别是 16 × 16 大小的图像。可能需要进行像素推移。如果不能清晰地显示 16 × 16 的图像,应在 FreeHand 中简化该尺寸的图像。
若要为图像添加投影,请双击图像的图层,并选择 Drop Shadow。然后将 Angle 更改为 135,Distance 更改为 2,Size 更改为 2。此时,投影为 75% 不透明黑色。

                                       
图 15:设置投影
若要合并投影和 24 位图像,请新建一个空层。在 Layers 菜单中,选择 Merge Visible 将三层合并在一起。

                                       
图 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)。 
转至 Image->Mode->Indexed Color,然后选择 Flatten Layers。
在 Palette 下拉菜单中,选择 Custom。在 Custom 对话框中,单击 OK。在 Indexed Color 对话框中单击 OK。 

将文件保存为 .psd 文件。
使用同样的背景色和自定义调色板保存另外两种尺寸的文件。
将每个文件保存为 .psd 文件。
创建 4 位图像
若要使图标在较低的显示环境中具有较好的显示效果,请使用 16 色图标。 
将 8 位图像的索引颜色改为 Windows 16 色调色板。
仅用 16 色调色板中的颜色清理图像。 
在图像的底部和右侧边缘处使用黑色轮廓。
在图像的左侧和顶部边缘处使用深灰或其它深颜色。
使用同样的背景色保存三种尺寸。确保图像中未使用背景色,因为背景色将作为透明色。

                                       
图 18:4 位图标示例
步骤 5:创建 .ico 文件
所有图像都准备好后,即可将它们编译成 .ico文件。若要创建 32 位图标,需使用 Gif Movie Gear (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 Movie Gear (GMG),将每个图像文件拖动到窗口中(或使用 File->Insert Frames)。 每个图像都将成为一个帧。
将 24 位图像(或带有图层的 .psd 文件)拖动到 GMG 中时,将会出现一个对话框:


                                       
图 19:在 Gif Movie Gear 中设置 24 位图像
请确认设置如下所示:
图层为多帧动画
未混合:每层为一个帧
保持背景透明
每个 24位图像的背景层都将显示为一个帧。选择帧,并按 Delete 键可删除这些空白帧。
现在,总共应有 9 个帧。图标应按颜色分辨率的递增顺序排序:前三个为 4 位(16 色),接下来的三个为 8 位(256 色),最后三个为 24 位颜色加上 8 位 alpha 通道(共 32 位)。 

                                       
图 20:Gif Movie Gear 中帧的顺序 
注意:若要检查图像的属性,请将鼠标移到图像上。将显示一个工具提示框,其中包含每个图像的分辨率信息。默认设置包括维度、透明度和位计数。可以通过 Edit->Preferences->Frame Tips 添加或删除所显示的项目。
对于 8 位和 4 位图像,背景应是透明的。GMG 使用暗黄绿色表示“透明”色。可以使用 View->Transparency As 菜单项设置自己的颜色(或仍然使用默认背景色)。所选颜色只用于查看图像效果,不会影响图像本身。 

若要使 8 位和 4 位图像透明: 
选择一个帧,并单击 Pick Transparency Color 工具栏图标(吸管)。 

                                       
图 21:使用透明工具
将打开一个对话框,其中显示您的图标。使用吸管工具单击图标的背景色。此颜色将更改为暗黄绿色(或在 GMG 中选作透明背景色的颜色)。 
重复所有 4 位和 8 位帧。
若要保存图标,请选择 File->Save Icon As...。
(作者:Windows 用户体验组)
 发布人:杰米  [ → 我要发表文章 ] 上篇文章:堵住网络Bug,垃圾短信走开!
下篇文章:创建Windows XP图标教程(上)
→ 主题所属分类:  计算机技术 → 软件频道 → 『关闭窗口』
内嵌浏览器插件,Google直达
铃声发送(1) 群策群力过新年-休..
Photoshop教你打造树叶上的..
有问必答(一) Q&A:视频有声无..
面向搜索引擎的网站优化方式
轻松用浏览器一键打开你常用网站
SP2后网络非完全断流分析
用好Win XP自带“克隆”功能
设置可靠的密码 为Windows ..
无安全措施的WLAN所面临的三大风..
搜索引擎优化最常见的五个神话
教你高效地避免收取重复邮件
什么是博客(BLOG)?
毕业甩卖,校园成了“跳蚤市场”
为添加和删除程序提速的三种方法
易物网日增商品上千件 开出B2B企..
详解Windows系统中如何释放C..
安全交易工具遭质疑 个人电子商务防..
搜索引擎:网络营销新利器
怎样避免被搜索引擎视为作弊
重装 3分钟重装操作系统
邕城大学生青睐“网上开店”
踏准电子商务中的每一步
彻底放弃快速启动功能
方法一:用图片制作圆角表格 美化网..
操作系统也会限制大容量硬盘
用数字证书保护你的文档
网络典型故障三例
UltraISO使用步步通
电脑无故重启的故障解析(上) 电脑..
整理磁盘需要注意的十大事项(上) ..
实现操作部分(一) 在Win200..
我的文件你别想动
数据输入 Office 2003的..
实现IE收藏夹和Firefox书签..
增加还原功能(上) 为Window..
北电警告:黑客即利用垃圾邮件攻击V..
菜鸟必看 Windows回收站使用..
关于3721的彻底清除
彻底删除程序 隐藏在Win 200..
合理设置Word的智能粘贴功能
为什么你不用担心网页级别的更新?(..
让NIS(诺顿)管好计算机端口
新网站排名不稳定的google幽灵..
提高网页下载速度的网页制作方法二则
 热门文章
 
 保存网页图片的八种方法 (53567)
 我的QQ 我的信息中心 (47725)
 2006年值得关注的十个web2.0网站 (39710)
 用OE邮件发短信不再是梦想! (26555)
 传统商务与电子商务的区别 (11351)
 让Windows序列号原形毕露 (10961)
 近一年来RSS和Blog已逐渐成为互联网发展的新潮流 (8753)
 如何让搜索引擎收录新网站 (8354)
 在Word中输入乘号和除号的几种方法 (7409)
 IE6用户如何升级到IE7.0浏览器版本 (7337)
 更换开机画面 Win XP开机画面随我定 (7173)
 Ping命令的使用技巧 常用网络命令使用技巧详解 (6476)
 智能ABC输入法中的使用技巧 (6230)
 如何保持网站排名课程记录 --  电子商务网原创 (6172)
 抓就要抓最清晰的图片 (6114)
 最近更新
 
 保存网页图片的八种方法 (8月1日)
 我的QQ 我的信息中心 (8月1日)
 2006年值得关注的十个web2.0网站 (8月1日)
 用OE邮件发短信不再是梦想! (8月1日)
 传统商务与电子商务的区别 (8月1日)
 让Windows序列号原形毕露 (8月1日)
 近一年来RSS和Blog已逐渐成为互联网发展的新潮流 (7月21日)
 如何让搜索引擎收录新网站 (8月14日)
 在Word中输入乘号和除号的几种方法 (8月1日)
 IE6用户如何升级到IE7.0浏览器版本 (12月28日)
 更换开机画面 Win XP开机画面随我定 (8月1日)
 Ping命令的使用技巧 常用网络命令使用技巧详解 (8月1日)
 智能ABC输入法中的使用技巧 (8月1日)
 如何保持网站排名课程记录 --  电子商务网原创 (8月15日)
 抓就要抓最清晰的图片 (8月1日)
 文章搜索
 
搜索选项:            
  → 评论内容 (点击查看)
(没有相关评论)
  → 发表我的评论
您的姓名:  您的E-mail:

评论内容:
发表评论:  
   电子商务网每日推荐文章: 提高yahoo排名的搜索引擎优化技术 2019/6/26
      在欧美国家,使用yahoo搜索引擎(英文yahoo搜索引擎,下同)人非常多,在某些国家甚至于达到或超过Google的使用量。yoo曾经有一个网站在yahoo搜索引擎里的排名非常好,从这个网站的情况得知,yahoo搜索引擎流量的客户转化率很高。因此,我们做好yahoo的搜索引擎优化工作,使得网站在yahoo的里良好的表现,将会使我们的网站具有更大的价值。
    yahoo搜索引擎在2006年7月做了一次比较大的更新。这次更新后,很多靠留言、发垃圾连接而取得良好表现的网站,排名掉下来了,可以看出yahoo增加了对垃圾连接的过滤。这次更新之后,yahoo的搜索结果,有向Google靠拢的趋势,可能各大搜索引擎算法中相同的部分越来越多了。
    yoo认为yahoo搜索引擎优化的要点主要有以下几点。
    一. 丰富的网站内容。
    任何一个网站,如果想在搜索引擎中有良好的表现,丰富的内容都是必须的。不只是对于yahoo搜索引擎,任何一个搜索引擎都青睐具有丰富内容的网站,都会给这样网站以好的表现。
    二. 大量的外部连接。
    yahoo搜索引擎非常注重外部连接的数量,只要有大量的外部连接,很容易在yahoo取得良好的表现。作为一个网站来说,总是希望每个页面在搜索引擎里都能有好的表现,因此我们可以为网站内部重要的网页都做一些外部连接,对这些页面在yahoo的排名有很大的好处,可以使得这些页面在yahoo有良好的排名。yoo自己就是这么做的,在对自己网站的200多个页面都做了一些外部连接,连接生效后,这些网页在yahoo搜索引擎的排名上升了很多。 ......查看详细内容
关于我们 ┋ 网站留言 ┋ 电子商务网成员网站 ┋ SEO培训基地 ┋ 地图 ┋ SEO培训 ┋ 管理 ┋ TOP
合作站点: 杰晶网络 | 建材互联 | Herbal | 淘宝优惠券 | 中国保健品网 | OilPainting | NHE | 杰米世界 | 南强新网
电子商务网 网络营销顾问:杰晶网络 版权所有
Copyright © 2006 ECSoon.com All Rights Reserved