此文发表于UIST 2018，作者来自Princeton University和Autodesk Research以及University of Toronto

ABSTRACT

我们基于简单的基于草图的标记，提供了一种交互式工具来对静态图片的视觉元素进行动画处理。尽管动画图像增强了网站，信息图表，徽标，电子书和社交媒体的功能，但是从静止图片创建此类动画对于新手来说还是困难的，对专家而言则是乏味的。由于对象分割，相对深度排序和不存在的时间信息模棱两可，因此创建自动工具具有挑战性。通过使用一些用户绘制的涂鸦作为输入，我们的混合主动式创意界面可以提取图像中的重复纹理元素，并支持对其进行动画处理。我们的系统还促进了多层的创建，以增强动画中的深度提示。最后，在分割过程中分析图稿之后，几个动画过程会自动生成与源图像时空相关的动力学纹理[27]。我们的结果以及来自用户评估的反馈表明，我们的系统有效地使插图画家和动画师能够以多种视觉样式为静止图像增添生气。

Author Keywords：Kinetic textures; animation; dynamics; pictures.

INTRODUCTION

动态绘图和电影摄影正变得越来越流行，以生动的环境纹理和元素描绘场景。儿童书籍，徽标，信息图表，电子贺卡，学术论文[21]和社交媒体上的gif图像利用动画元素来增强其吸引力。在所有这些示例中，艺术家精心设置了动画的时间和空间方面，以匹配他们的视觉。此外，最终的动画视频在嵌入最终应用程序后应无缝循环播放，以提供令人愉悦的体验。传统上，此类动画是根据分层图像[27、43]或视频[19、33、38、45、48]生成的。但是，一种引导艺术家视线的方法是使动画类似于静态图像。虽然通常可以想象静态图片中的动态，但是将静态光栅图像转换为动画图像却具有挑战性[15]。该困难主要是由于缺乏动画所必需的语义对象和深度信息。此外，未针对对应的动画框架可能必需的特定动画数据结构（i.e., rigging [25], vector graphics [27], meshes [23, 28,51], hierarchy）优化图像。他们还缺乏时间信息，而有关对象应如何移动的决定通常取决于艺术直觉或讲故事的目标。

图片中的常见现象是重复出现相似的元素。它们可以采取落雪，下雨，落叶或飞鸟，昆虫和气球的形式。艺术家还可以在水中冒出气泡，在礁石中游动的鱼群或在空中飘扬的音符。这样的重复元素在绘制的图片和照片中非常丰富，其中相似但略有变化的对象分布在整个图像上。与以前的动画系统[27]允许艺术家从头开始创建动画纹理不同，我们从类似于最终输出的静态图像开始。从静态图像手动进行动画处理既繁琐又容易出错，因为必须提取所有此类元素（使用GrabCut [39]算法或商用工具，例如Photoshop [3]），并随着时间的推移保留其空间排列。此外，重复对象的存在可以提供有关关联动画的动态的重要线索。

我们使用一些高级引导笔触，从输入的栅格图像（图1a）创建动画图片变得容易。首先，我们的混合主动界面允许用户分解场景中的重复元素。在此步骤中，一旦用户圈出了对象的子集（图1b），我们的系统就会自动在图像中找到相似的对象并将其提取到单独的图层中。其次，我们允许提取多个图层，并允许用户指导这些图层的深度排序。第三，从用户引导的运动路径和提取的对象中，我们的优化步骤生成了动态纹理[27]，该纹理与源图像中的元素在时空上是一致的（图1c）。我们分析源场景的语义以生成必要的成分，并优化动力学纹理的参数以大致保留元素随时间变化的空间排列，密度和比例。最后，我们无缝循环生成的动画。我们的贡献是提供了一个新的混合主动接口，该接口综合了现有的图像处理算法和新的动画优化算法并将其扩展到一个基于交互式草图的系统中，以对静态图像进行动画处理。正如我们将演示的那样，我们的算法和UI适用于各种视觉样式（即绘画，卡通，插图，照片，信息图表），这使其适用于各种应用领域和场景。

为了验证我们的系统，我们与六名参与者进行了一系列观察反馈会议。我们的结果表明了我们系统的潜力，指出了未来的工作领域，并表明即使是初次使用的用户也可以在短时间内制作静态图片的动画-对于新手来说，这对于新手来说是一件困难的事情，而对于使用状态信息的专家来说，则是乏味的工作美术工具。

