将影院级拍摄效果引入网络应用 >> 幽幽天空设计欣赏网页设计原创作品

　　Web 动画和交互式 web 游戏可帮助您创建令人沉醉的环境，吸引网站上的观众，这是一切 web 通信策略的目标所在。
尽管面向用户的工具使 web 用户的体验有了巨大改善，但是很难找到真正能够吸引各类用户的娱乐性动画和 web 游戏。
上个世纪，著名电影评论家 André Bazin 使用"临场"一词来描述观众在观看移动图像时的感觉，似乎将他们带到了同一空间和时间。这就是我们在制作 web 娱乐内容时应当追求的东西，让观众在通过不同的时空时欣赏到电影效果，实时通道已变得无关紧要。
电影与 web 导演之间的一个重要区别是摄像机。对电影导演来说，摄像机是他们用来描绘故事情节和将观众带进其虚构世界的画笔，从而创造 Bazin 谈到的临场感觉。传统动画导演也是如此，他们在制作和合成每一帧动画电影时也随意使用摄像机效果（并付出巨大开销）。
由于 Macromedia Flash 动画画面上 Toon Boom Studio 的出现，web 导演可以获得与电影制片人相同的功能。他们可以手拿虚拟摄像机为动画 web 电影和游戏制作电影情节。现在，运用 Macromedia Flash MX 和 Toon Boom Studio Importer (TBSi)，web 动画和游戏导演可以开发将 web 娱乐提升到更高层次的电影摄像机效果。
我们利用 Toon Boom Studio 开发人物、道具和电影情节，利用 Macromedia Flash MX 添加文本、对话框和将电影合成在一起的脚本，为"Shadow 拯救世界"制作了交互式演示内容。在本指南中，我们将向您介绍我们是如何利用这两种工具开发内容的。
在"Shadow 拯救世界"游戏中，有三个画面。前两个画面营造吸引用户参加游戏的上下文环境。在这两个画面中，摄像技巧帮助营造了游戏人物和用户（将接管 Shadow 的角色）的紧张与焦虑感。
在本指南中，我们将分析 Jane 和 Shadow 之间的对话画面。我们将为您提供预绘制的动画情节，以便您能将注意力集中在摄像机上。
要完成此指南，您需要以下工具：
Toon Boom Studio 试用版*
适用于 V2 的 Toon Boom Studio Importer 插件*
处理 V2 动画材料需要更新
源文件
指南工作文件

tbstudio_roughs.zip(1.4 MB, 英文元件)
只包括您将处理的镜头
最终文件 (8.5 MB, 英文元件)
设置舞台
在导演拍摄电影画面之前，他们必须设定人物和道具，以便摄像机在最佳灯光条件下捕捉他们。Toon Boom Studio 的三维舞台能使 web 导演设计他们的画面布局，就象电影导演在舞台上编排各个要素一样。
在 Toon Boom Studio ShadowDialog 动画文件中，我们打包了预绘制的动画元件，您可以使用它们来体验不同的舞台场景和摄像机移动效果。掌握了在三维舞台上进行元件布局和制作电影的技术之后，您可以随意体验不同的布局策略。您甚至能够拖动您自己的人物和道具，使他们具有动画效果，并将他们添加到画面中。
我们从 Jane 向 Shadow 谈及其烦恼的镜头开始。
步骤：
启动 Toon Boom Studio V2。打开 ShadowDialog_Rough.tbp 动画集。Toon Boom Studio 以制图模式打开。
在制图模式下，拖动或导入您的所有媒体，并建立动画元件的定时。（传统动画将进行画面定时的工具称作 Exposure Sheet 或 Dope Sheet。据推测，"dope"来自于"dosage"的想法，如每个制图将在 Dope 中显示为多少帧？）。我们已经绘制并定时了所有动画情节，现在您可以转移到 Sceneplanning 模式。
选择 View > Sceneplanning Mode 以切换到三维 sceneplanning 舞台。注意摄像机视图、俯视图和侧视图窗口。与三维程序中的视口一样，这些窗口从不同的角度显示您的画面。在俯视图和侧视图窗口中，线条表示画面中的元件层，比如从顶端或侧面观看某个动画单元。
查看屏幕镜头（将在新窗口中打开）

