注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

aswh07的博客

玫瑰嘤嘤展威风,我自孤立觉君盈。万物映梅银光闪, 独有傲雪爱红梅

 
 
 

日志

 
 

【转载】Ps制作大图及切片无缝拼接代码—水乡小镇【原创】  

2015-09-24 18:22:12|  分类: ps教程 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
1、选几张意境相似的图片做素材,用“美图秀秀”剪切成宽度一致,高度视图片情况而定,最好大体差不多,为以后Ps羽化做准备,然后把剪切后的图片保存到电脑里。以下以4张图片为例:
水乡 - 漫步 - 漫步家园


水乡 - 漫步 - 漫步家园

 
水乡 - 漫步 - 漫步家园


水乡 - 漫步 - 漫步家园
 
2、用“美图秀秀”拼图,如果用Ps制作总感觉费劲,也慢。这是拼好的效果图:
水乡 - 漫步 - 漫步家园

3、用Ps打开上图,用套索工具羽化图片间有缝隙的部分,这一步非常关键,需要技术和熟练,因为会涉及到大图制作的整体布局和美化。

用套索工具在图片的边缘处画出选区,羽化定为20,在“选择”里点”羽化“,再按Delete删除。如果一次删除不干净,可以两次、三次按Delete,直到满意为止。  以下是借用别的图为例,为的是让朋友们看清楚操作方法:

水乡 - 漫步 - 漫步家园

效果图
水乡 - 漫步 - 漫步家园

 注意:现在羽化的只是当前工作图层。比如羽化的是图层一,图层二的边缘又显示出来了,那么在图层窗口激活图层二,再对图层二进行羽化。用工具里的缩放点缝隙处,放大羽化看得清,返回按CtrI-,做到过度自然,看不出边缘拼接痕迹,才是我们想要的效果。
4、羽化满意后,点“图层”里的“合并图层",这样就制成一幅整体大图。
5、图片过大一定会影响打开速度,用PS把它分割成若干份。在左侧的工具栏里有一个“切片选择工具”,右键点开,有两个选择项,选下面的“切片选取工具”,把鼠标移到画布上,右键,选择“划分切片”。在弹出窗口,设为水平划分,10片(实际制作中可以随意划分),我们就看到做好的图被切割成了10份。
6、打开菜单栏的文件,在下拉菜单中选“存储为web所用格式”,在弹出的存储选项窗口,设置文件大小、品质,如图:
水乡 - 漫步 - 漫步家园
 

在不损失图像品质的前提下,尽量压缩文件大小,以不超过100K为宜。
注意:设置时最好是预设最佳,在连续和ICC配置文件框内打钩,品质100、模糊0、杂边无。
            图像大小原图为宽750、高1532像素,改为宽800、高1634像素。品质选“两次立方”。
            
各项设置好点“存储”,保存类型是HTML和图像(*.html) ,选择存储位置,【比如存到E盘】,命名为“水乡小镇”,打开E盘,看到的是两个文件,一个是web文件,一个文档文件夹。如图:
水乡 - 漫步 - 漫步家园
web文件包含了网页应用的信息,文件夹images里就是切割好的10张图片。点击web文件,就可以浏览作品了。

7、现在开始写日志:插图—添加文件(文件夹images里的切片)——最大(由于网易相册对图片尺寸上传有限度,对于超过长或宽750不支持,我们就选择“最大”),然后在“写日志”逐片插图,保存草稿,打开草稿日志,右键取得各切片属性地址。
8、写作品日志:在HTML状态下复制如下代码,这里以10张切片图片为例:

<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址1 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址2 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址3 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>

<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址4 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址5 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址6 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址7 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址8 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>

<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址9 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=870 background=图片地址10 align=center height=261>
<TBODY>
<TR>
<TD>&nbsp;</TD></TR></TBODY></TABLE>

注意:切不可把经切片的10张图片顺序搞错,否则成笑话了。
用如上代码成图毫无缝隙,也比用别的上传软件等方法简单得多。宽高由上传的切片属性尺寸改动。
 
好,我们总结出切片无缝拼接的通用代码:
<TABLE border=0 cellSpacing=0 borderColor=#cccccc cellPadding=0 width=切片宽度 background=切片地址 align=center height=切片高度>
<TBODY>
<TR>
<TD></TD></TR></TBODY></TABLE>

有几个切片就复制几个如上代码,但应该注意的是切片是按水平划分的。


作品《水乡小镇》效果图
 
 
 
 
 
 
 
 

显然羽化效果不怎么样,好像缺一幅背景图融合,也没有调色,这里只是记录大图简单的制作过程,没有进行必要的后期修饰美化,待以后多加练习,提高质量。
好了,你又多了一篇大图日志,再加上flash(以后再试试怎样加flash特效),配上一首好听的音乐,就是一篇漂亮的大图音画佳作。
如上赘述是否有错或存在不完善的地方,敬请朋友们批评指正,谢谢! 漫步家园点击查看漫步家园 更多精彩
  评论这张
 
阅读(53)| 评论(1)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017