RELATED WORK

本节回顾了从图像和视频创建动画以及查找用于高级图像编辑的纹理元素的先前工作。
Draco：我们的系统的输出与Kazi等人的Draco [27]最相似，因为我们的系统利用Sketchbook Motion iPad应用[8]（Autodesk在Draco上的实现）作为渲染器。但是，我们介绍了一些进步之处。我们的方法为单个预先存在的静态图像设置动画，而Draco要求用户从头开始绘制动画的每个部分。从现有图像开始，使绘画技能有限的用户可以设计美观的动画。 Draco还要求用户操纵所有动画参数以获得最终结果。相比之下，我们的系统会根据用户定义的涂鸦和下面的图片自动计算发射线，发射频率和比例。最后，我们介绍一种自动循环生成的动画的方法。

从单个图层进行动画处理：从单个图像进行动画处理始于简单的变形[34]或添加了多种模式来模拟运动[20]。霍里等通过分离前景和背景并向其添加简单的3D建模来模拟深度[22]。与我们的目标最紧密相关的工作是Chuang等人在图片中添加了运动纹理[15]。它们的界面可帮助用户分离动画区域，例如树木，水，船和云。使用随时间变化的位移贴图，它们可以对分离的区域进行动画处理，从而产生诸如摇摆，涟漪，摆动和平移等效果。但是，他们的方法不会提取一个对象的多个实例（即查找所有船只）。我们的系统可以提取与Chuang等人相同的对象，并协助提取图像中的相似对象（即多朵云，船）。对于动画，庄（Chuang）等人的置换贴图产生的动画数量有限。我们的动画处理通过专注于动态纹理[27]而非随机运动纹理来补充其工作，并在指定动画参数时通过利用原始图像元素的属性来扩展其工作。

基于草图的动画工具：研究人员探索了各种方法，可以使用运动草图[17]和直接操纵[23，49，50]技术来简化动画创作。但是，在这种情况下，必须从头开始绘制要动画的视觉元素[7]，或者已经将其作为矢量图形[27]，栅格图形[2]或网格[10、28]存储在单独的图层上。我们输入的单个静态图像缺少单独的图层和数据结构信息，因此需要一种新技术对其进行动画处理。

视频中的动画：使用视频作为动画创建的输入可提供静态图像缺少的信息。例如，视频对时间信息进行编码，以提供运动示例并通过遮挡显示背景图层。刘等描述了如何夸张视频中的运动以用于可视化和其他目的[35]。视频纹理允许原始帧的连续循环，这样就不会重复序列[41]。电影胶片可以扩展视频纹理，但可以集中精力对图像的特定部分进行动画处理[9，48]。廖等探索通过用户控制结果动态性来创建循环视频[33]。片段虽然没有循环，但可以更好地控制视频的空间和时间部分[26]。 Su等将视频变形传输到单独的单个图像[44]。尽管这些技术产生了令人瞩目的效果，但我们专注于使用单个图像（不存在时间信息）作为动画的输入。

查找纹理元素：图像分割[42]方法通常用于从图像中提取对象或纹理元素。当提取单个对象时，GrabCut可与用户定义的前景和背景标记一起很好地工作[39]。计算机视觉界已经研究了在图片中发现重复元素的问题[4，14，29,31，40]。在此工作中，Cheng等人的RepFinder系统[14]最适合我们的问题。 RepFinder [14]将GrabCut概念扩展到模板匹配[32]的多个相似对象的位置。但是，我们对相似对象的定义包括变形和非规则变化，而RepFinder仅识别颜色，位置，方向和比例变化的对象。当处理图片以外的艺术品和绘画时，这种区别尤为重要。我们用于查找纹理元素的方法利用并增强了GrabCut的功能，可将简单的用户输入标记处理为信息量更大的遮罩以进行输入。一旦找到了示例性的纹理元素，研究人员便提出了一些方法来表征如何合成或在实践中使用具有相似统计数据的新纹理[5，6，30，36，37，46]。

ANIMATING STATIC PICTURES: CHALLENGES