现在，您可以将 Shadow 放在 Jane 前面，将背景图像放在摄像机帧的右边，将 Jane 放在背景和 Shadow 之间的左边，使画面活动起来。
在时间轴中选择 Shadow 元件，然后选择"选择"工具 (Tools > Select)。
在俯视图窗口中，向下拖动 Shadow 元件层（由窗口中高亮显示的绿色线条表示），使之更接近摄像机的顶端。
在移动他时，您会注意到"属性"窗口中的"偏移"值在改变。您可以使用以下更具体的值：.35 N、3.62 E、8.83 F。
接下来，我们将在 Shadow 和背景图像之间移动 Jane。
在时间轴中单击 Jane Peg 层。我们使用了一个栓钉将 Jane 的元件层组合在一起，因此您可以同时移动她的所有层。在指南的下一节中，您将了解到栓钉的更多信息。
在俯视图窗口中，使用"选择"工具向下拖动 Jane Peg 元件，使之更接近摄像机顶端，但离 Shadow 有一段距离，而且在摄像机帧画面的左边。要移动栓钉和附加到它的所有层，可拖动表示栓钉的红色圆圈。
您会注意到，在向前拖动 Jane Peg 时，她会在摄像机视图窗口中变大。这是因为当您将他们移近或远离摄像机时，Toon Boom Studio 会自动重新计算元件的大小。
保存您的动画。
现在，您可以创建摄像机移动了。

既然已经安排好演员布局，现在您可以设计"动画摄像机"镜头了。
作为 Disney 公司（也是第一个节目表的诞生地）的一项创新，在传统动画中，一个沿轨道滑动的支架连接到动画摄像机，使导演能够来回调整他们的动画级别，给观看体验添加深度。
在 Toon Boom Studio 中，您也可以创建动画镜头，而无需特殊的昂贵设备或经过专门培训的摄像人员。而且，在您对准或移开摄像机时，Toon Boom Studio 会自动在您的元件层中根据对象离摄像机的位置重新调整对象的大小，就象使用真的摄像机一样。
要将您的观众拖入画面，可在 Jane 与 Shadow 说话时将摄像机对准她。您将从 Shadow 的肩膀上移动摄像机，以更近地对准 Jane。
对于您在 Toon Boom Studio 中创建的所有更改，您将使用"栓钉"，与 Macromedia Flash 中的辅助线相似。栓钉能让您创建通过所有三维空间的动画路径（启用多维功能），更改附加到它们的元件的大小或旋转角度。

1、在"时间轴"窗口中，单击"添加栓钉"按钮。"时间轴"窗口中会出现一个新的栓钉元件。
2、单击紧靠新栓钉的"显示/隐藏"按钮，以便在所有"视图"窗口中显示它。
3、将栓钉跟踪条的边缘向右拖动，以便将其持续时间扩展到 30 帧。
4、在"时间轴"窗口中，选择"动态摄像机"元件，并在您刚刚添加的"栓钉"元件上拖动它。通过在栓钉上拖动摄像机，您可以将两个元件连接起来，以便摄像机沿栓钉的路径拍摄。

5、选择您在"时间轴"窗口中添加的"栓钉"元件，然后切换到"移动"工具 (Tools > Motion)。使用"移动"工具为栓钉创建移动路径。
6、在"俯视图"窗口中，按键盘上的 X 键以放大该窗口，然后向后及稍左一点拖动栓钉的最后一个关键帧。当选择最后一个关键帧时，您会在"属性"窗口的"移动点"选项卡中看到其"偏移"值。我们使用的"偏移"值为：1.78 N、2.32 W、1.75 B。
7、您可能必须再次调整 Jane 的位置，以确保她仍在摄像机帧中。在"俯视图"窗口中，按键盘上的 X 键以放大接近 Jane Peg 元件，并使用"选择"工具移动该栓钉，因此她的身体仍在摄像机帧中，在"摄像机视图"窗口中观看最佳。
8、在"交互式播放"工具栏上单击"播放"按钮（或按默认的快捷键 [P]），以播放该镜头。您可以看到 Jane 说话时的镜头有多酷！
9、保存您的动画。
现在，您可以将您的动画导入 Macromedia Flash MX 以添加对话框、对话以及使之协同工作的脚本。

注意：在每个画面中，我们添加了不同的"摄像机"，因此您可以看到不同取景的画面。要观看这些摄像机看到的画面，可从"摄像机"下拉列表中选择它们的名字，或在"时间轴"窗口中选择它们的名字。

