导航:业界 | 认证 | 工具 | 图形 | 技术 | 系统 | 网络 | 办公 | 网页 | 文摘 | 动画
您当前的位置:diva8.com -> I T -> 图形 -> 其它 -> I T内容
栏目导航
· CG · Photoshop
· 其它 · CorelDraw
· Illustrator · PhotoImpact
热门I T
· [组图] 音频后期处理Adobe ...
· [组图] Photoshop--照片处理...
· [组图] 廉颇老矣?IE7.0 Bet...
· [图文] DuDu下载加速器推出...
· [组图] 清晰还原!Photoshop...
· [组图] 用photoshop给图片祛...
· [组图] DuDu 下载加速器试用...
· [组图] 新春特别版:PPLIVE...
· [图文] 让查找更方便些 腾讯...
· [组图] 廉颇老矣?IE7.0 Bet...
相关I T
· [组图] 方寸之间见真功—趣...
方寸之间见真功—趣话电脑图标的前世今生(2)
作者:admin  来源:齐昌网络  发布时间:2005-3-2 12:42:09  发布人:qichang

减小字体 增大字体



13、Windows 95(1995)

  在Microsoft公司的重要产品Windows 95系统中,大多数图标被重新绘制,在图标某些地方也应用了Copland风格。(见图13)

  这套图标仍然采用了32象素×32象素的尺寸,16色。但如果安装了随后发布的Microsoft Plus!插件,人们可以使用256色的图标。

  14、BeOS(1997年)

  BeOS操作系统中的图标是独特而且一致的图形的很好例子。BeOS的图标也是等积的,但栅栏是不对称的,左边有30度的倾斜,右边有45度的倾斜。(见图14)

 src=

  这套有可以迅速辨认出来的颜色配置(应用了很多有旋转渐变效果的褐色、红色、黄色和灰色)的独特图标的视觉效果很好,功能也很全面。

  15、IRIX Interactive Desktop(1998年)

  来自SGI的IRIX Interactive Desktop系统的图形接口比较少人知道,但它的图标有不少独特的HCI特性。其中一个是图标的矢量性,所以这套图标可以放大至任何尺寸而不损失图形质量,但这套图标不是很吸引人(虽然它是平滑的,可以在系统的新版本中重用)。(见图15)

 src=

  整套图标在外观上很一致,使用了Copland风格,在表面使用了阴影效果。有特色的“魔法地毯”功能可以让人很容易地从程序队列里面找出正在执行的程序。

  16、Rhapsody (1999年)

  Rhapsody系统是一个“短命”的操作系统,它只是为Mac OS系统和NeXTSTEP系统的接合而存在的,最终它融合在Mac OS X系统里。(见图16)

 src=

  Rhapsody系统的图标有一些传统的Copland风格残留在里面。(“传统”是相对人们对Copland的理念做出的引申和发展而言的)。在一定意义上,这套图标也终结了14年前就已经开始使用的Macintosh系统的图标风格。图标采用了48象素×48象素的尺寸,采用了透明的遮照效果,支持了更多的颜色和更精细的阴影效果。

  不过,Rhapsody系统的定位就决定了图标在一致性上的冲突。图标有些是NeXTSTEP风格的,有些是Macintosh风格的。

  17、Amiga OS 3.5(1999年)

  在Amiga OS 3.5操作系统里面有一套全新的等积的图标。图标的不同之处在于采用了颤动的手法,但整套图标又表现了独特的视觉一致性。(见图17)

 src=

  大多数图标都是48象素×48象素的尺寸,但图标的外边经常围绕着一些大边框。

  18、Windows 2000(2000年)

  Windows系统的图标在每一个后续版本中都变得越来越精致,在Windows 2000里的图标发展到了一个全新的高度。(见图18)

 src=

  图标使用了32象素×32象素的尺寸,但如果需要,也可以使用48象素×48象素的尺寸。相对Windows图标的原始版本来讲,这套图标所改进的地方很多。图标使用了精细的阴影效果,支持24位颜色