在给定静态图像作为输入的情况下，不一定存在到对应动画的显式一对一映射。也就是说，对于静态图像的“动画”版本可能是什么样，可能会有许多合理的解释。我们系统的目标是为动画师提供创建类似于原始图像但不一定与原始图像完全匹配的动画的工具。在某些情况下，作者可能希望生成一个动画，其原始图像与最终动画帧的随机子集无法区分。但是，在其他情况下，作者可能需要更多的创作自由，从而导致与源图像的差异。在开发有助于实现这两个互补目标的系统时，要克服许多挑战。

深度模糊性：一项挑战是从单个图像确定深度顺序。我们如何知道小物体是否比图像中的其他物体更远或更小？例如，图1中的气球可能对其深度排序有多种可能的解释。不同大小的气球可以位于单独的图层上，每一个较小的气球都比较大的气球落后/远离。此外，由于图像中的遮挡线索，气球最小的图层将在城堡后面飞行。在不同的解释中，气球还可能从左下角靠近用户的位置飞行，然后再行进更远并穿过城堡，因此变得更小。

时间模糊性：将图像分成几层后，在尝试对图像进行动画处理以使其与原始图像相似时，会遇到更多的挑战，例如缺少时间信息。例如，图1中的气球是否从左下角到右上角直线移动？还是它们沿该过程弯曲，摆动和旋转？此外，图像无法提供物体速度的线索。所有的气球都在图像上缓慢移动吗？还是较大的气球移动得更快？

循环播放：另一个挑战是希望最终的动画视频无缝循环播放，场景中的所有动画元素都在开始和结束时匹配。以前用于循环播放视频的技术（例如[9、26、33、41]）依赖于对自然图像纹理元素进行变形和混合，对于许多我们在视觉上与众不同的手绘元素而言，效果并不理想例子。

总体而言，这种歧义促使我们采取混合行动解决我们的问题。尽管可以做出某些推断，但我们不能指望算法能够完全自动运行，因为可以通过多种方式从静止图像解释动画。例如，用户应该能够指定如何将对象分成几层，或者调整其运动路径和速度。为用户提供允许他们指定所有这些约束的UI本身就是一个挑战。一般而言，将用户输入与自动算法结合在一起将使艺术家可以自由选择最适合其艺术视野的原始静止图像的解释。

SYSTEM OVERVIEW

我们的系统允许用户将静态图像作为输入，并使用高级手势为对象设置动画，以创建与原始图像相似的预期动画。我们依靠混合启动方法，将自动匹配的图像处理算法的功能与简单的交互式工具相结合，以迭代或指导结果。首先，在用户注释的示例的指导下，我们的系统有效地检测并从图像中提取相似外观的元素。一旦将元素，前景和背景分成几层，用户就可以将它们重新排列为所需的深度和遮挡效果顺序（图2）。对图像进行动画处理时，我们使用原始图像中的数据来调整动画参数。

Extracting Repeating Objects

我们的系统针对具有多个应设置动画对象实例的图像。例如，可能有大小和颜色不同的气球（图1），大小不同的灯笼（图3），鳄梨片（图14），蝴蝶和雨滴（图15a，e）。由于重复对象的种类繁多，并且在单个图像中它们之间可能存在差异，因此我们选择一种迭代的交互式方法。我们允许用户快速选择用于动画的那些对象的子集。从这些示例对象中，我们在图像的其余部分中搜索相似的对象，以将其从背景中删除。在每个步骤中，我们都为用户提供交互式工具，以完善我们的自动结果。最后，我们修补背景[12]，并返回两个新层：一个是透明的，仅包含示例对象，另一个是完整的背景，并删除了所有选定对象。

Depth Ordering with Layers

尽管此新背景将删除所有动画对象，但用户可能希望将其他区域分为其他区域。例如，丘陵（图1），人（图3），筷子（图14），发动机零件或树木（图15b，d）可能位于中间层，并且前后都有动画对象。在这种情况下，我们允许用户补充我们的自动分区算法，以选择要提取图像的确切部分。我们为用户提供了一个透明层，其中包含中间地面对象和一个已修复背景（图2）。这些层使用户可以对中间地面对象进行动画处理，而动画中不会出现孔洞。有了这些新图层以及重新排列其顺序的能力，用户便可以弄清源图像中存在的任何深度顺序歧义。

Animation Optimization

