【清梦】音画制作教程

【前言】

从2005年开始喜欢音画，在学习制作过程中，我将音画分为以下几种类型：

第一种：框图音画。主要通过html语句实现多层图框，在图片上附加透明flash美化，配音乐。

第二种：特效音画。主要通过一些特效代码，实现图片动态效果，近似动画场景，配音乐。

第三种：大图音画。通过photoshop制成大图，将其进一步制成网页，再附加透明flash美化，配音乐。

第四种：电子杂志。使用制作杂志的软件，将图片编辑成册，透明flash以及音乐，用软件可导入自动生成。

第五种：单幅音画。一般高度低于3000的大图音画，可视为单幅音画。

从音画的发展来看，由于前两种具有以下特点，对制作者来说，既不易于掌握，又比较费心劳神，所以现在已很少有人使用。

1、框图音画对代码要求非常严，构建层层框架的代码，常因错一个字符就会乱码，无法正常显示。

2、特效音画对代码要求更严格，代码的编排以及相应处图片的更换，都需要细心和耐心，若有字符错误，也是无法正常显示。

再有，欣赏特效音画，必须先重新设置IE浏览器，才能正常显示特效。一般人头痛这个麻烦，必然放弃，终于，看不到特效音画的正常显示。

现在网络流行的音画作品，后三种居多，因它们具有易操作，易掌握的特点，没有繁琐的代码编排，只需熟练使用软件便可，但也有相应的难点。

1、必须会使用photoshop，因为制作图片和实现网页都要借助于它。

2、photoshop功能较强大，要完全掌握并非易事，不过循序渐进，图片制作水平提高了，制作出的网页也会更美观。

网络虽然有很多html教程和photoshop教程，但具体关于音画怎么制成的，都很模糊，没有具体的操作步骤告诉大家。

看到很多喜欢音画的初学者无从下手，想起自己当初学做音画时，费心摸索琢磨，走过不少弯路。

为了方便喜好音画的同道，决定写出既简单而又能令初学者尽快上手的教程，让更多为代码头疼的朋友，不再因代码望音画而却步，为有心学做音画的人指出一条明路。

我这里讲的方法，对初学者来说，应该是最简单最捷径最明了的，步入音画殿堂不是梦想而会变成现实，祝大家学习进步，早日做出属于自己风格的音画作品。

【教程1】

第一步用photoshop软件制作大图

1、首先打开photoshop，选择“文件”下拉菜单中的“新建”。

2、在“新建”对话框中，设置宽度（自定尺寸），高度（自定尺寸），分辨率（72），颜色模式（RGB），背景内容（透明色）。

注：宽度和高度，一般用像素作单位。括弧内的参数，是我使用的设置。分辨率单位为像素/英寸，颜色模式选择8位就可以。

在此对话框的“高级”里，我们还可以设置“颜色配置文件”和像素长宽比，我的设置分别是prophoto RGB和方形。

这些设置都完成了，为了以后制图方便，我们可以点击“存储预设”保存。

3、制做图片，自由发挥。（具体步骤略）

4、图片做好保存时，最好是psd格式，便于各图层修改。

5、由于图较大，不便于上传到网上，也不易打开，所以必须使用切片工具，将其切割成一些小图。

6、选择photoshop“文件”下的“存储为web所用格式”，将大图自动生成为html网页。

7、为了网页的像素品质高，存储为网页格式时，一些相关设置必须注意。

在“存储为web所用格式”对话框中，我使用的具体参数设置如下：

a、预设：优化的文件格式（jpeg），压缩品质（最佳），“连续”“ICC配置文件”处打勾，品质（100），模糊（0），杂边（无）。

b、图像大小：品质选择“两次立方（较平滑）”。

8、存储为网页格式时，出现“将优化结果存储为”对话框，参数选择如下：

a、>文件名：自定，后缀为html

b、保存类型：HTML和图像（html）

c、设置：背景图像

d、切片：所有切片

9、保存后，会出现html文件和images文件夹，images文件夹内所有图片都是切割好的图片，用于html文件调用。

注：一定要先将大图切割，再进行存储为网页这一步。

【教程2】

第二步用frontpage软件制作网页 1、首先用frontpage打开你用photoshop存储而成的网页。

2、在代码<title>******</title>中，把星号换为自己为音画网页取的名字。

3、在这段代码中，<body bgcolor="#FFFFFF"leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">，把颜色代码#FFFFFF换成自己需要的颜色代码。

4、为了音画的美观，我们可以在<title>******</title>后面加上滚动条代码：

<STYLE>

BODY {

SCROLLBAR-FACE-COLOR: #d7c9e2;

SCROLLBAR-HIGHLIGHT-COLOR: #d7c9e2;

SCROLLBAR-SHADOW-COLOR: #6f6ba6;

SCROLLBAR-3DLIGHT-COLOR: #d7c9e2;

SCROLLBAR-ARROW-COLOR: #d7c9e2;

SCROLLBAR-TRACK-COLOR: #d7c9e2;

SCROLLBAR-DARKSHADOW-COLOR: #d7c9e2;

SCROLLBAR-BASE-COLOR: #d7c9e2;

}

