一种手绘动画生成方法及其装置

摘要

本发明提供了一种手绘动画生成方法及其装置。所述方法包括：获取若干SVG格式图片；解析所述SVG格式图片并抽取所述SVG格式图片的图片路径；根据预定的重组规则，重新组合所述图片路径的顺序以生成手绘路径；基于所述手绘路径生成对应的手绘动画。该方法能够实现SVG图形中图片路径的提取操作，并据此生成对应的手绘动画，有效的简化手绘动画的制作过程和提高手绘动画的制作效率，方便的生成与SVG图形相对应的手绘动画。

权利要求

1.一种手绘动画生成方法，其特征在于，所述方法包括：获取若干SVG格式图片；

解析所述SVG格式图片并抽取所述SVG格式图片的图片路径；

根据预定的重组规则，重新组合所述图片路径的顺序以生成手绘路径；所述预定的重组规则为用户的绘画习惯；

基于所述手绘路径生成对应的手绘动画；

在所述手绘动画中截取若干动画图片；

基于所述动画图片，生成MP4格式视频或者GIF格式的动态图；

所述基于所述手绘路径生成对应的手绘动画，具体包括：在所述手绘路径上增加预设的绘画手势；所述绘画手势是预先设置或者保存好的，用以反映实际绘画过程中手的动作的手势图片；

使用手绘动画引擎，生成所述手绘动画；

所述手绘动画在播放过程中，图形依据所述手绘路径的顺序形成，添加的绘画手势则按照图层上的路径轨迹移动；

所述手绘动画引擎包括来画手势动画引擎，对外暴露方法的函数、公共工具、存储项目数据的表以及绘画控制。

2.根据权利要求1所述的方法，其特征在于，所述抽取所述SVG格式图片的图片路径，具体包括：通过正则匹配算法，抽取所述SVG格式图片的图片路径。

3.一种手绘动画生成装置，其特征在于，所述装置包括：加载模块，用于获取若干SVG格式图片；

解析模块，用于解析所述SVG格式图片并抽取所述SVG格式图片的图片路径；

重组模块，用于根据预定的重组规则，重新组合所述图片路径的顺序以生成手绘路径；

所述预定的重组规则为用户的绘画习惯；

手绘动画模块，用于基于所述手绘路径生成对应的手绘动画；

输出模块，用于在所述手绘动画中截取若干动画图片；以及基于所述动画图片，生成MP4格式视频或者GIF格式的动态图；

所述基于所述手绘路径生成对应的手绘动画，具体包括：在所述手绘路径上增加预设的绘画手势；所述绘画手势是预先设置或者保存好的，用以反映实际绘画过程中手的动作的手势图片；

使用手绘动画引擎，生成所述手绘动画；

所述手绘动画引擎包括来画手势动画引擎，对外暴露方法的函数、公共工具、存储项目数据的表以及绘画控制；

所述手绘动画在播放过程中，图形依据所述手绘路径的顺序形成，添加的绘画手势则按照图层上的路径轨迹移动。

4.根据权利要求3所述的装置，其特征在于，所述解析模块具体用于：通过正则匹配算法，抽取所述SVG格式图片的图片路径。

说明书

一种手绘动画生成方法及其装置

技术领域

[0001] 本发明涉及图像处理技术领域，特别涉及一种手绘动画生成方法及其装置。

背景技术

[0002] JPEG（Joint Photographic  Experts  GROUP）是由国际标准组织（ISO:International Standardization Organization）和国际电话电报咨询委员会（CCITT:
Consultation Commitee of the International Telephone and Telegraph）为静态图像所建立的第一个国际数字图像压缩标准，也是至今一直在使用的、应用最广的图像压缩标准。JPEG由于可以提供有损压缩，因此压缩比可以达到其他传统压缩算法无法比拟的程度。

