Photoshop设计制作汽车网站头部流程

软件 网页教学网 2009-03-15 10:36
1设计制作汽车网站头部流程(1)回顶部

  首先选择一张汽车的图片素材:

Photoshop网页制作教程:设计制作汽车网站头
素材图片

  看看效果图:

Photoshop网页制作教程:设计制作汽车网站头
效果图

  在PS中将汽车图片的上部去除。

Photoshop网页制作教程:设计制作汽车网站头
图1  

  使用我们准备的风景图片。

Photoshop网页制作教程:设计制作汽车网站头
图2  

  将风景图片拖动到汽车图层之后作为背景。

Photoshop网页制作教程:设计制作汽车网站头
图3  

  为了使图片更真实,我们要把车窗部分扣出,并将其不透明度调整为80%,这样车窗就能出现真实透明效果的感觉了。

Photoshop网页制作教程:设计制作汽车网站头
图4  

2设计制作汽车网站头部流程(2)回顶部

  由于白云部分的图片过于图片,我们将白云区域选中。

Photoshop网页制作教程:设计制作汽车网站头
图5  

  新建一个图层,期间保证之前选中的白云区域状态,随后在区域上添加从上到小的渐变效果,颜色为#4271fc 到#9da6fb ,并设置不透明度为95%,这样就能隐约看出下面的白云轮廓了。

Photoshop网页制作教程:设计制作汽车网站头
图6  

  现在我们来制作真个汽车网站头部的背景主题,在PS新建立1600×600大小文件,这里我们使用1600宽的目的是主要适应一些大尺寸的浏览器,你也可以根据自己喜好设定尺寸。

Photoshop网页制作教程:设计制作汽车网站头
图7  

  设置PS的前景色为#121212 ,背景色为#474748 ,从上往下在背景图层中拉出渐变色,随后添加顶部绿色渐变区块与底部灰色渐变区块。

Photoshop网页制作教程:设计制作汽车网站头
图8  

  使用选区工具选中中间区域作为放置之前的汽车图片位置。

Photoshop网页制作教程:设计制作汽车网站头
图9  

3设计制作汽车网站头部流程(3)回顶部

  你需要将选中的区域单独截取出来,因为我们要为其添加阴影图层样式。


Photoshop网页制作教程:设计制作汽车网站头
图10  

  完成阴影效果后将我们之前做的汽车图片拖入其中。

Photoshop网页制作教程:设计制作汽车网站头
图11 

  添加汽车网站的导航凹槽线条。

Photoshop网页制作教程:设计制作汽车网站头
图12  

  加入文字与斜线来使页面更具变化。最后完成效果如下图:

Photoshop网页制作教程:设计制作汽车网站头
效果图

  【延伸阅读】

  Photoshop制作真实感立体玻璃碎片
  Photoshop制作娇嫩欲滴的美味水果
  Photoshop“颜色减淡模式”的超酷应用
  Photoshop打造杯中海浪特效创意广告

收藏

网友评论

写评论

聚超值推荐

相关推荐

2019年国庆放假安排及调休安排

2019年国庆放假安排及调休安排

网络辅助 0

2019LOL无限火力开启时间 无限火力什么时候开

2019LOL无限火力开启时间 无限火力什么时候开

游戏攻略 0

5G手机有没有必要买?教你查5G覆盖率到底有多高

5G手机有没有必要买?教你查5G覆盖率到底有多高

网络辅助 4

LOL9月幸运召唤师活动地址 幸运召唤师活动技巧

LOL9月幸运召唤师活动地址 幸运召唤师活动技巧

游戏攻略 0

不再被语音信息烦到爆!微信7.0.7新版体验

不再被语音信息烦到爆!微信7.0.7新版体验

Android资讯 4

发工资也是一种痛苦!这招一分钟搞定工资条

发工资也是一种痛苦!这招一分钟搞定工资条

Excel 3

LOL2019无限火力开放时间 无限乱斗模式回归时间

LOL2019无限火力开放时间 无限乱斗模式回归时间

游戏攻略 0

云顶之弈9.18版本全新装备合成表一览

云顶之弈9.18版本全新装备合成表一览

游戏攻略 1

PhotoShop的“bug”这么多?解决方法都在这了

PhotoShop的“bug”这么多?解决方法都在这了

Photoshop 3

lol9月幸运召唤师活动时间 幸运召唤师9月地址

lol9月幸运召唤师活动时间 幸运召唤师9月地址

游戏攻略 0