天下网吧 >> 网吧天地 >> 网吧技术 >> 网吧软件 >> 正文

注重细节!PS打造Web2.0风格按钮

2010-4-15PS真功夫佚名
div id="ArticleCnt">

  看到效果图,蛮以为一个小图标应该很容易就能搞定,没想到需要这么多步骤。细节,细节,还是细节!切记!OK,开始我们这次的教程。先上效果图:

注重细节!Photoshop打造Web2.0风格按钮
图1

  老规矩,看到效果图:分析!分析!再分析!我们将怎么完成这个图标的制作呢?经观察得:

  一:背景制作(灰白色,加一条高光线)。这步应该比较简单。
  二:图标的雏形(关键地方,颜色的搭配漂亮,因为给你第一感觉就是色彩。高光,浮雕,影子等细节的制作,看上去很立体就是这些因素造成的啦!)
  三:邮件图标的添加(这个跟第二步类似)
  四:文字的添加(关键点,文字排版,图层样式的设置。)

  这都是我自己主观的分析。嘿嘿,仅供参考。我觉得最关键的就是:色彩的搭配了,图标影调的分布!

  第一步:

  新建一个文档200×200px。背景色:白。分辨率:72dpi。现在给按钮做辅助线,Ctrl+R显示辅助线,在尺寸区域里面按住鼠标左键,把拽辅助线拉下来。如下图:

注重细节!Photoshop打造Web2.0风格按钮
图2

  按快捷键:Ctrl+Alt+C,打开调整画布大小的窗口。设置如下(画布扩大区域颜色的选则,窗口最下面的那个选项):

注重细节!Photoshop打造Web2.0风格按钮
图3

  下面是效果图:

注重细节!Photoshop打造Web2.0风格按钮
图4

本文来源:PS真功夫 作者:佚名

声明
声明:本站所发表的文章、评论及图片仅代表作者本人观点,与本站立场无关。文章是出于传递更多信息之目的。若有来源标注错误或侵犯了您的合法权益,请作者持权属证明与本网联系,我们将及时更正、删除,谢谢。 Email:support@txwb.com,系统开号,技术支持,服务联系微信:_WX_1_本站所有有注明来源为天下网吧或天下网吧论坛的原创作品,各位转载时请注明来源链接!
天下网吧·网吧天下
  • 本周热门
  • 本月热门
  • 阅读排行