[0003] 图像文件存储格式PNG，其设计目的是试图替代GIF和TIFF文件格式，同时增加一些GIF文件格式所不具备的特性。其名称来源于“可移植网络图形格式(Portable Network Graphic Format，PNG)” PNG用来存储灰度图像时，灰度图像的深度可多到16位，存储彩色图像时，彩色图像的深度可多到48位，并且还可存储多到16位的α通道数据。PNG使用从LZ77派生的无损数据压缩算法，一般应用于JAVA程序、网页或S60程序中，具有压缩比高，生成文件体积小的特点。

[0004] SVG（Scalable Vector Graphics可伸缩矢量图形）是一种用XML定义的语言，用来描述二维矢量及矢量/栅格图形。SVG提供了3种类型的图形对象：矢量图形（vectorgraphicshape例如：由直线和曲线组成的路径）、图象(image)、文本(text)。图形对象还可进行分组、添加样式 、变换、组合等操作，特征集包括嵌套变换
（nestedtransformations）、剪切路径（clippingpaths）、alpha蒙板（alphamasks）、滤镜效果（filtereffects）、模板对象（templateobjects）和其它扩展（extensibility）。

[0005] SVG图形是可交互的和动态的，可以在SVG图形中嵌入动画元素或通过脚本来定义动画。它具有目前网络上流行的GIF和JPEG格式无法具备的优势。例如，可以任意放大图形显示，但不会牺牲图像质量或者也可以在SVG图形中保留可编辑和可搜寻的状态。另外，一般而言SVG文件与JPEG和GIF格式文件相比，数据量也要小很多，下载速度较快。随着技术的不断成熟和开发，SVG将会为Web提供一些新的图像标准。

[0006] 可以看出，SVG图形中实际上保存有图片路径。但在现有的应用过程中，并未过多的涉及到SVG图形中的图片路径的利用或者识别。另外，对于手绘动画的制作，通常是采用手工在动画或者视频制作软件中制作完成，效率有待提高。

[0007] 因此，现有技术还有待发展。

发明内容

[0008] 本发明实施方式旨在提供一种手绘动画生成方法及其装置，其目的旨在解决现有技术中对于SVG图形的图片路径利用不足，手绘动画制作成本高的问题。

[0009] 为解决上述技术问题，本发明实施方式采用的一个技术方案是提供一种手绘动画生成方法。所述方法包括：获取若干SVG格式图片；解析所述SVG格式图片并抽取所述SVG格式图片的图片路径；根据预定的重组规则，重新组合所述图片路径的顺序以生成手绘路径；基于所述手绘路径生成对应的手绘动画。

[0010] 所述的方法，其中，在所述基于所述手绘路径生成对应的手绘动画之后，所述方法还包括：

[0011] 在所述手绘动画中截取若干动画图片；

[0012] 基于所述动画图片，生成MP4格式视频或者GIF格式的动态图。

[0013] 所述的方法，其中，所述预定的重组规则为用户的绘画习惯。

[0014] 所述的方法，其中，所述抽取所述SVG格式图片的图片路径，具体包括：通过正则匹配算法，抽取所述SVG格式图片的图片路径。

[0015] 所述的方法，其中，所述基于所述手绘路径生成对应的手绘动画，具体包括：在所述手绘路径上增加预设的绘画手势；使用手绘绘画引擎，生成所述手绘动画。

[0016] 为解决上述技术问题，本发明实施方式采用的另一个技术方案是提供一种手绘动画生成装置。所述装置包括：加载模块，用于获取若干SVG格式图片；解析模块，用于解析所述SVG格式图片并抽取所述SVG格式图片的图片路径；重组模块，用于根据预定的重组规则，重新组合所述图片路径的顺序以生成手绘路径；手绘动画模块，用于基于所述手绘路径生成对应的手绘动画。

[0017] 所述的装置，其中，所述装置还包括：

[0018] 输出模块，用于在所述手绘动画中截取若干动画图片；以及基于所述动画图片，生成MP4格式视频或者GIF格式的动态图。

[0019] 所述的装置，其中，所述预定的重组规则为用户的绘画习惯。

[0020] 所述的装置，其中，所述解析模块具体用于：通过正则匹配算法，抽取所述SVG格式图片的图片路径。