</STYLE>

同样，这段语句中的颜色代码#d7c9e2，可以根据自己音画的色彩更换。

5、由于网页是用photoshop自动生成代码的，所以图默认是左对齐。找到这段代码语句<table id="__01" width="1000" height="600" border="0" cellpadding="0" cellspacing="0">，它的前面加一句<div align="center">即可使图居中。这一步也可以不做。

6、进行到这一步，再加上音乐，简单的音画就基本完成。

7、为了音画更具感染力，有的人点缀一些透明flash。添加flash效果的代码语句，可全屏添加，可单图添加。由于大家使用的电脑不尽相同，常因分辨率不同，而使全屏代码添加的flash出现一定的偏差，建议用单图添加flash。具体根据音画实际情况而定，这里不作详解。

【教程3】

第三步用ftp软件上传网页

1、首先要有稳定的空间，能上传自己的音画。

网络有很多免费空间，一些论坛也提供个人空间，自己也可构买一个空间。

2、使用ftp上传自己的音画，到自己的个人空间。

3、根据空间的音画存放路径，拼出自己的音画网址。

为了便于大家的学习，这里我提供几个网址：

【教程4】

第四步网站（论坛）发布音画

1、使用以下代码发布音画：

<p align=center><A href="音画网址" target=_blank ><FONT color=#f70968size=6>点击全屏观看</FONT></A></P><BR><BR>

语句中蓝色数据，可根据论坛的具体情况进行调整，使音画居中，文字颜色和谐。

语句中红色数据，可根据自己音画的高度和宽度进行调整。

“音画网址”处，填写自己音画的网址。

2、论坛发贴时，注意要选择在html模式下进行编辑，普通模式下编辑发出的只是代码。用这段html代码发贴时，不能有字符错误，否则会无法正常显示音画。

*** *** *** *** *** *** *** *** *** *** *** *** *** *** *** *** ***

因是音画教程，主要讲音画的制成过程，顺便提一下电子杂志。

现在网络的电子杂志,许多是用zinemaker制成，有2006版和2007版，我使用的是zinemaker2006版。它有自带的模板提供，有人觉得这些模板很好，但是总不合用。要自己做模板，最简单的方法，就是用模板破解工具。

电子杂志制作起来并不难，难的是破解，制成自己的杂志。这里提供几个常遇到的问题和解决办法：

1、如何去掉封底的logo和启动画面

zinemaker2006授权码：

专业版:“4D0E7-DA14A-9EC02-EF223-AD261” 企业版:“TUVAB-797E1-66B9A-E088B-F81CE” 注册方法：打开zinemaker，点“帮助”——“软件授权”，然后输入授权码，OK。

2、ZineMaker制作成网页格式

做一个index.html文件（文件名可任意取）拷贝以下代码：

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-CN"

lang="zh-CN">

<head>

<title>在线电子杂志</title>

</head>

<body

bgcolor="#ffffff" topmargin="0" leftmargin="0" scroll="no">

<!-- 影片中使用的

URL-->

<!-- saved from

url=(0013)about:internet -->

<object

classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"

codebase="http://fpdownload.macromedia.com/pub/

shockwave/cabs/flash/swflash.cab#version=8,0,0,0"

width="100%" height="100%" id="index" align="middle" VIEWASTEXT>

<param

name="allowscriptAccess" value="sameDomain" />

<param name="movie"

value="index.swf?online=true" /><param name="quality" value="high"

/><param name="bgcolor" value="#ffffff" /><embed

src="index.swf?online=true" quality="high" bgcolor="#ffffff" width="100%"

height="100%" name="index" align="middle" allowscriptAccess="sameDomain"

type="application/x-shockwave-flash"

pluginspage="http://www.macromedia.com/go/getflashplayer"

</object>

Sub

index_FSCommand(ByVal command, ByVal args)

If LCase(command) = "quit"

Then

window.close

ElseIf LCase(command) = "settitle"

Then

window.document.title = args

End If

End

Sub

</script>

</body>

</html> 这段代码中，红色的是颜色代码，我们可以根据自己杂志的主色调进行更换。

将index.html与破解工具生成的SWF文件、TXT文件、XML文件放在同一目录下，就完成了。具体的杂志破解方法，可查找网络一些杂志教程，这里不作详解。

【音画实例】

温馨提示：点击下面实例名称连接可浏览

【框图音画】：

【特效音画】：

【大图音画】：

【电子杂志】：

青春时代（时尚类）

本站仅提供存储服务，所有内容均由用户发布，如发现有害或侵权内容，请点击举报。