当前位置: 首页 > 图文教程 > 平面设计 > Photoshop > 教你用PS打造网页效果图全过程

Photoshop
Photoshop合成带有浓郁古典风韵的美女
Photoshop 绘制会说话的大眼睛
photoshop 简单两步调出情侣照片漂亮的阳光色
Photoshop 喜庆漂亮的虎年新年贺卡
Photoshop 清爽时尚的情侣照片
Photoshop 快速制作拍照边框效果
Photoshop 制作剪裁遮色片实例教程
Photoshop 将照片模拟成彩色铅笔效果
Photoshop 真实照片变油画效果
Photoshop 滤镜实现油画效果图片
Photoshop 设计复古风格的简洁海报
Photoshop 破碎的文字特效
Photoshop 一个漂亮的指路牌
Photoshop 图片添加隐形水印的简单方法
photoshop 绘制情人节蓝色梦幻心形
Photoshop 制作不规则堆叠效果照片
Photoshop 制作淡彩高调人物 调色技巧
Photoshop 滤镜 打造真实的火焰
Photoshop 快速调出蓝色的外景人物照片
photoshop 模糊的眼睛转为水灵的手绘眼睛

Photoshop 中的 教你用PS打造网页效果图全过程


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

  平面广告和网站页面设计的宗旨就是吸引眼球,符合平面视觉冲击特点,如何设计一款有特色、另类能吸引眼球的作品是摆在平面设计人员和photoshop爱好者面前的难题

  现在以一款网页平面设计效果图为实例,讲解网页设计方面的创意知识,从网页效果图布局创意、颜色选择,裁减效果图和制作网页特效等方面来学习。下面我们就一起来学习吧。

  首先声明一下,这款网页效果图在得到朋友许可后拿来制作教程实例,切勿抄袭和用做其他用途。先看效果图0。

photoshop打造极富创意网页效果图
(图1)

一、 创意设计思路

  一个网站在制作前需要确定网站风格、网站主题、和主色调,在没有确切的方案之前,最好不要贸然动手制作,不然最后的结果很可能是以失败而告终。
  
  笔者决定从关键字"路行""独自行走"加上是暗色系的要求上下手,敲定颜色采用沙漠黄,沙漠很容易让人联想到孤单;板式确定为户外广告的样式沙漠黄配合生锈的广告牌。符合"颓废""艰辛路途"主题。

  二、 网站效果图及LOGO的制作。

  1、LOGO的样式采用的是图形和字符的组合。汉字LOGO的字体不是下载的字体,是笔者用钢笔工具画出来的字体。如图1和1-1。

photoshop打造极富创意网页效果图
(图2)

  钢笔工具勾勒出图1的行走的人样式,填充红色,然后调整混合模式"斜面和浮雕"选择浮雕效果、雕刻清晰、深度1、方向上、大小2,其他默认。这LOGO 的创意是,一个人在崎岖不平的路上坚持自己的方向,配合网站的英文加中文名字,构成一个形象LOGO,刚好"路"字和"行"字采用红色,突出了路行。
  

photoshop打造极富创意网页效果图
(图3)


  文字LOGO笔者用钢笔工具勾画出字的各个部件,然后拼接在一起,这里只给出"路"字的方法,"行"字方法如同。

  

  2、制作布局参考图。如图2。

photoshop打造极富创意网页效果图
(图4)

  3、根据布局效果图,新建文件大小1000X765,填充黑色。布局中的"显示区域"为广告牌是要挂到墙上的,使用"石头材质"放置在页面最上方来制作石板墙;使用"锈迹皮革材质"制作"显示区域""LOGO"区域的边框(注:一些材质的制作方法省略,平时可自行制作也可去图片站下载保存,用的时候方便),将LOGO区域的边框复制一层,调整不透明度为60%放置到LOGO曾下方,这样大体的框架就完成了。如图3和3-1。
  

photoshop打造极富创意网页效果图
(图5)

photoshop打造极富创意网页效果图
(图6)

  4、找来一张沙漠公路的图片,把这张图片进行聚焦处理。点图4示例的按扭进入"以快速蒙版编辑模式",选择渐变,渐变模式为"径向渐变"在图中间向两边拉,屏幕会出现一团红色;然后再点"以标准模式编辑"画面会出现一个圆圈选择区域,按"DELETE"删除即可。如图4和图4-1。

photoshop打造极富创意网页效果图
(图7)

photoshop打造极富创意网页效果图
(图8)


  

  5、在"路"图片上方新建一层,按住CTRL+"路"图层,单击新建的图层,填充颜色4E341B,调整为暗系沙漠黄。如图5。

photoshop打造极富创意网页效果图
(图9)

  制作文字LOGO牌。找来图5-1中的灰色材质,在"LOGO边框"下面新建一层,然后在其之上新建一层,放置沙漠图片,将其混合模式修改为"颜色"然后打开一开始制