[0021] 所述的装置，其中，所述手绘动画模块具体用于：在所述手绘路径上增加预设的绘画手势；并且使用手绘绘画引擎，生成所述手绘动画。

[0022] 本发明实施方式的有益效果是：区别于现有技术，本发明提供的一种手绘动画生成方法及其装置，能够实现SVG图形中图片路径的提取操作，并据此生成对应的手绘动画，有效的简化手绘动画的制作过程和提高手绘动画的制作效率，方便的生成与SVG图形相对应的手绘动画。

附图说明

[0023] 图1是本发明实施例提供的手绘动画生成方法的方法流程图；

[0024] 图2是本发明实施例提供的手绘动画的示意图；

[0025] 图3是本发明实施例提供的手绘动画引擎的功能框图

[0026] 图4是本发明另一实施例提供的手绘动画生成方法的方法流程图；

[0027] 图5是本发明实施例提供的手绘动画生成装置的结构框图。

具体实施方式

[0028] 为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅用以解释本发明，并不用于限定本发明。

[0029] 图1是本发明实施例提供的一种手绘动画生成方法。如图1所示，所述方法包括如下步骤：

[0030] 100：获取若干SVG格式图片。如上所述，在SVG格式的图形或者图片中，存储有对应的图形路径（由直线和曲线组成的路径）。应用过程中，可以根据实际需要，选择获取其中的SVG格式图片并加载，作为生成手绘动画的基础。

[0031] 200：解析所述SVG格式图片并抽取所述SVG格式图片的图片路径。在确定SVG格式图片后，可以对其包含的数据进行解析并从中抽取出图片或者图形的路径。路径是一系列直线和曲线组成的，带有时间顺序的集合，全部路径可以组合形成对应的SVG格式图片。

[0032] 在一些实施例中，具体可以使用正则匹配算法的方式来抽取保存在所述SVG格式图片中的图片路径。

[0033] 300：根据预定的重组规则，重新组合所述图片路径的顺序以生成手绘路径。从所述SVG格式图片中提取获得路径具有自身的顺序。为满足手绘动画真实性等的需要，可以根据一些预定的规则，重新组合这些提取获得的图片路径，形成一个具有合理顺序的绘画路径。

[0034] 可选地，所述重组规则可以是根据实际情况确定或者设置的原则或者规则，例如通过大量数据采集和分析后获得的用户的绘画习惯，包括绘画首先勾勒的部分，绘画的方向等。本领域技术人员可以根据实际需要，对所述重组规则进行一定的调整、替换或者变化，以使生成的手绘路径更加符合实际的人类的绘画习惯。

[0035] 400：基于所述手绘路径生成对应的手绘动画。在确定手绘路径后，可以据此自动的生成对应的手绘动画。所述手绘动画是指由一系列连续的图像帧组成的，用以表示图片或者图形绘画顺序的动画。所述手绘动画可以应用于绘画视频教学等方法，具有非常广泛的应用范围。如图2所示，为本发明实施例提供的，手绘动画的其中一个截图。

[0036] 在本发明的一个实施例中，所述步骤400具体还可以进一步包括：

[0037] 首先，在所述手绘路径上增加预设的绘画手势。所述绘画手势是预先设置或者保存好的，用以反映实际绘画过程中手的动作的手势图片。其可以采用任何合适格式的图形，作为手绘动画的其中一个元件，随着路径的变化而对应的变化，提供更逼真或者贴近显示的手绘动画。

[0038] 然后，使用手绘绘画引擎，生成所述手绘动画。所述手绘动画引擎是根据手绘路径，结合内部可以调用资源，自动生成对应的手绘动画的一个功能模块。手绘动画在视频上的时间线基于所述手绘路径而确定，亦即手绘动画可以在播放过程中，图形依据所述手绘路径的顺序形成，添加的绘画手势则按照图层上的路径轨迹移动。

