YYEVA（YY Effect Video Animate）是一个开源的支持可插入动态元素的MP4动效播放器解决方案，包含设计资源输出的AE扩展，客户端渲染引擎，在线预览工具。
对比传统的序列帧的动画播放方式，具有更高的压缩率，硬解码效率更高的优点，同时支持插入动态的业务元素；对比SVGA、Lottie等播放器，支持更多的特效支持，如复杂3D效果、描边、粒子效果等，达到所见即所得的效果。
我们发布项目已经有数月，也有很多朋友加入了我们的社群提出一些优化方案，我们陆续在支持。也欢迎大家到 github给我们点个⭐⭐⭐，您的Star是对我们最大的支持。
大家在安装完YYEVA的AE插件后，还不知道如何使用，本篇文章用几个案例来快速介绍下如何使用AE插件导出相关YYEVA资源，让我们一起开启YYEVA旅程吧！
下载示例资源
大家可以先下载我们提供的设计Demo：链接
内部包含2个aep资源
-
普通MP4转换:
/normal_aep -
动态元素MP4转换:
/dynamic_aep
开启AE插件
通过下列步骤，可以打开一个扩展，正式运行您的程序
窗口 > 扩展 > 我的第一个面板
如下图所示，在Adobe After Effects，点击工具栏的窗口，打开扩展，找到名为YY-MP4转换的扩展工具
点击之后，就会打开我们YYEVA的插件主界面
普通MP4转换
打开normal_aep资源
- 选择要转换的合成
- 确认所选合成是需要输出的合成
- 在插件面板，设置要输出的路径
- 选择档位，默认中
- 点击开始转换
通过上面步骤，我们会在您设置的路径生成一个当前合成渲染出的MP4资源
如下图所示，我们在选中的输出目录下，会生成一个
选中合成为名字_转换模式[normal/dynamic]_编码方式[264/265]_档位[low/mid/high].mp4
案例输出的为: 遮罩_normal_264_mid.mp4
预览输出资源
动态元素MP4转换
打开dynamic_aep资源
- 选择要转换的合成
- 确认所选合成是需要输出的合成
- 在插件面板，设置要输出的路径
- 选择档位，默认中
- 点击开始转换
通过上面步骤，我们会在您设置的路径生成一个当前合成渲染出的MP4资源
如下图所示，我们在选中的输出目录下，会生成一个
选中合成为名字_转换模式[normal/dynamic]_编码方式[264/265]_档位[low/mid/high].mp4
案例输出的为: 遮罩_dynamic_264_mid.mp4
预览输出资源
普通MP4转换 VS 动态元素MP4转换
大家可以发现，2种模式下输出的资源完全不同。其中
- 普通MP4转换 : 按照所选合成，直接渲染出一个普通MP4资源
- 动态元素MP4转换 : 按照所选合成，把输出合成做了一些相应应的转换，生成了一个YYEVA的动态MP4资源
通过发现所选合成，可以看到，我们提供的动态元素MP4转换的AEP资源案例,和普通MP4转换的AEP资源案例，在图层信息上，是不同的。
普通MP4转换的图层信息
普通MP4转换的图层信息仅包含了当前资源所需的一些图层，不包括插件要求的mask_*图层，这种情况下，插件内部会判断为普通MP4转换模式，只会将所选的合成直接渲染出一个MP4资源
动态元素MP4转换图层信息
动态元素MP4转换图层信息的图层信息 不仅包含了当前资源所需的一些图层，也包括插件要求的mask_*图层，这种情况下，插件内部会判断为动态元素MP4转换模式，会将所选的合成，通过一系列图层转换，渲染出一个YYEVA-MP4资源
所以设计同学要使用YYEVA的支持动态功能，需要制作mask_*图层哈，具体制作流程可点击查看
细心的同学可能发现了，我们的选择的遮罩合成，输出后会生成一个带透明区域的MP4资源。这个过程其实是在内部完成的，我们使用了源合成，增加了一个alpha区域，真正最终输出的合成是下面这个合成，转换后，我们就会删除掉这个合成
结语
本篇文章主要介绍了导出工具的2种转换模式，内部会根据所选输出合成的图层相关信息，去选择合适的转换模式，来生成相应的资源。通过YYEVA动态模式，可以在静态的MP4资源上，根据业务需求，加入一些好玩的动态元素，丰富交互性。我们会在之后的文章，出一些落地case，给大家呈现一些好玩的应用。大家敬请期待
