小教程丨用TouchDesigner 4个步骤带你做出动态海报



小编在整理毕业展入口时,发现许多高校都使用了动态海报,一下子就能抓住观众的眼球!


因此,今天小编想给大家推荐一款能够让你快速做出动态海报的工具 TouchDesigner!

相比其他工具,TD 能让你免去繁琐的工作流程,通过“连线”,就能轻松与不同的媒介产生互动,做出百变的动态效果。

本期文章,我们就用一张设计图,带大家用 TD , 4 步快速产出 N 张动态海报,一起来看看吧~

*小福利:转发文章,并截图,
添加底部小编,即可获得本次教程的工程文件。


首先准备好一张海报,分辨率不超过 1280 × 1280
本次教程小编就用下方这个海报来带大家操作~


我们先来简单认识一下界面!

打开 TouchDesigner 你会看到这个初始页面,这是系统自带的一个简单的展示。无需理会,在深色区域内找到一个空白区域即可开始你的创作。

有强迫症的朋友也可以删除它们。(单击小窗口-右键-点击最下方的 delete 即可删除。)


*如果你看到不一样的窗口,可以尝试单击它,滚动鼠标上的滚轮或者是按键盘上的 U 键 I 键来进出窗口。


1. 导入素材


知识点:Movie File In


现在我们有一个干净的操作区域啦!用鼠标双击深黑色区域,会出现一个小窗口。


放大给大家看看

对于小白来说可能已经眼花缭乱了,不过没关系,本次先带大家了解一下我们想做的效果需要用到的操作。

这是系统默认显示的 TOP 元件的标签页,你可以看到这些紫色的都是属于 TOP 即 Texture Operator。每一个都是一个操作环节。


那如何将图片导入到我们的工作区呢?聪明的朋友可能已经看到了这里有一个 Movie File In 即“导入二维文件的控制器”。


单击一下,就会出现在你的工作区中。


看到这个香蕉了吗~ 这也是系统默认的图片之一。

选中这个香蕉后,你会看到右上角有一个对应的参数窗口。在左上角可以看到被选中的控制器的名称。

参数窗口的第一项就是 File,单击一下➕加号,就可以导入你的图片啦!(还可以导入视频噢!)



2. 制作生成动态效果


知识点:Noise


第二步就是创造出一个生成动态效果。

首先跟前面的步骤一样,在工作区双击鼠标打开 TOP 标签,找到 Noise。


单击 Noise 查看它的参数。分别把 Period、Hamonics 和 Exponent 设置为 2、0 和 0.5。


接着找到在 Noise 参数中的第二个标签 Transform,将👉 “absTime.seconds / 5 ”复制到 Translate 的 Rz 中。这一步操作是为了让 Noise 动起来!


Noise 动起来啦!



3. 制作更复杂的动效


知识点:Displace

接下来我们把这个动态做的再复杂好玩一些!

同样,在 TOP 标签下找到 Displace 放到工作区中。


好了,现在是本次操作中的第一次连接!

鼠标点击 Noise 右边的小缺口(输出口),一直拖住到右边的 Displace 的缺口上(输入口)。通过连线实现了第一次编程!把两个口都连上后,你看,视觉变得更有意思了~


接着再次添加一个新的 Displace。


把 Movie File In 连接到新的 Displace 的上面的口,再将第一个 Displace 连到下面的口上。

特效和字体就合起来啦~ 

咦?这个动态怎么怪怪的?

别担心!是因为它的参数还没调整~

在第二个 Displace 的参数中,根据上面图中的数字,分别修改 Source Midpoint,Displace Weight 和 Offset 的值。


作品就成型啦!!!



4. 最后一步,导出作品!


知识点:Movie File Out


那么最激动人心的时刻到了!就是导出你的动态海报~

这一步估计大家已经知道要怎么做了吧~打开 TOP 标签,找到 Movie File Out!和第二个 Displace 连起来!


诶?怎么什么都没有发生?


因为我们还没有按导出按钮,单击 Movie File out,查看它的参数。

在第二行中有一个 Video Codec, 你可以选择想要导出的视频格式。这里我选了 MP4 格式。

右边的➕加号又出现了,你可以选择文件导出到哪个文件夹中。


最后就是点击 Record 按钮啦!


重点:点击这个 Off 后会变成 On 说明它已经开始录制了。再次点击它,会变成 Off 并且结束录制。所以通过按 Record 按钮,你可以控制视频的长度。视频就已经在你的文件夹中咯!


我们的动态海报就大功告成啦!!!!!!这次操作只用了 4 个步骤就做出了动态海报,你可以尝试调试 Noise 和 Displace 的参数,会发现许多惊人的效果噢~

强大的 TD,随手一调又是一张新的动态海报!


欢迎大家把做完的作品发送到微博并@最毕设,分享给大家看看你的成果!如果大家喜欢这类小教程,点击在看告诉我们!



视觉创作者,
为什么适合用 TouchDesigner?

teamLab 前设计师,纽约大学 IDM 教授 Barak Chamo 说:

“TouchDesigner 的可视化编程环境,使得视觉设计师可以很容易地、快速地试验和测试新的想法,从而保持创造性。

比起其他我用过的工具,Touchdesigner 将节点的编程环境和快速切换语境(将图像转换为数据、将声音转换为 3D 形状、将控制器信号转换为着色器参数)的能力相结合,加上实时呈现无需渲染的编程环境,让“创意”变为可视化,为创作赋能。”

最毕设 helloup 特邀全球顶尖公司 teamLab 前设计师、
纽约大学 IDM 教授 Barak Chamo 合作开发课程整整一年。

如果你想让你学习创意编程,同时又为写代码而苦恼的话,
这将是你非常不错的选择,这是专门为视觉创作者打造的课程。(回顾👉 TouchDesigner 是什么?一个新世代的视觉设计工具


6月18日 23:59 前购买课程,
你将获得老师 Barak Chamo
亲自辅导的机会 
6月19日后购买视频自学课 
将不再赠送问答 


小福利:
转发文章至朋友圈并截图 
将截图发送至以下小编
即可获得工程文件


编辑:K7
审核:叶欣

未经授权 请勿转载(不免费授权)
欢迎投稿(有偿):media@zuibishe.com