Delphinium的模型大坑——UV动画入门。

jifengxiang · 发表于 2012-10-30 04:40:45

本帖最后由 jifengxiang 于 2012-10-31 16:24 编辑

接前面那个帖子，因为心情不好睡不着觉所以更新一下教程帖。

引言：在这个帖子中，我们将简单介绍两种UV贴图动画的实现方法。这两种动画在SC2中都有很广泛的应用，但是在本帖的第一部分，我们只关心如何在3dsmax中实现这两种动画效果。这是因为现在的m3插件无法在3dsmax中实时的预览我们所要做的动画效果，这样写出来的教程估计连作者自己也讲不清楚吧……所以我们在3dmax里面先同步着做UV动画的设置和预览。当我们需要在SC2中实际生效的时候，只要将材质换成SC2_Material 效果是一样的。
在SC2中如果查看Assets/Textures 目录，你可能会注意到两类非常有代表性的贴图，一种是光束等模型使用的长条状的贴图；一种是轰击模型等使用的、由NxN个小图组成序列帧贴图。这代表了两类很典型的UV贴图动画，UV平移动画和序列帧动画（后者其实只是前者的一种极端情况，但是由于实际应用太多所以大家都这么叫它）。其他的比如滚动字幕、凤凰和Nova盔甲上的发光的导线，以及神族单位折越时流过全身的光晕也都可以用这个方法实现。（厄，这个其实复杂不少……有兴趣的同学可以想一想那个光晕和人物的身体互不干扰是怎么实现的

）
好吧，其实光晕的贴图和身体的贴图不在一个贴图通道上，而这两个贴图通道下UV的展开方式是不一样的，由于m3插件的缺陷，似乎没法在max下直接查看它们。

1）使用脚本工具制作坦克轰击的序列帧动画
我们用一个简单的案例来解释序列帧动画工作的原理，虽然标题是坦克轰击，但是我们首先卖一个萌……

节操啊节操
未命名.gif

所谓序列帧动画，就是让几十张已经有了的图片按顺序播放出来，从而实现类似动态的效果。这一点和gif图片的原理很接近——事实上很多序列帧的原文件也来自flash等软件，只不过穿了一个马甲而已。——你可以自己制作序列帧图片，也可以从SC2或者其他游戏的贴图集中找到你所需要的，后者在很多网站也可以下载到。
我们首先用这个表情来演示一下制作序列帧图片并应用给3dmax模型的方法，然后再解释背后的原理。
首先用平面软件打开这张gif，可以看到总共有26张分离的小图片。
QQ截图20121030162022.png

然后新建，将每一个状态都拷贝过去，排列成如下的图片序列
未命名-1.png

如上图所示，我们做了一个3行8列的序列帧图片，这跟游戏中的坦克轰击等模型使用的贴图是类似的
QQ截图20121030161541.png

值得注意的是，其实有软件可以直接将这类图片转变成序列帧图片，大家可以搜索一些，在这儿因为不太复杂所以是手动制作的。
然后我们在3dmax中新建一个BOX，将贴图拖曳上去。
QQ截图20121030163414.png

这儿给出了贴图的状态

然后再新建一个Box，这次我们用一个序列帧脚本插件来创建贴图

这儿是它的贴图状态
在选择贴图下选中你所创建的序列帧贴图，然后设置好行数和列数，点击创建就可以了。（需要注意的是，这个工具形成的贴图只能在3dmax下完美工作，虽然可以给SC2使用，但是不是很规范，而且Alpha通道工作的有问题，这也是为什么青蛙想找一个Standard to SC2_Bitmap脚本的原因，很多工具在max下工作，想给SC2用得绕弯子）
如果我们比较上述两种情况的贴图区别，可以注意到带有动画的那个的UV偏移和“瓷砖”（Tiling）设置是有变动的。（显然Tiling的值正好是行数和列数的倒数）
下面是SC2_Material下的UV设置，它们和Max自带的没有什么区别。
QQ截图20121030165116.png

