在photoshop中怎样绘制一个蹩脚的页面效果图 | 苏打苏塔 设计量贩铺

文章信息

在photoshop中怎样绘制一个蹩脚的页面效果图 41,174 views

设计师们的作品集网站是他们在网络上的自我表现,绝大多数情况下这些网站表现了设计师的个人风格。有很多种方法来创建作品集网站,在这篇文章中,你将学会如何利用photoshop制作一个脏兮兮的蹩脚风格的网站。

首先,让我们看看最终的效果

preview_small

这里罗列了一些素材可供下载:

  1. CURLY BRUSH
  2. TORN EDGES
  3. PAPER TEXTURE
  4. BACKGROUND TEXTURE
  5. SOCIAL ICONS

1. 首先打开960 PSD。把画布尺寸变成 1440 x 1220。我们改变画布的话饮食,这样我们就可以应用大尺寸的纹理素材作为背景。
blank

2. 创建一个新图层,命名为bgfill,填充颜色 “#aa926a”
fill
3. 打开纹理,复制并且粘帖到我们的画布中
texture
4. 创建一个新的图层,命名为 gradient。选择渐变工具,选择线性渐变,从前景色到透明。从画布的头部到底端按住shift键拖拽渐变。
gradient
5. 这就是我们现在的效果
gradient_2
6. 好了,我们在画布的边缘部分仍然想要一些纹理效果。这是为了宽屏幕用户(1600+resoulation)考虑的,这样在宽屏下看网站不会太枯燥。利用矩形选区选择一个狭窄的区域然后填充渐变。

side_gradient
7. 现在的效果
side_gradient_2
8. 好了,我们要把纸张的纹理放置在页面的中间。记住要在头部的位置预留出一定的空间。好了,这就是我们现在的效果。利用标尺对其页面的边缘。
paper_texture
9. 我们要给这个纸张添加一些阴影,以增强真实效果。按照下面的参数进行设置
drop_shadow
10.好了,这就是现在的样子
page
11. 我们要在这个纸张上添加一个分割,利用刚刚下载的笔刷就可以了
content_slider
12.我们需要在头部添加一些细节,让它看起来不会太空。我们可以利用花形状的笔刷。
header_brush
14. 我们要应用到一些混合属性。双击图层打开图层属性面板,找到图案叠加,载入叫做 Grayscale patterns的图案。下面是相关参数。
header_brush_setting
15. 现在的效果。
header_brush_2
16.利用矩形选区创建四个菜单,填充不同的颜色。保证这几个菜单图层在纸张图层的下面。我用的是渐变颜色,字体选择的是Italic.
menu
17. 我们添加了一些内容
slider1
18. 利用形状创建两个箭头。用任何一个 grunge bursh轻轻的擦除形状,让他们看起来有一些纹理。
arrow
添加斜面与浮雕,参数如下。
arrow_settings
19.我们仍然需要添加两个内容分割线。用之前应用过的笔刷来绘制分割线即可。
bottom_line
20. 好了,添加一些图标和文字。保持图标的透明度在50%。
sidebar
字体为Skecth Rockwell,设置内阴影,参数如下。
letterpress
21. 添加必要的文字,版权部分等等。这时候我们就得到了最终的效果。
preview_small
这是内容页看起来的效果。
whole_page

via

相关文章

转载文章请注明

转载自:苏打苏塔 设计量贩铺

本文链接: http://sudasuta.com/?p=469



subscribe to comments RSS

There are 4 comments for this post

  1. canaan 说:

    收藏慢慢看

  2. kaitouz 说:

    这个还不错! ;-)

  3. seven 说:

    这个真不错

  4. Suzvenus 说:

    太强了,我要学习一下~~~

发表你的留言吧

 
苏打苏塔 设计量贩铺 程序支持WordPress 主题FREEmium