动画图形

From Synfig Studio :: Documentation
Jump to: navigation, search
Languages Language: 

English • español • français • italiano • português • română • русский • 中文(中国大陆)‎

Warning!

This page contains outdated information.

The release of Synfig Studio 0.64.0 introduced new terminology and this translated page needs to be updated according to original English text.

You can help updating this page - see instructions here. Thank you!

warning end


Navigation Navigation:  <<手册

基本设定

在本教程中,我们将学习如何使用BLine来做一支生长的花。

Flower 0.png
启动 Synfig Stuido ——出现新的动画场景。如果您已经打开了 Synfig Studio,从工具箱中选择"文件 → 新建"

首先,我们需要创建以一个渐变用来作背景。在工具箱中,点击轮廓和填充颜色,选好渐变的颜色。您也可以点击工具箱上的渐变线,直接编辑渐变颜色。

选择渐变工具,在画布上垂直拖放光标,填充渐变到画布。

下一步,选择 BLine 工具并在工具选项面板上,确定只有"创建区域 BLine"选项被选中。在工具箱上,选择绿色为填充颜色。用 BLine 工具画出一个三角形。在画出三个顶点以后,要闭合图像时,右击在第一个顶点上并选择"关闭 BLine"即可。

现在,图形是闭合的,您可以点击任何其它的另一个工具或者按一下工具选项面板下方长得像齿轮的按钮来“创建”BLine 图像。

FlowerTutorialCanvas1.png

这个图形将是花茎的基础。您可以微调切线控制器(红色的点),让三角形变得圆滑些。用变换工具,在每一个顶点上右击,选择"分离切线",这样每个顶点的切线控制器都可以对立移动。至此,我们完成了基本设定。

FlowerTutorialCanvas2.png

动画花茎

在画布菜单,选择“编辑属性”。到时间标签,设定"结束时间""6s",然后按确定按钮。 点击时间轨迹的开端("0f"),然后,在关键帧面板(带有一个钥匙图标的那个)上点击“+”号按钮(添加一个新关键帧)。关键帧让我们定下场景:比如,在一个关键帧上,场景中每个元素都有被下来的自己的属性。在击时间轨迹,点击"4.5s"位置。按下画布右下角的绿色圆形按钮(取决于您用的图标主题,也可以能是其他样子的按钮),切换到动画编辑模式(圆形变成红色的了)。

用变换工具,选择绿芽,向上移动顶部的顶点,弄出个花茎来。如果有需要,您可以尝试调节顶点的控制器来完全图像。

FlowerTutorialCanvas3.png

仍然在"4.5s",在靠近花茎顶部的地方,右击其边缘,选择"插入项目(智能)"。然后在花茎的另一边也做同样的动作。右击这两新点,也是选择"分离切线"。然后试着把图像调的像图片中的样子,这就是花蕾。

FlowerTutorialCanvas4.png

现在,如果点击"2s" (假如),尽管花茎已经非常小了,尽管花蕾的ducks已经都看不见了,但您还能看到一些到花蕾的形状。

FlowerTutorialCanvas5.png

假设说我们只想在3.5s处看到花蕾,然后在4.5s处是长到最大。

在时间轨迹上点击 "3.5s"处。现在我们看看“参数”和“时间轨迹”两个面板。在参数面板上您会看到每个参数对应着时间轨迹面板上的一行。最后的参数是顶点清单。点击左边的小箭头打开这个清单。您应该看到类似这样的东西:

FlowerTutorialTimetrackParamsPanels6.png

每一个大的绿色点(或者是航点)坐落一个记录的值(在这里是被记录的,处于0f的关键帧和在4s处我们移动某些顶点或顶点控制器时顶点位置)。在做花蕾是我们添加的两个顶点被注上 "DYN"(动态)。在参数列表右击它们,选择“标记活跃点为关闭(mark activepoint as off)”。

面板应该看起来像这样的,灰色部分是花芽顶点不影响花茎的部分。

FlowerTutorial-7-WaypointsActivepointsOff.png

比如,如果现在点击"2s""3s",花芽图形不会出现的。只是在3.5s之后出现一点点。

然而,花茎形状在0到4s之间生长的时候,可能不是很好看。确保您仍在动画编辑模式,在多个时刻分别调整形状,直到您满意为止。

至此,花茎动画完成,但是还缺少花瓣。查看动画预示:到"文件 → 预示",确认,等待预示生成,查看。

预视通常是像素化,模糊不清的,但最终的渲染效果是很清晰的。质量更佳的预视通过在预视对话窗口的“变焦”和“每秒帧数”的值产生。
note end


添加花瓣

现在,点击画布右下角的红色圆圈按钮,离开 "动画编辑模式"

改变填充色为粉红色,用 BLine 工具画一瓣花瓣。您会看到可以让人方便移动的绿色 Duck 处在画布的中心。CtrlA选择所有的花瓣顶点,用变换工具移动它们,靠近绿色的 Duck,如图示。

