发现吧

在photoshop中创建高雅的摄影网站

龙骑士 — Sun, 05 Sep 2010 15:23:22 +0000

在本教程, 你将学习如何做一个漂亮的网页设计. 这是一个很简单的教程,旨在说明一些伟大的技术来适应你当前的网页设计流程.

预览

你能点击一下图片观看大图.

教程资源

PSD 模板: 960 网格系统
纹理: Rust
纹理: Scratched Metal
备用图片: Sunset
备用图片: Sunflower
备用图片: Baby boy
备用图片: Bokeh
字体: ITC AvantGarde
字体: Helvetica

步骤1: 创建ps文档

在ps中新建层 (Ctrl/Cmd + N) 像素为1200×910px.

步骤 2: 并入960 网格系统

我们将16列的960网格系统作为布局的根基. 你可以从他们的网站免费下载. 当你下载网psd模板, 在ps中打开并且拖入你的画布. 记得保持这个模板在图层面板的最顶端, 这将为我们的规划服务.

步骤 3: 制作图层背景

临时隐藏我们的网格图层在下方新建一个图层. 在工具面板, 设置你的前景色为黄褐色(#bc7821) , 背景色改为黄褐色(#362a21).

选择渐变工具 (G) 设置径向渐变. 在画布中心创建一个渐变.

单纯的渐变看起来朴实无华, 因此我们试试增添点纹理. 点击滤镜 > 智能滤镜. 这样, 我们稍后可以改变该层的过滤.

现在为渐变增加噪点通过选择滤镜> 噪点 >增加噪点.

在背景的顶部区域增加亮光. 取出你的笔刷工具(B) 画笔直径设置700px; 当然设置你的前景色为白色.

创建一个新层,在画布顶端点击,利用画笔笔触画出渐变.

改变图层的混合选项为叠加调整透明度为 34%.

打开 Rust 纹理在教程的资源列表有提示.将图片拖入我们的图层使用自由调整工具 (Ctrl/Cmd + T)改变图片大小使他比我们的画布略小.

使用橡皮工具,选择原始的圆头笔刷, 圆头笔刷, 轻轻的擦去图片的边和底部. 或者你可以使用图层蒙版以备后患.

改变生锈的纹理混合样式为叠加 ,透明度为 16%.

接下来,在ps打开抓痕的金属纹理 , 同样的拖进我们的画布擦去边痕和底部. 选择图层样式为正片叠底调整透明度为15%.

步骤 4: 增加站点名称

取消网格层的隐藏. 选择横向排版工具(T) 选择字体为ITC Avant Garde CE (或者你偏爱的字体). 另外设置字体为棕色(#523117). 然后键入 “JohnDoe Photography” (或者你想要的其他名字) 在图层的中间.

负责文字层,并且将复制层颜色改为白色(#ffffff), 改变图层样式为叠加调整透明度32%. 选择工具结合向下键将层向下调整一个像素; 这看起来有点想被侵蚀的效果.

步骤 5: 创建导航按钮

创建一个新层. 使用横向排版工具(T) (如下) 在站点名称后面写下你的导航. 确认在你画布的中心.

让我们开始制作鼠标经过导航时显示的效果. 选择圆角矩形 (U). 设置圆角半径为30px. 在导航链接的后面画一个圆角矩形(“Home”).

接着, 在圆角矩形图层应有内阴影与颜色渐变.

颜色渐变

设置颜色为黄色 (#f9a81f).

内阴影

设置内阴影为黑色(#000000).

接下来, 设置圆角矩形图层为30% ,能轻微的展示你的背景图片.

为圆角矩形增加风蚀效果. 在图层面板的圆角矩形上面滴.按 ctrl键点击载入选区

在新的层上, 选择编辑> 描边.

改变你图层的混合模式为叠加调整透明度为18%. 选择橡皮擦工具,使用小和羽毛状的笔触擦去顶部和左边的描边.

步骤 6: 增加幻灯片放映

现在收回网格. 使用圆角矩形工具(M), 在导航栏下面画个圆角矩形然后填充(Shift + F5)为黑色(#000000). 确保你的矩形在画笔正中央并且占据14列网格.

改变圆角矩形的模式为柔光让背景能穿透它.

是时候在幻灯去放置图片. 打开一张图片 (类似Sunset stock photo 提到的资源列表) 在photoshop中拖拉进我们的样式. 使用自由变形工具适当放大.

暂时隐藏图片层 ,然后使用矩形选区工具 (M)在幻灯片区域的中心绘制出矩形选区.

在图层面板上增加矢量蒙版按钮.现在你可以隐藏图片层. 需要注意的一点是,如果操作正确,任何在图片以外的部分将被隐藏.

步骤 7: 控制幻灯片显示

在幻灯片层下面新建组,命名为”arrow” (为了更好的组织). 建一个新层在刚建的组里.

选择椭圆形工具 (U) 在幻灯片层的左边画一个圆.

接着, 为圆增加外发光和渐变叠加效果.

外发光

选择外发光颜色为黑色(#000000).

渐变叠加

设置渐变的颜色为深褐色(#271303) 到稍微浅一点的褐色(#3a2102).

这是现在幻灯片左侧看起来的样子.

我们必须删除圆形不必要的阴影. 为此, 我们必须合并图层通过图层> 栅格化 > 图形. 栅格化之后, 选择幻灯片下面的区域,使用矩形选框工具(快捷键M)然后删除去除多余的矩形选区。

现在为我们的按钮新建箭头. 在新的层上, 选择椭圆形工具(U), 设置圆角半径为30px. 高圆角半径的值使他看起来圆润.

画出斜线代表箭头的左半部分. 改变图形的颜色为暗黄色(#b56d1b) 通过调整渐变叠加.

完成图像的另外一半, 复制图形然后编辑 > 改变 > 水平翻转.

选择两个图层组成的箭头,然后点击编辑>改变> 旋转; 角度为 -90^o以至能指向左边.

在图层面板选择这2个图层,按下Ctrl/Cmd + E合并图层. 复制合并图层.

为复制图层增加黑色的 (#000000) 颜色叠加颜色改变它的颜色, 使用移动工具向左移动1个像素; 增加腐蚀效果.

现在开始创建右侧箭头. 在图层面板选择 “arrow” 组, 复制,改变他的方向通过编辑> 改变 > 水平翻转.移动复制的幻灯片控制到页面右端.

现在看起来应该是这样的:

步骤 8: 创建图片缩略图

显示网格. 使用矩形选区工具(M), 画出4格半列的选区在幻灯片下面. 填充黑色 (#000000). 改变混合模式为柔光.

打开图片 (类似于向日葵), 放置画布上, 调整到原始图片的80% .

临时隐藏向日葵.图层, 使用矩形选区工具(M), 在第一个矩形画出选区. 隐藏向日葵.层 ,在图层面板增加遮罩效果.

这将只有选定的区域显示的向日葵.

让我们为缩略图创建标签. 使用矩形选区工具(M), 在缩略图下方新建矩形,填充棕色(#261103). 改变他的透明度为85% .

使用横向排版工具(T), 为他增加标签 (例如 “NATURE”). 我使用Helvetica字体,颜色为黄色(#ffbf47).

在缩略图下方增加多点文字; 为每张图片附上简短的描述.

重复相同的步骤增加 2张缩略图(你可以使用小婴儿和散景图片在教材的资源列表或者其他图片).

步骤 9: 制作页脚

终于到了教程的最后一步，我们将创建页脚区。创建一个新层。选择铅笔工具（B）,设置其颜色为深褐色（＃2c1303）。绘制一个14列宽的区域在三个缩略图下面，将作为我们之间的主要内容和页脚区域分隔的标志。

建议: 按住 Shift键,确保能画出直线.

复制刚创建的线图层,将他的颜色改为白色(#ffffff) 使用颜色叠加. 向下移动复制层1px. 改变混合模式为叠加，减少其不透明度为18％，创造一些蚀刻效果.

最后，使用横行排版工具（T）的添加您的页脚文本（可以包括，例如，一些版权信息）.

闪光梦幻笔刷下载

龙骑士 — Fri, 23 Jul 2010 15:56:25 +0000

闪闪发光的抽象笔刷,华丽而浪漫,适合用于制作梦幻般的背景.

下载地址

用photoshop制作简单的作品展示页面

龙骑士 — Sun, 20 Jun 2010 17:09:55 +0000

在本教程,你将会学习到如何在photoshop中创建简洁而多彩的作品展示页. 如果您仍然有疑问可以在评论里面提出. 除此之外, 记得所有的教程, 我们都提供psd文件以供下载.

最后预览

教程资源

让我们开始吧

1. 第一件需要做的事情就是新建1020×1200像素的psd文档.

2. 使用填充工具(G), 将背景颜色填充为#AED6EE.

3. 接下来, 我们需要在背景增加一点渐变. 虽然我们可以直接在背景层上面做, 但为了后期转化为代码更加简单,我新建一个图层,绘制一个简单的矩形,填充白色:

4. 现在右击你的图层样板,在弹出的目录菜单中选择图层样式,勾选渐变叠加.

5. 开始创作头部, 我们需要创作自己的logo. 选择你最喜欢的矩形工具, 创建简单的矩形填充 #D4EF9F:

6. 为最新的矩形增加图层样式:

7. 接下来需要为logo增加些文字. 颜色为#FFFFFF . 接着为下一层增加图层样式:

8. 再次使用你最钟爱的矩形工具, 创建简单的矩形,填充颜色#416073.

9. 现在为最新的矩形添加混合选项:

10. 我们的导航会保持相同的样式.使用 Helvetica字体, 在连接旁边加上时尚的图标集. 激活的链接带有颜色为 #2D4655的矩形. 链接的颜色为#99CAEA, 图标集的链接为#AED6EE.

11. 在导航的下面, 我想显示最近的tweet. 因为这个,所以我们需要用到椭圆形工具 (M). 按住SHIFT键增加你的选区造型参考下图填充#FFFFFF:

12. 接着,为云增加淡淡的阴影.

13. 之后再添加填充文字, 增加twitter图标, 头部看起来应该是这样的:

14. 对于我们的内容领域我们要看起来有几张纸上下堆叠,给它一个独特的外观. 第一步先绘制如下矩形:

15. 接下来, 复制本层和移动我们的复制图层(Command+J)在原始图层上面. 按下Command+T让你的复制层变透明向右旋转,看起来应该像这样:

16. 回到原始图层增加图层选项:

17. 对于每一个项目, 我们需要为相同类别的作品集合增加预览图片. 使用矩形工具, 新建简洁矩形如下填充白色 #FFFFFF:

18. 现在如图层增加样式:

19. 所有你需要做的就是添加一个预览图象, 文字颜色为#416073, 重复相同的步骤,看起来应该是这样的:

20. 最后一步为我们的内容区域增加按钮.对于按钮的做法可以参照第14步. 你的顶部矩形颜色为#D4EF9F, 下面的为#AFD465.

21. 为顶部矩形增加样式:

22. 为你的按钮添加箭头, 和文字. 文字和图标的颜色必须为#2D4655. 图标源自Mono图标集.

23. 用同样的手法制作 back 按钮, 增加一些文字显示你当前的也是,看起来应该是这样:

24. 最后一步就是添加页脚. 我们想要看起来就像置身云端, 所以使用椭圆形工具(M) 制作选区然后按住 SHIFT增加选区填充#FFFFFF.增加你的选区直到看起来这样:

25. 在你的页脚增加文字链接右边增加版权信息,最终模板完成:

原文地址

转载自发现吧:http://www.faxianba.net/?p=1851

270款免费的星云笔刷下载

龙骑士 — Tue, 15 Jun 2010 15:11:04 +0000

不知道你到目前为止有没有一些高质量的外太空笔刷,如果没有,那么今天对你来说肯定是个非常幸运的日子因为我收集了270款外太空和星球的笔刷.关键的一点在于:他们都是完全免费的.还在等待什么?

太空 Photoshop笔刷

笔刷数量: 8

网站: DeviantArt

发现吧

在photoshop中创建高雅的摄影网站

预览

教程资源

步骤1: 创建ps文档

步骤 2: 并入960 网格系统

步骤 3: 制作图层背景

步骤 4: 增加站点名称

步骤 5: 创建导航按钮

颜色渐变

内阴影

步骤 6: 增加幻灯片放映

步骤 7: 控制幻灯片显示

外发光

渐变叠加

步骤 8: 创建图片缩略图

步骤 9: 制作页脚

闪光梦幻笔刷下载

用photoshop制作简单的作品展示页面

最后预览

教程资源

让我们开始吧

270款免费的星云笔刷下载

WordPress卡通动漫主题设计

最后结果

步骤 1: 创建新的文档

步骤 2: 焦外成像背景图片

步骤 3: 绘制布局

步骤 4: 绘制内容

步骤 5: Adding Newset/Older Entries Links

最终结果

网页教程:制作简单的软件展示页面

本教程将用到的资源

完成的设计

创建文档

创建页眉

创建模板题目

创建小型的导航栏

创建主要导航栏

创建搜索框

创建焦点区域

创建分割线

增加内容

创建页脚

photoshop黄金渐变grd素材

Photoshop制作云朵标题的网页布局

最后结果

教程资源

开始制作

25个兼具创意与艺术性的T恤设计

20个高质量的photoshop网页设计教程