首页
Home
设计鉴赏
Design Gallery
新闻中心
News Center
学习教程
Tutorials
网友作品
Submittions
下载专区
Downloads
 
  新闻中心 - 人物 -
  ID: Password:   注册   找回密码 Search:
如果您有好的新闻线索请发上来和大家共享!
要是发现好看的设计,别忘了也发上来哦!
新闻及意见联系邮箱: AdminCenter[at]UIRSS.com
官方QQ群:1081792限量开放 (请先将个人作品发送到AdminCenter[at]UIRSS.com提出申请)
热门新闻  News Center
[人物] 腾讯UI设计中心专访
[资讯] 中国移动涉嫌剽窃UI设计
[人物] 腾讯互动娱乐UI设计团队专访
[人物] 腾讯UI设计中心负责人 唐沐
[资讯] 微软亚洲设计中心招聘视觉设计师和...
[资讯] 强强联手,中国第一本UI类专业电...
[人物] 百度UI设计经理 张海龙
[资讯] UIRSS.com于今天正式发布...
[资讯] UIRSS 全球招募志愿者
[人物] 诺基亚中国图形设计主管 刘超

相关新闻
  [人物] DDF-UPA中国新一届理事会...
  [人物] David Lanham 采访...
  [人物] 世界之窗皮肤大赛iconboy...
  [人物] 腾讯互动娱乐UI设计团队专访
  [人物] GUI设计师 lytous
  [人物] 腾讯UI设计中心专访
  [人物] 腾讯UI设计中心负责人 唐沐
  [人物] 百度UI设计经理 张海龙
  [人物] 诺基亚中国图形设计主管 刘超

世界之窗皮肤大赛iconboy专访
From: UIRSS.com     Author: 世界之窗     Posted by: hiboo     Editor: vic     Time: 2007-10-13 19:50:34    


世界之窗论坛ID:iconboy

 

获奖作品:iconboy

你是通过那个途径了解本次大赛的信息的?
我平时会经常上UIRSS.com上了解一些和UI相关的信息,这次比赛的信息也是通过UIRSS了解的。

您是如何了解到世界之窗软件的?
很早了,我一直就喜欢用多窗口式的浏览器。

您是学什么专业的?
艺术设计。 您是从什么时候开始尝试ui设计的? 早期自己凭兴趣制作的一些游戏时就为自己的游戏做界面了,然后是网页设计。后面通过模仿金山影霸的界面及ChinaUI认识Sky、Rokey、BlueSky时才算是确定GUI设计这条路的。

您现在从事那方面的工作?
目前从事就是GUI方面的设计。

您经常去那些设计类网站?
DeviantArt、UIRSS、Lemoons都是我比较喜欢去的设计网站。

对您影响最大的设计师有哪些?
最早也是受Sky作品的影响,Rokey也是一直影响着我的非常优秀的设计师。

本次大赛您最喜欢哪几件作品?为什么?
我个人比喜欢Aycox的LEEFI、iconshop的FreeWorld,及qqf的江南。LEEFI用起来很舒服,Freeworld的清新和简洁,而江南的细节非常精彩。


leefi论坛链接


FreeWorld论坛链接


江南论坛链接

本次获奖您有什么感想?
欣慰吧,因为我本身就是从事专业的GUI设计的。不过最大的感想还是和用户间的沟通,因为这次比赛的设计过程中,交流最多的还是世界之窗的用户,没有他们的意见和帮助,这套皮肤不可能这么完善。这和平时工作中的商业设计是不同的。

请谈谈这次获奖作品的构思过程?
我个人总是容易从配色中获得灵感,从开始我的设计就锁定在蓝绿配色上。我承认起初Iconboy这个名字纯粹在偷懒,后来我为了配合这个名字我把一些流行玻璃质感去掉,亚光、深灰蓝的底色配以嫩绿,己及不发散的小图标,最终完成这套设计。

整个制作过程您花了多长时间?
前后大约一周时间吧。

制作过程中您使用了那些软件和工具?
主要在Photoshop完成的大部份设计工作。

是否愿意交流一下制作心得?