[0039] 图3为本发明实施例提供的手绘动画引擎的架构示意图。如图3所示，所述手绘动画引擎包括：来画手绘动画引擎（ANIM）、对外暴露方法的函数（functions）、公共工具（tool）、存储项目数据的表（list）以及绘画控制（animator）等功能模块。

[0040] 其中，所述ANIM为引擎主体。所述list中存储有所有项目数据供调用，所述list下还可以包含有多个子表，例如PageList，SpriteList，EffectList，分别用于保存对应项目的数据。

[0041] ANIM可以使用图3中所示的PageList保存页面列表，SpriteList保存SVG图层列表以及通过AlgorithmList保存算法列表。绘画控制（animator）则用于控制手绘动画的播放，例如animator控制手绘动画初始化init，播放play，停止播放stop以及暂停pause。

[0042] 图4为本发明另一实施例提供的手绘动画生成方法。除图1所示的步骤外，如图4所示，所述方法还包括如下步骤：

[0043] 500：在所述手绘动画中截取若干动画图片。所述动画图片是所述手绘动画中若干个时刻的图像帧。需要截取的图像帧数量可以根据实际情况的需要所决定。

[0044] 600：基于所述动画图片，生成MP4格式视频或者GIF格式的动态图。以这些图像帧（即动画图片）作为基础，配合相应的时间轴等参数（例如选择其中的几个图像帧作为关键帧）后，可以生成相应的MP4格式视频或者GIF格式的动态图。

[0045] 在本发明实施例中，使用的数据源为保存有路径的SVG格式图片。但在一些实施例中，还可以进一步的通过调整或者更改一些对于图片的处理步骤，利用本发明实施例提供的手绘动画引擎来实现对更多不同类型的数据源的手绘动画自动生成。

[0046] 例如，对于PNG、GIF或者JPG图片，可以利用前端JS的Image对象以及CanvasAPI识别其宽高色彩点阵数据后，执行步骤400以完成涂抹手绘动画。

[0047] 在本发明实施例中，利用SVG图形中保存的路径，将其重组为手绘路径后，可以方便自动化生成手绘动画。该方法创造性的利用了SVG图形中保存的路径作为生成手绘动画的路径，提高了手绘动画的制作效率。并且进一步的可以将这些手绘动画以截取其中部分图像帧的方式，生成不同的视频格式以满足不同的使用需求。

[0048] 本发明实施例还提供了一种手绘动画生成装置。如图5所示，所述装置可以包括：加载模块100、解析模块200、重组模块300和手绘动画模块400。

[0049] 其中，所述加载模块100用于获取若干SVG格式图片。所述解析模块200用于解析所述SVG格式图片并抽取所述SVG格式图片的图片路径。所述重组模块300用于根据预定的重组规则，重新组合所述图片路径的顺序以生成手绘路径。所述手绘动画模块400用于基于所述手绘路径生成对应的手绘动画。具体的，所述预定的重组规则为用户的绘画习惯。

[0050] 在本发明的一些实施例中，所述解析模块200具体用于：通过正则匹配算法，抽取所述SVG格式图片的图片路径。所述手绘动画模块400具体用于：在所述手绘路径上增加预设的绘画手势；并且使用手绘绘画引擎，生成所述手绘动画。

[0051] 可选地，如图5所示，所述装置还可以包括：输出模块500。所述输出模块500用于在所述手绘动画中截取若干动画图片；以及基于所述动画图片，生成MP4格式视频或者GIF格式的动态图。

[0052] 专业人员应该还可以进一步意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。
专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本申请的范围。所述的计算机软件可存储于计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，所述的存储介质可为磁碟、光盘、只读存储记忆体或随机存储记忆体等。

[0053] 以上实施例仅用以说明本发明的技术方案，而非对其限制；尽管参照前述实施例对本发明进行了详细的说明，本领域的普通技术人员应当理解：其依然可以对前述各实施例所记载的技术方案进行修改，或者对其中部分技术特征进行等同替换；而这些修改或者替换，并不使相应技术方案的本质脱离本发明各实施例技术方案的精神和范围。