19、Mac OS X (2001年)

  之前的Mac OS版本的图标都是32象素×32象素的尺寸,图标版本的升级只是在颜色数量上有很显著的改进(从第一版的2种颜色到第8.5和9版里的超过百万色)。然而,在2001年推出的Mac OS X系统中已经支持平滑的半透明图形接口,图标风格相应地也有了很大的改变。由于构成图标的所有要素都改变了,这次图标风格的改变是一种考验。(见图19)

 src=

  新的图标有128象素×128象素的巨大尺寸,16倍于之前版本的图标面积。图标采用了24位深度和8位的半透明遮照。

  新的图标已经具有写实的风格,而不再只是一些象征的符号。这里引用《苹果电脑人机接口向导》的内容,“系统的图标有一种像照片一样的全新风格。图标应用了跟照片类似的写实手法。图标有128象素×128象素的足够空间来展示细节。反锯齿使表现曲面和曲线成为可能。透明和半透明的通道可以表现复杂的阴影效果。所有的这些特性使图标像华丽的图片成为可能。”图标应用了很多的透明、半透明以及阴影效果。

  图标的尺寸会根据系统的需要自动放大缩小,但这个特性让用户很难辨认缩小后的图标。比如说,缩小成16象素×16象素后的图标跟原始尺寸的图标相比,看起来就很不一样。
但不少用户批评这套图标浓重的写实手法。图标的尺寸太大,色彩太绚丽,太“有趣”,导致给人想象的空间不大。一个硬盘的图标就像是一个硬盘,尽管大多数的用户都不知道系统中的硬盘是什么样子。

  20、Windows XP (2001年)

  参考Mac OS X中的图标,Microsoft公司在Windows XP系统中重新设计了图标。(见图20)
这套被称为“Luna”的图标的尺寸比以往版本要大,色彩也更绚丽。尽管图标的尺寸不像Mac OS系统中的那样大,但相对以前版本来说,尺寸上的变化也算是惊人的。这套图标是48象素×48象素的尺寸(差不多比Windows 2000里面的尺寸大两倍),有数百万种颜色,支持8位的透明色彩。
但这套图标中最特别的是视觉效果上的风格改变。让我们引用《Windows XP视觉效果向导》来说明这一问题:“Windows XP中的图标的定位是更有趣,更多色彩,更具活力。Windows XP中的图标有32位色的版本,在这个版本中提供了更平滑的没有锯齿的边缘。所有的图标都是在矢量图形设计工具中设计出来并在Photoshop里面处理过的。”

 src=

  “……Windows XP风格的图标的特性有:颜色很丰富,与Windows XP系统的外观很好地结合在一起;透视的使用使图标有动态的活力;边框和细节表现的很柔和,很融洽;来自左上角的光源使图标之间很容易区分;像计算机和设备这样的图标具有很好的用户界面。”

  图标用了两种视图:较大的图标用的是有一定角度的透视;其他的一些图标像“文档”、“警告或提示中的图标”、“放大镜”等则没有采用透视。

  跟Mac OS X系统中的图标相比,Windows XP中的图标没有陷入“更大,更好,更多问题”的怪圈。讽刺的是,Windows 1.0系统中带有蓝色阴影效果的图标很难辨认,尤其是当图标被缩小的时候,而现在这种情况出现在Mac OS系统里面,看来是历史一再重现。

  21、BeOS Zeta (2003)

  最后是关于BeOS家族中BeOS Zeta系统的图标,这套图标的设计在保留BeOS原有特性上做了一定的努力。(见图21)

 src=

  这套图标设计的很成功,尺寸是64象素×64象素,采用了阴影效果。4倍的面积使一些图标看起来很“庞大”。此外,一些图标之间很容易混淆,像控制面板的图标、传真机的图标、鼠标的图标、网络的图标、打印机的图标就很容易混淆