我们为用户提供了添加动态纹理动画框架的所有动态元素的能力[27]。通过用户绘制的运动线，我们利用原始图像中元素的位置来自动创建发射器路径，该发射器路径以定义的频率和速度生成粒子。我们控制发射频率以匹配静态物体的密度源图像。在某些情况下，发射对象可能沿其路径缩放（图12）或可能在不同的层上传播（图2）。我们提供自动方法来设置这些属性。我们还介绍了一种创建无缝循环动画的方法，同时保留了场景中所有对象的时间一致性。

USER INTERFACE

我们设计和开发了一个交互式系统，允许用户为现有的静态图片制作动画。我们的系统被实现为Autodesk Sketchbook Motion iPad应用程序[8]中的插件，并借鉴了其一些现有的UI元素。该界面具有一个主画布，图层面板，全局和上下文工具栏（图3）。典型的工作流程始于用户导入图像并将图像分解为动画和背景对象层。最后，用户将动画效果添加到图层并导出循环的动画视频。我们在下面详细说明工作流程。

Layer Panel

我们使用SketchBook Motion的未修改图层面板，该面板与其他图形编辑工具[8]相似。我们的每个分解和分离过程都会创建一个临时层，用于存储画笔标记和结果。每个画笔都会创建一个新图层，该图层将转换为黑色（背景）和白色（画笔标记）蒙版，作为我们算法的输入，在下一节中将进行介绍。在每个过程之后，我们清除临时层并将其替换为最终层。用户还可以手动添加，删除和复制图层。

Segmenting Objects to be Animated

如上一节所述，第一个挑战是从背景中提取要设置动画的元素。我们的UI指导用户完成以下三个步骤：（1）查找要动画的示例对象，（2）在场景中搜索相似的对象，以及（3）修补背景。

对于步骤1，我们将示例对象提取到单独的图层上。首先，使用“圆形对象”画笔（图4a）围绕用户稍后将为其设置动画的所有对象绘制圆形（图5a）。可以将对象分别圈起来（图1b）或一起圈出（图5a）。接下来，我们的算法将圈出的对象分离到自己的图层上（图5b）。用户说明每个圆圈中的哪些像素属于示例对象（“前景”画笔），哪些属于背景（“背景”画笔）。

在步骤2中，我们在图像的其余部分中搜索相似的重复对象（图5c）。我们确信与以前圈出的对象相似的对象以实心深粉红色显示。对于浅粉红色突出显示的对象，我们信心不足。用户可以使用“智能对象选择”画笔（图4b）将要修补的深粉红色替换为浅粉红色区域（图5d，e）。

最后，在第3步中，我们修补了所有先前标记的深粉红色区域（图5f）。用户可以使用“ Inpaint area”笔刷删除更多区域（图4c）。完成后，将创建仅包含示例对象的透明层和具有内嵌背景的层。

Depth Ordering

对于深度效果，用户可能希望将图像的其他部分提取到单独的图层中。在进入单独的图层菜单之前，我们会自动尝试从背景中提取前景。用“前景”和“背景”画笔细化结果后，“分离图层”按钮重新运行我们的分离算法（图4d）。完成后，我们将提取的前景先前覆盖的区域修复。临时层被删除，并创建了两个新层，一个只有前景色的透明层，另一层是已修复背景的层。

Animation

进行动画制作时，用户可以使用Sketchbook Motion的现有界面[8]添加动态或振荡纹理。对于动态纹理，用户绘制一条或多条运动路径线，如图4e中的“风”按钮所示。绘制每条线之后，我们自动创建一个发射器-一条以定义的频率和速度生成粒子的路径（图6a）。我们还允许用户手动创建发射器。用户可以选择将发射保持在固定的密度，我们尝试匹配初始图像中对象的密度（图6b），或者他们可以手动设置发射频率和速度。如果原始图像中存在不同比例的对象，则用户可以沿运动路径缩放对象（图6c）或将对象分为两层或三层。

SYSTEM IMPLEMENTATION

我们的系统是在iPad上实现的，使用OpenCV [13]和Image Stack [1]进行图像处理，使用GrabCut [39]进行图层提取，使用PatchMatch [11]进行修补。假设先前提取重复对象的工作[14、29]可以在iPad上交互运行，则这两种方法都可以替换管道层提取组件中的GrabCut [39]。