那么UV动画的具体设置是怎么做的呢，在这儿，U表示水平方向的平移，V表示竖直方向的平移，所以此处的序列帧动画设置就是，先水平平移8次然后换行——换句话说就是一个阶跃函数。如果你熟悉曲线编辑器 QQ截图20121030165233.png

，那么打开曲线编辑器你将看到事实也确实如此：
QQ截图20121030165422.png

每个小阶梯水平部分的时间内模型显示一张小图片，然后在跳到下一个阶梯是模型显示下一张图片，至于换行是通过中间那条3段的阶梯实现的，因为只有3行，所以它也只有3个阶梯。（请注意这儿的取值是相对值，根据你的UV贴图划分会有些变动）
可以看出这种动画其实原理很简单，但是手动做的话工作量其实挺大的——所以喜欢这种动画的玩家，请和青蛙一起期待相关脚本工具的问世吧，赞美2L。

卖萌完了我们来进行实战，将轰击动画在3dmax中播放，值得注意的是，由于没有配套的粒子效果和光影效果，这个动画看起来其实挺渣的。
新建一个平面，将贴图用脚本处理后添加到模型上。渲染后如下图所示：

在视口中是这样子的，实际使用的话，SC2有强制让平面对准玩家镜头视角的工具。
如果只是想在max中玩一下子，可以对这个模型增加一个“注视约束”，然后拾取摄影机作为注视对象，下面是一个用这种方法做成的小动画（仔细看能看到很多错误的，实际上特效很多时候要求制作者想出最好的欺骗玩家眼睛的手段，有些时候单靠一种方法是不够的）

能不能给力一点啊！喂！
加上其他的效果于是好了一些……

2）在3dmax中制作一个简单的UV平移动画
首先请大家看这个帖子http://www.dogame.com.cn/bbs/viewthread.php?tid=60501
青蛙只是一只青蛙，而人家是业内的专业人士，如果你对UV动画足够熟悉，可以无视下面青蛙的帖子去看专业的，我想收获应该会更多。

如果你对UV动画完全不知道，或者没太留意过，下面是一个简单的案例，在这儿我们没有做上面那个帖子中的那些“随机化”和UV两个方向上的位移。而是尽量简单让大家看清楚整个过程。
首先，我们制作一张长条状的位图作为动态贴图，为了大家好辨认，我们这儿挑的是一组有颜色的文字。
（没有使用论坛左上角的GA Logo是因为那个Logo技术上很特别，会把问题复杂化。）
未命名.jpg

我们的目标是让文字从S到T显示一次，为此我们制作下面两组模型
QQ截图20121031153851.png

上面的一个平面显示全部的字符，下面的一组平面只显示一个字符，这儿有许多中方法实现。
第一种，我们按照前面讲过的方法，通过修改Tiling实现（有9个字符，所以Tiling U方向上取值1/9就可以了。）
现在显示的是字母C，如何显示第一个字母红色S呢？显然，贴图往右移动（U值增加）4倍（移动4个Tiling的区域）就可以实现了，我们在下面填上U=4.0，就得到了上图中的S。
QQ截图20121031155446.png

现在让我们把这个过程变成动态的。方法很简单，让U值从4.0变成（-4.0），打开自动关键帧，然后在0帧将U定为4.0，在100帧时修改为（-4.0）动画基本实现了。

注意到动画的播放不是匀速的，而是先加速再减速的播放，打开曲线编辑器在图中条目下可以发现U向偏移是一条S型曲线。
QQ截图20121031155959.png

需要手动修改成下面这种。选中后点击上方的直线按钮 QQ截图20121031160430.png

这样动画播放就变成匀速了

案例完成。

第二种，贴图和模型的UV是相对的，我们可以修改Tiling的大小，自然也可以直接修改UV块的大小。如下图所示，打开UV编辑器，直接修改UV块的大小，然后套在第一个字母上。
QQ截图20121031160842.png