三、图标的属性

  罗列了超过20种系统的图标后,让我们从各个方面来分析一下它们。

  1、尺寸

  由于早期的系统在图形上的功能比较弱,大多数早期的图标采用的都是32象素×32象素的尺寸。但也有一些例外,像NeXTSTEP系统就采用了48象素×48象素的尺寸,Amiga OS系统采用了一些很随意的尺寸(随意的尺寸反而损害了整体效果,很少的系统采用会非正方形的尺寸,尽管Amiga的默认分辨率是640象素×256象素)。

  近年来,图标的设计者们慢慢摆脱了图标面积为1024象素的限制。Mac OS X采用了128象素×128象素的尺寸,Windows XP采用了64象素×64象素的尺寸。一些流行的操作系统也采用了大的尺寸(GNOME是一个很好的例子,它的图标采用了96象素×96象素的尺寸),在Longhorn系统中的图标甚至采用了更大的尺寸。但两方面的原因导致了所有这些系统都支持图标在比较小的尺寸下显示:保持兼容性,保持通用性。(见图22)

 src=

  很明显,显示器在支持象素密度上的增加而导致图标尺寸的增加。比如说,Xerox Star系统和Macintosh系统的显示器只支持72 PPI的象素密度,而最新的LCD显示器已经支持120-130 PPI的象素密度。具有300 PPI象素密度的显示器已经在试产,在这样的显示器上,Mac OS X的图标看起来就像普通显示器32象素×32象素的图标差不多大小。

  值得注意的是,尺寸为16象素×16象素或24象素×24象素的图标也在操作系统中被使用。

  2、类型

  差不多所有的设计者都要衡量是使用位图还是使用矢量。就跟我们在所有的图形设计的书中看到的一样,使用哪一种类型都有它支持和反对的理由。

  就如我们所看到的,大多数的图形界面用位图来表现图标,因为位图能更好地表现细节。只有在IRIX Interactive Desktop系统中才单纯地使用了矢量。

  然而,高象素密度的显示器在这些年很流行,一些低象素密度的显示器仍然在使用,在图标设计中使用矢量可能更灵活。使用矢量将不用为同一个图标创建不同尺寸的版本,使用渐变的效果(像增加倾斜和缩放效果)也更容易,增加其他的一些视觉效果(像阴影效果)也更容易。反锯齿和其他的一些技术保证了使用矢量实现的效果跟使用位图实现的效果差不多。

  在《Windows XP视觉效果向导》中提到,Windows XP的图标是用矢量工具设计之后用Photoshop加工的。同样,我们看看BeOS系统跟KDE系统中的图标,也可以看到单纯使用矢量来设计图标也不是不可能的。

  3、颜色的数量

  颜色的数量一直在稳定的发展,从最早的1位两种颜色(通常是黑色和白色),到4位16种颜色,到8位256种颜色。很难想象采用16色、24色、以及远远超过人类的眼睛所能分辩的百万种颜色的图标会是什么样。(见图23)

 src=

  4、透明效果

  在最新的图形界面中,透明效果扮演着很重要的角色。我们也可以看到使用透明效果对表现图标的功能很有帮助。

  5、图标的倾斜

  我们可以看到许多不同系统的图标使用了不同的倾斜:Copland,逆Copland,BeOS,Windows XP,Mac OS X等等。在其中一些图标的应用的很好。(见图24)

 src=

  图标的倾斜通常会导致图标的不一致。在Windows XP里采用了两种倾斜,但它们没有很好的融合在一起(看看你的C:\Windows目录就知道了)。在Mac OS X里面,图标的倾斜应用的比较好,但还算不上是完美。

  6、阴影效果

  随着伪3D视图的发展,在图标中也逐渐使用了阴影效果。但在近来系统的图标中,阴影效果是被设计的不连续和很精细。

  7、风格

  最后,我们探讨一下或许在一开始就应该被提及的属性-图标的风格。(见图25)

 src=

  早期的图标很抽象,可能只是为了表示一些概念。后来,图标渐渐支持更多的颜色,在“抽象和具体”之间不断平衡。

  目前,在图标中应用了现实主义的手法。Mac OS X里的图标的内容比之前版本的图标内容多了512倍。但512倍就足够表现内容了吗?看来我们应该经常问问自己“我们可以做到,但这样做是必须的吗?”这一类的问题。相比之下,那些小尺寸的图标看起来只像是一个小斑点