　　　　您已使用 Toon Boom Studio 制作了电影内容，现在可以切换到 Macromedia Flash MX 来添加文本和交互。
　　Toon Boom Technologies 和 Macromedia 通过 Toon Boom Studio Importer 插件 (TBSi for Macromedia Flash MX) 在两家公司的程序之间架起了一个桥梁。TBSi 能使您全面控制导入过程。运用 TBSi，您可以：

选择您要导入的画面、元件（图层）和帧。
确定如何导入声音。您可以选择让 TBSi 用您添加的效果编辑声音（以确保同步），也可以选择根本不导入声音。
保留动画的图层顺序，或将多个图层折叠为一个图层，以便在三维画面计划空间中保存更改其前后相对位置的元件的效果。

除了提供专家控制之外，TBSi 还能在 Macromedia Flash MX 中以逻辑形式将您的内容组织如下：

导入 Macromedia Flash MX 的图层保留元件名称。
您的所有动画内容（声音、位图和图纸）均在您的符号库中自动组织，因此您可以充分利用您的内容。
它将声音放在它们自己的层中。

现在您已知道 TBSi 为什么如此有用，接下来我们将您的 Toon Boom Studio 电影导入 Macromedia Flash MX，并添加一些交互：

启动 Macromedia Flash MX 并打开 Shadow_Rough.fla。您会看到项目中已有几个画面。
打开画面 3，将我们处理过的画面导入现有的画面 3。
选择 File > Import，浏览到 ShadowDialog_Rough 项目文件夹位置，并选择 ShadowDialog_Rough.tbp，将打开"导入"对话框。

注意：如果没有看到"导入"对话框，则表明您可能没有支持 V2 的最新版本 TBSi。请从以下站点下载该插件的最新版本：http://www.toonboomstudio.com/product/tbsi_plugin.php

查看屏幕镜头（将在新窗口中打开）
从"画面"列表，选择画面 3，并导入所有元件和帧。
选择"保留图层"。尽管我们在该画面中使用了一个摄像机移动，但画面中没有元件层交换位置，因此我们可以保持画面的元件组织，不会丢失摄像机上的任何动画动作。
取消选定"创建新画面"，让 TBSi 给当前画面添加内容。
单击"确定"。TBSi 将把您的动画导入 Macromedia Flash MX。
TBSi 向画面的结尾处添加帧。如果发现有额外帧，可选中这些帧，并选择 Insert > Remove Frames（或按 Shift+F5 键）。
保存您的动画。

现在，您可以在下一节中添加脚本。

　　在对话框中播放文本和嘟嘟声的脚本由两个部分组成。
每个画面的顶端是一个"脚本"层。在"脚本"层中选择第一个帧，您会看到"动作"窗口中定义的几个变量。

行变量是一个字符串对象，定义讲话人所说（或发嘟嘟声）的文本。
讲话人变量定义讲话人（Jane 或 Shadow）。
以下"嘟嘟声"变量根据讲话人变量识别将要播放的声音文件。Jane 的嘟嘟声比 Shadow 高。

我们制作了一个在每个画面中播放文字的电影剪辑。电影剪辑脚本为：

将讲话人变量（讲话人的名字）写入对话框。
将讲话人的文本变量向上写入当前帧号码的值。
在讲话人文本中播放每个字符的相应"嘟嘟声"，除非有"空格"。

当然，我们也设计了其它界面元件，包括进到下一个画面及打开和关闭声音的按钮。
看一下我们开发的脚本。试验一下改变讲话人的文本。如果改变讲话人文本的长度，则可能必须改变画面（帧）的长度，帧长度与讲话人文本中的字符数长度相同。
当您准备就绪时，可将整个画面导出为 Macromedia Flash 6，并观看画面播放。

现在，制作类似电影的交互式 web 娱乐的讲解已经结束。针对本指南，我们分析了舞台上演和动画摄像机移动，但 Toon Boom Studio 还有其它更多功能，包括旋转（运用栓钉）及放大和缩小（更改可视区域）。我们希望这个小小的行程将启发您进一步探索 Toon Boom Studio 的摄像机和三维舞台的更多应用。
我们鼓励您挑选一些有关电影导演方面的书籍以获得灵感 - 可考虑以下两个建议来开始您的发现之旅。不要忘记背上您的摄像机！
逐镜头式电影导演：从概念到屏幕可视化*
Steven D. Katz
Focal Press
设置您的镜头*
Jeremy Vineyard 和 Jose Cruz
Michael Wiese Productions