好的,不过因为篇幅原因,我就演示一下里面的小图标的制作过程吧。

  不少朋友在接触图标设计时都是直接学习各种矢量软件,主要是不少优秀的图标设计展示都是用超过48x48的大图标来展示的。特别是现在的Vista,都是用256x256的图标来展示。但实际我们在图标运用中,大尺寸的图标运用非常少,我们每天接触的还是48x48以下尺寸的图标。而对于小图标,非常多的朋友都是直接将其缩小,然后看到缩小消失在有限的像素中的细节抓狂。那么小图标真的有那么强画么?不见得,以下的教程就是我个人在这套皮肤中的小图标设计的过程中的一点经验和心得!

  首先就是要确定一下小图标的尺寸,说到这里,有些朋友就有疑问了:小图标不就是16x16么,还需要确定一下尺寸么。是的,小图标的尺寸默认的确实是16x16,那么我们就先看看下面的效果。


16x16的图标和11x11的文字摹拟效果图


放大后尺寸的差别

  通过上面的图片,我们先整理一些数据:图标尺寸16x16,汉字使用的是宋体12px的点阵字体,但放大后观察得出实际尺寸却是11x11。显然这16x16放在11x11的汉字前比例显得很不舒服。所以我决定使用13x13做为我们图标的尺寸。这时可能也有朋友认为:16x16的尺寸画东西己经够小了,还要变成13x13。先别急,我们慢慢看。


13x13的图标和11x11放在一起看起来很和谐

  或许是现在各样风格的图标作品的影响,图标的造型是越来越复杂。但是很多人忘了图标最基本的意义,那就是代表一定含义的易识别的图形。所以说,无论是什么样的图标,都要满足代表一定含义、易识别、图形这三个部份。

  那么制作工具呢?Illustrator?CorelDraw?不,我们都不用。即然最后是要在13x13上显示,那么我们就用位图制作软件Photoshop来画吧。

  说了这么多,下面我们就开始我们的范例吧,就拿这个图标来演示吧:)

  打开Photoshop,新建一个16x16的画布,虽然我们要画的图标是13x13,但是我们实始需要制作成16x16的图标格式,所以我们在设计过程中,保持上侧和左侧有两个像素的边距,右侧和下侧有一个像素的边距,那么中间的绘画区域就是16-2-1=13

  

我们使用圆形选择框画一个13x13的圆形并填充。

  

然后我们用选择框画一个11x11的圆形框并反向

选择菜单:图像>调整>亮度/对比度,将亮度调成-60

我们再选择一个9x9的圆形,将亮度调成-40

同样的方法选择一个7x7的圆形,将亮形调成60

到了这一步,我们按Q键进入快速蒙板模式,从上到下用渐变工具拉一个从黑到白的渐变,然后按Q键退出快速蒙板模式

选择菜单:图像>调整>色相/饱和度,将色相调到-123左右

到这里,我们新建一个图层,画一个11x11的圆形,并填充一个c9c9c9的灰色,将选择框下移一个像素,按Del把下面部份删掉.

打开图层模式,选择"叠加"

我们可以看到一条很细的高光出现了。

下面就是用渐变来画指针了

最后一步我们给底层用图层样式做层描边

然后这个图标就算是完成了

下面图片中有其它几个图标的制作过程,但是细节就靠大家在实践中去体会了。


使用世界之窗的朋友可以在比赛获奖页面,直接使用该款皮肤。

 

版权声明   
Print   Back  
专家点评  VIP Comments
暂时没有专家点评!
网友评论  User Comments
slila 牛B!~~ 2007-10-15 13:21:42  
渔网 照着做了一个^_^ 那个高光的做法很有意思 2007-10-29 11:18:09  
渔网 照着做了一个^_^ 那个高光的做法很有意思 2007-10-29 11:18:24  
blue123 不错 学习了~~~ 2008-6-13 16:03:16  
发表评论  Add Comments
ID: *
Password: # 游客不需要填写. If you are a guest,keep it blank.
Website:
Security Code:
Content:
     
     
     
     
     
     

声明:网友评论仅代表个人观点,与本站立场无关,如果在评论中发现有任何反动,色情,暴力,诽谤,广告等信息,请即时与我们联系,我们将立即予以删除.
Pronouncement:All comments express the views of the author but not UIRSS.com.If you find any comments which are deemed as abusive,obscene,vulgar,hateful, slanderous,threatening,or which are otherwise in volation of any laws,please contact us.We will remove them as soon as we confirm them.
合作伙伴 visionunion MOP视觉 极限风筝论坛 图标海 CGFINAL 富图摄影 视觉联盟 RGBCN 设计之家