四、展望图标的未来

  不管我们乐意不乐意看到,图标已经存在。图标驱动的图形界面接口可能已经发展到了尽头,但我们除了使用图标之外还没有更好的解决办法。此外,图标在其他的许多场合中也很有用。看来图标会继续存在于我们的屏幕上。

  好像只有技术的进步导致了图标的发展。其实图标中仍然有许多其他的东西可以被发掘。

  能够根据对象的不同状态而改变的动态图标看来很有发展前途。动态图标已经有一些应用的例子:Mac OS X中的识别图标,iCal中的日期图标,Windows XP中的图像预览图标等等。但动态图标应该能够在更多的场合中使用(接口方面的权威Bruce Tognazzini在2003年文章中有所提及)。而且,高象素密度的显示器的发展已经是一种趋势,使用矢量的动态图标更让人期待。

  令一种可能是在图标中使用动画。在图标中使用动画可以达到一些功能上的目的,而不仅仅只是为了好看,比如用于响应鼠标的动作就可以使用动画。在一些操作系统中已经有像清空垃圾桶之类的简单动画,但动画在图标中应该还有许多不同的应用。

五、小结

  我们可能听说过“图画所表现的东西远非笔墨可以形容”这句话。图标就很好地验证了这一说法。

  在最近的图形界面接口中,图标的用法仍然是点击、双击、选择、拖动,这跟20年前的用法没有多大的差别。但图标的出现使我们能够更方便地使用电脑。

  从另一个角度来说,图标在视觉效果上也一直在发展着。如果不考虑图标的功能,我们很难能够找出这么多相似的图片。

  硬件的发展导致了图标的发展,但看看最新的像Windows XP或Mac OS X的图标,我们能够发现图标已经有点被“过度设计”。

  看来,将来的图标有可能回归到它们的原始目的上-增强用户的使用。

  希望这篇文件对要设计图标的人有用。(原著:Marcin Wichary)

参考文章

[1] “Icon definition” at Wikipedia, http://en.wikipedia.org/wiki/Icon
[2] “Interview with Susan Kare” at Making of Macintosh, http://library.stanford.edu/mac/primary/interviews/kare
[3] “Whither Copland” at The Icon Factory, http://www.iconfactory.com/howto_copland.asp
[4] “IRIX Interactive Desktop User Interface Guidelines,” Chapter 2: Icons, http://wwweic.eri.u-tokyo.ac.jp/computer/manual/lx/SGI_Developer/books/UI_Glines/sgi_html/ch02.html
[5] “Apple Human Interface Guidelines” at Apple, http://developer.apple.com/documentation/UserExperience/Conceptual/
OSXHIGuidelines/index.html

[6] “GNOME Human Interface Guidelines,” Chapter 9: Icons, http://developer.gnome.org/projects/gup/hig/1.0/icons.html
[7] “Windows XP Visual Guidelines,” http://www.microsoft.com/whdc/hwdev/windowsxp/downloads/default.mspx
[8] “Hard drive icons: now and then” at Acts of Volition, http://www.actsofvolition.com/archives/2001/june/harddriveicons
[9] “We could just start carrying around pictures of saints or something” at Semifat Sediment, http://sediment.semifat.net/entry/2003/07/08-175509.html
[10] “Apple Squandering the Advantage” at Ask Tog, http://www.asktog.com/columns/035SquanAdv.html



[] [返回上一页] [打 印] [收 藏]
∷相关I T评论∷    (评论内容只代表网友观点,与本站立场无关!) [更多评论...]
关于本站 - 网站帮助 - 广告合作 - 下载声明 - 友情连接 - 网站地图 - 在线人数:
diva8.com Copyright © 2001-2006 diva8.com All Rights Reserved .粤ICP备05014750号