Photoshop结合DW制作超酷的网页相册效果

2016-02-15 21:51 7 1 收藏

下面图老师小编跟大家分享Photoshop结合DW制作超酷的网页相册效果,一起来学习下过程究竟如何进行吧!喜欢就赶紧收藏起来哦~

【 tulaoshi.com - PS 】

本教程适用对象:有一定的PS基础,最好有网页设计制作基础,那样在PS处理好后可以在DM里面做一个后期的CSS以及布局方面的处理,当然,DM&FW也可做图片批处理并生成相册,不过我个人认为PS&DM的效果比较好。

PS的批处理功能是很强大的,如果利用好可以做为我们做很多工作。今天我想讲的是PS批处理设计制作图片展示

开始吧

一、准备好自己要做相册的素材,产品展示啦,案例展示了,照片展示了都可以,统一将这些图片放在一个文件夹下,我这里将这个文件叫做Res_IMg",这里面放的都是大的图片,小图片一会儿ps会为我们做的。

二、打开PS,选择菜单如下:

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/ps/)

Photoshop结合DW制作超酷的网页相册效果,PS教程,图老师教程网

三、这个就是PS制作图片展示的主要界面啦,主要有以下几个:

Photoshop结合DW制作超酷的网页相册效果,PS教程,图老师教程网

样式中可以选择生成不同的html页面的形式,PS CS版本中提供了8种格式,都不错的。

(本文来源于图老师网站,更多请访问http://www.tulaoshi.com/ps/)

源图像工作区:

Photoshop结合DW制作超酷的网页相册效果,PS教程,图老师教程网

上面的浏览是选择你要批量做图片展示的文件夹,也就是上面我所说的"Res_Img"。

下面的目的就是PS处理完后存放的文件夹,可以存在你想要保存的位置,我这里面建个文件夹叫Pic_Ok"。

Photoshop结合DW制作超酷的网页相册效果,PS教程,图老师教程网

选项里面就是具体的一些设置

一共有六项,其中一定要设置的是横幅大图像预览。

Photoshop结合DW制作超酷的网页相册效果,PS教程,图老师教程网

横幅中可以设置这个首页面html的名称,也就是html页面的Title,再就是联系信息,时间什么的,如果填写上最后都会显示出来。

而大图像则可以设置生成图片展示后大图片的长宽等,而且PS可以自动优化图片大小,当然也可以不设置。

Photoshop结合DW制作超酷的网页相册效果,PS教程,图老师教程网

缩览图可以设置生成html页面中小图片的大小,也可以设置个边框什么的。我直接用默认的0。

通过以上设置后,就可以按好了,然后就等着PS把咱的这堆图片变成一个图片展示吧。

来源:http://www.tulaoshi.com/n/20160215/1564367.html

延伸阅读
标签: PS效果 PS PS基础
本实例介绍即将发行游戏星际2标志特效制作。网上已经有很多的翻译教程,不过都不详细漏了很多步骤。本站再按照作者的思路及提供的源文件重新翻译,为了方便大家学习,教程集中只介绍文字部分的制作。背景素材直接拿作者做好的原图。本教程的文字效果已经保存有图层样式,如有需要可以到本站样式下载栏目下载。 最终效果 1、打开下图所示的...
标签: PS效果 PS PS基础
本教程为电影海报效果的制作全教程,教程共分为两部分,画面部分和文字部分的制作。画面部分的教程请参考教程: PS合成质感金属脸 最终效果 素材1 素材2 1、开始今天的任务吧,还是规矩新建 (ctrl+n)A4大小,如图1。 2、将背景填充黑色,选择文字工具,打入海报的主题,当然这个主题大家可以自己看着办,在选择好字体,进...
标签: PS PS基础
最近一款叫脸萌的APP突然火了起来,图老师小编朋友圈都被脸萌刷屏了,愤怒之下看到了这个教程教你利用PS和AI创建个性的多边形头像,效果太帅了,当即大喜,赶紧分享出来。图老师小编看到很多外国朋友学习后立刻换了头像,喜欢这种效果的小伙伴们也赶紧练下手。 在这里,巴西设计师布雷诺Bitencourt将为你介绍如何在Illustrator和Photoshop中一...
标签: PS PS基础
最终效果 让我们开始吧 创建一个800 × 600像素,没有任何背景色的新文件。下载金属纹理然后在Photoshop中打开它,打开之后去编辑定义图案。 关闭纹理文档窗口并返回到你的原始文件中。用金属纹理填充你的背景层:选择油漆桶工具,选择图案填充。 添加文本 选择文字工具,然后在画布上键入你的文本。使用较大的字体类型,以便使...

经验教程

350

收藏

59
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部