当前位置: 首页 > 图文教程 > 平面设计 > Photoshop > Photoshop绘制个性化的网站导航

Photoshop
Photoshop 人物照片漂亮的淡青色
Photoshop 一张简洁的蓝色光影壁纸
photoshop 抠图(通道)实例
photoshop合成及调出时尚淡青色的沙滩外景
Photoshop 罪恶之城电影海报
Photoshop 动感街舞帅哥添加矢量特效
Photoshop 打造梦幻的绿色艺术婚片
Photoshop 时尚美女照片上色
Photoshop 漂亮的洗发水瓶
photoshop 利用笔刷和滤镜制作烟雾字效果
Photoshop手绘 高雅葡萄酒瓶子
Photoshop 精彩的水文字特效
Photoshop 令人难以置信的火热文字
Photoshop 时尚的界面设计按钮
Photoshop 快速制作好看3D立体文字
Photoshop 巧妙的抠出透明的玻璃盘
photoshop 多图合成柔美的古典美女效果
photoshop 鼠绘写意风格水墨荷花
Photoshop 抽象的海螺效果
Photoshop 模特照片精细美化及润色

Photoshop绘制个性化的网站导航


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-27   浏览: 361 ::
收藏到网摘: n/a

  今天为大家带来的这个教程是教大家怎么用PHOTOSHOP制作一个像Web Designer Wall这个网站的水彩画风格的导航栏(菜单栏。首先我会教大家用PHOTOSHOP制作出导航所需要的图片文件,然后再第2个部分教程中我会教你怎么样用CSS把这个导航栏做出来。OK,废话不多说,我们开始吧:

  先看效果图

Photoshop绘制个性化的网站导航_webjx

  1.笔记本纸张图片

  首先我们要找一张那种带穿孔的笔记本纸张的图片素材。eddie推荐一个找这种素材的网站是stock.xchng.当然deviantart也是一个不错的选择。在这个教程,你就先用我给你的这张图片吧。本文由软晨学习网RuanChen.Com整理发布!转载请注明出处,谢谢!

Photoshop绘制个性化的网站导航_webjx

  2.水彩画效果

  首先在photoshop中打开我们的素材图片,按住Ctrl点击纸张图层载入选区,然后新建一个组,并点击图层面板下面的小按钮创建图层蒙版。这样做使我们后面使用画笔时颜色只会出现在蒙版区域内。

Photoshop绘制个性化的网站导航_webjx

  新建一个图层,选一个很浅的粉红色(或者其他你喜欢的浅颜色),选择画笔工具(B),在上方面板把画笔大小调为100px,不透明度为10%。然后在纸张上方随意画上一些粉红色。看到本信息,说明该文章来源于软晨学习网www.RuanChen.Com,如果文章不完整请到软晨学习网RuanChen.Com浏览!

Photoshop绘制个性化的网站导航_webjx

  重复这个步骤直到效果差不多

Photoshop绘制个性化的网站导航_webjx

  3.增加一些细节

  找一些咖啡污渍的素材图片,放在纸张图层上面,在图层面板把混合模式调为“整片叠底”。

Photoshop绘制个性化的网站导航_webjx

  

  接下来我们还可以用一些现成的笔刷来添加一些污渍与水迹的效果。可以从splatter与watercolor这里下载到合适的笔刷。

Photoshop绘制个性化的网站导航_webjx

  接下来再添加一些素描的素材上去来丰富细节的部分。你可以从我提供的网站寻找素材,或是直接从vector illustration这里下载。

Photoshop绘制个性化的网站导航_webjx

  在纸张右上角做一个三角形的选区,然后选取灰色,选择渐变工具在选区画一个渐变。这样使得右上角的纸好像被折过后的效果。

Photoshop绘制个性化的网站导航_webjx

  

  4.手写字体

  如果你没有合适的手写字体,我也推荐你去Dafont与 Urban Fonts去找。(这2个网站都是免费并且资源相当多。)接下来添加你想要的文字吧。如图

Photoshop绘制个性化的网站导航_webjx

  5.一个在水里泡过的RSS图标

  首先我们去找一个RSS图标。选择橡皮擦工具,然后选择一个上面你用过的笔刷,把不透明度调为10%后在图标边缘轻轻擦。然后你还可以选择灰色,在图标上加一些灰色让RSS感觉有点脏。

Photoshop绘制个性化的网站导航_webjx

  6.铅笔风格的边框

  铅笔风格的边框可以在Adobe Illustrator中很轻松的画出来。先画一个图形或是路径,然后打开画笔面板。选择木炭画笔并把大小调为0.25pt.

Photoshop绘制个性化的网站导航_webjx

 

  7.结束

  这就是最后的成果啦,你的呢?

  如果你还想花更多时间在细节上面,你还可以增加一些纸屑,透明胶带,小贴纸等等。

Photoshop绘制个性化的网站导航_webjx

  我看到这个效果很不错,所以也翻译成汉语给需要的朋友看,意思有不对的也请原谅。

  虽然要做到与原作者一模一样的效果不是那么简单(除了这里的高手),但是我相信这篇教程还是有相当多可以学习的要点。希望大家能从中获益。