FlowerTutorial-8.png

之后,拖动绿色的 Duck 使之非常靠近花蕾的顶部。CtrlA,再次选上花瓣的所有顶点,用旋转工具调整。此外,在层面板,选择花瓣层,把它放到花茎层之下。点击花茎以选择它,Ctrl加点击花茎。两者都被选中。

点击花茎顶部的顶点,按下Ctrl 在花瓣的绿色 Duck 上点击(两个都会变得更亮的颜色,表示都被选中)。然后右键点击在花茎的顶部的顶点上,选择"链接"。花瓣会稍微移动,因为绿色 Duck 吸附到花茎的顶点上了。

FlowerTutorial-9.png

现在,在花瓣和花茎的顶部之间有个链接,当花茎的顶部移动时,花瓣也会跟随。(当然,如果花瓣的绿色 Duck 移动,花茎的顶部也会移动,此时此地,我们不想要这个。)

现在,在花瓣和花茎的顶部之间有个链接,当花茎的顶部移动时,花瓣也会跟随。(当然,如果花瓣的绿色 Duck 移动,花茎的顶部也会移动,此时此地,我们不想要这个。)

在层面板,选择最新创建的层,并且复制(通过面板底部的第三个按钮)。在画布上,按下CtrlA选择复制的花瓣的全部顶点,稍微移动一下,让花瓣不会彼此重合。(不要移动绿色的 Duck,移动橙色的那些)。多次重复这个方法,直到达到类似下图的效果。

FlowerTutorial-10.png


注意,复制到的几个花瓣也都是链接到花茎上的。如果您回到第一个关键帧,会看到这些花瓣都是可见的。我们不想这样。我们希望花瓣仅在快要接近成长的末尾才出现。

隐藏花瓣

假如我们想让花瓣在4秒之后开始出现一点,在5秒时完全出现,而非在整个动画都能看见,都是一样的尺寸。

点击画布右下角的绿色圆点,再次切换到"动画编辑模式"”。但是如果我们到"4s",编辑,那么这个改动也会改掉"5s"上的。这是因为在任意航点或关键帧的时刻,花瓣的图形/位置不是固定的。这也就是说{Literal|5s}}上,我们需要一个关键帧。在时间轨迹上,点击,把光标放在5秒处。在“关键帧面板”上,点击“+”,添加一个新的关键帧。

现在,在 "4s"处点击,在层面板,选择所有的花瓣层(用Ctrl + 点击),然后按下CtrlA选择所有的花瓣顶点。用变形工具缩小,移动,把它们隐藏到花蕾中,如图示。

FlowerTutorial-11.png

从4s到5s,花瓣会出现并开放。但是要注意,我们在0s也会有个记住花瓣图形的关键帧。这会产生问题——花瓣从第一个关键帧到4s的关键帧之间一直都是能被看到的。我们既可以把花瓣弄得更小,藏起来。在0s到4s直接调整它们每一帧的大小,我们也可以让它们在这个间隔中不可见。

我们选择第二种解决方法。为了使事情更容易,我们要把花瓣层封装成一个内联画布。在选上所有的花瓣层后,在层面板右击,选择封装。您可以重命名这些层,以便更容易理解。

FlowerTutorial-12.png

选择“花瓣”内联画布,并跳到第一个关键帧。在属性标记版面,设定“数量”值为“0”。花瓣现在在这个帧上开不见了。注意两个航点被加到“数量”参数前,一个在0s,另一个在5s。拖动5s的航点至4s,这样4s是,花瓣的不透明度是1。

FlowerTutorial-13.png

还是有个问题没解决:从0s到4s,花瓣的不透明度是逐渐增加的,使得花瓣应该不可见时变得可见。为了解决这个问题,我们将改变数量属性的插值方法。在0f,右击数量航点,选择"编辑"。在出现的新对话框中,您可以选择入和出的插值。设定出插值法为"恒定"

FlowerTutorial-14.png

提示

在航点上右击选择"出 → 恒定"改变出插值法。
note end

这样意味着在航点之后,数量值变成恒定的,直到遇见另一航点。因此,从0f到4s,数量的值将等于0,在4s时,它突然变为1,所以花瓣如我们所愿变为可见。另外,我们可以在4s处的航点设定其入插值法为"恒定"达到同样的效果。

注意(半个)航点从绿色的圆(表示数量属性的平滑动画)变为红色梯阶(表示数量属性是突然跳步的)。

完成了。花茎用了4.5秒生长,然后停止1.5秒。直到4s,花瓣是隐藏的,在4到5秒之间快速生长,然后停留1秒,动画结束。 点击"文件 → 渲染",渲染您的动画。选择您要的格式,并确保"使用当前帧"选项没有被选上(否则,只渲染当前的一个帧)。


Languages Language: 

English • español • français • italiano • português • română • русский • 中文(中国大陆)‎