UVW编辑器记录了当前贴图和模型UV之间的关系（需要用ctrl+U手动刷新）。
然后我们回到材质编辑器中，可以看到Tiling值为1.0，这儿如果想移动一个字符，那么每次需要移动贴图的量是上一种方法的1/9。如下图所示：
QQ截图20121031161235.png

我们再做一次动画的话，取值就是从0~（-0.888）了。方法与前一种方法类似。所以过程就不详细说了。

第三种方法，根据第二种方法，可能有的同学已经想到了——既然我可以移动和缩放UV块代替修改Tiling，那么是不是也可以通过移动UV块（并设置动画）来代替UV偏移的设置呢？
显然也是可以的，但是这种方法并不是很推荐——因为有些时候你的Alpha、高光和法线不一定与你的漫反射贴图变化方式一致，而修改整个UV块动画是会在整体上修改这些的。换句话说就是自由度会差一些。
当然我们这儿只是介绍这种方法，就不管那么多了。

第一部分到此完成，下面我们会取一些例子在SC2上实际操作一下。

ZeratulWill · 发表于 2012-10-30 11:18:25

我来帮你

vnalin · 发表于 2012-10-30 11:25:57

顶一下楼主让我想起以前弄的火元素

视频里应该看不清爆炸最后一刻弄了个胸部类似火焰快速流动的效果算是最基本的UV动画了吧

jifengxiang · 发表于 2012-10-30 19:10:03

谢谢2L ZeratulWill，果然自古真相出自二楼。另外Vnalin的效果很棒，有兴趣接着青蛙的拙作写第二部分吗？

ZeratulWill · 发表于 2012-11-1 10:03:48

爆炸动画基本上就是uv 一格一格的偏移，而光束和流光效果是一个单向循环uv偏移，使这个意思吧。。

amo · 发表于 2012-11-1 11:28:41

ZeratulWill 发表于 2012-11-1 10:03
爆炸动画基本上就是uv 一格一格的偏移，而光束和流光效果是一个单向循环uv偏移，使这个意思吧。。

恩，一个是台阶，一个是直线

vnalin · 发表于 2012-11-1 14:03:14

这个。。。还是青蛙特工继续努力吧加油~ 说实话个把月没摸编辑器和MAX了。。。

jifengxiang · 发表于 2012-11-1 15:10:30

ZeratulWill 发表于 2012-11-1 10:03
爆炸动画基本上就是uv 一格一格的偏移，而光束和流光效果是一个单向循环uv偏移，使这个意思吧。。

虽然实际情况大致如此，但是有一个小小的值得注意的地方——那就是光束和流光的效果是发生在模型表面的，也就是说作为显示器的是模型的UV块。而作为显示内容的是贴图——但从来没有人规定UV块该如何划分。所以UV块（显示器）的形变也是会影响最终的动画效果的。
比如说把一个圆面的UV展开成长方形，那么虽然我们操作上做的仍然是循环的UV偏移，但是实际的效果就变成向一个方向旋转了。这一点儿有些人可能会误解的说。

tommy34012 · 发表于 2012-11-24 13:20:21

给力收藏了

superlk1 · 发表于 2012-12-3 15:58:12

楼主好观点。膜拜~
阴茎增大 www.zhangquanblog.com
阴茎增大 www.yxddxw.com
阴茎短小 www.yushenjt.com
基因育根 www.qingren214.com
基因育根 www.ycydxl.com
上海按摩 www.mytb8.com
电视棒 www.xflmhg.com
超级P57 www.JISHIYAOFANG.COM
朵朵神速大 www.shvickiclub.com
时时彩 www.bygit.com

sdwnew · 发表于 2017-9-22 11:42:55

感謝大師的教學，收下了

		自动登录	找回密码
密码			点一下

Delphinium的模型大坑——UV动画入门。

评分

点评