疫情期间，在线生活迎来爆发 ，视频行业成了广大网民放松娱乐和了解疫情、学习防护知识的重要平台。

短视频行业的日活用户规模较平日增加  16.7%，日人均使用时长较平日增加  9.3%。长视频成为很多网友在家消磨时间的方式。腾讯视频独播剧《三生三世枕上书》和芒果TV 独播剧《下一站是幸福》，更是让平台日活分别增加  22% 和  26%。 

可以说，视频行业的利好趋势，基本上不受疫情影响。短期内疫情会带来较大增幅，但是疫情过去之后还会保持自己的增长节奏。

这几年也积累了一些关于视频编辑和相关产品的经验。今天来介绍一款可以将AE（Adobe Effect）文件导出json格式的工具，名叫lottie。

| 什么是lottie

第一次接触它是在3年前，做视频社交的时候，需要做视频编辑功能，后来因为产品方向的变革，没有使用成功，但第一次的接触让阁主认识到这个软件的存在。

最近又在做视频模板相关的需求，做一个可编辑的视频模板，用户只需要在模板填充内容，就可以使用已有的酷炫视频资源，于是又接触到Lottie 。

当时遇到一个什么样的问题呢，设计师可以用AE（Adobe Effect）设计出各种酷炫的视频效果，但开发真的要将设计师所做的效果显现出来并适配各个系统和各种大小的屏幕，会耗费很大的工程量，成本比较大，为了尽量缩小开发成本，于是引用了lottie。

ottie最大的好处，就是可以将做好的AE文件，直接导出json文件，让开发直接运用，基本上实现了0成本的开发量，真是太棒了，大大减少了设计师和开发之间的沟通成本。

| 怎么安装

1. 先安装Adobe Effect，划重点，最好是安装英文版本的。

lottie是由Airbnb团队研发出来的，因为是国外的公司，所以汉化版本，或多或少会出现各种兼容的问题，阁主在这个上面是吃了很多亏的。

但别担心，各个设计软件的界面长得都差不多，基本能猜到各个图标是干什么，以及相应的操作提示是什么意思，哪怕有一两个单次不认识，网上翻一下也就都懂了，界面英文不会太难。

2.在公众号后台回复“Lottie”，即可得到相应的安装文件文件。

安装文件也是英文版本，解压后有2个文件，1个是ZXP Installer，另一个是bodymovin.zxp，先安装ZXP Installer，安装好了之后打开，会出现如下界面。bodymovin是设计师用的插件，lottie是开发侧要用的文件json文件，一般对外将两者形成的系统称为lottie。

然后将bodymovin.zxp拖到界面去就完成了安装。

| 怎么运用

1. 设置AE脚本权限。

   
   

路径为在【 AE-首选项-常规 】中勾选 【允许脚本写入文件和访问网络】，英文路径就是【Adobe Effects】-【Preferences】-【Scripting&Expressions】-勾选【Allow Scripts to Write Files and Access Network】，如下图

2.先用AE做好你想要的视频，这一步按各自的想要做的内容来；

3.导出。导出路径为【Windows】-【Extensions】-【Bodymovin】，如下图

4.选择相应要导出的文件，以及选择导出的路径，如下图

5.做好Bodymovin的设置，设置项如下图

6.点击绿色按钮“Render”就大功告成了。

| 相关注意事项

如果出现如下图的现象，插件卡在某个图片上，导不出来，可以尝试以下几个方法：

1. 在使用bodymovin的时候将电脑的语言系统也换成英文，如果不习惯，不用的时候再换回来中文。系统语言有时候也会影响导出的成功率，阁主用的是正版AE2020会遇见语言问题，用2017英文版就不会，也跟AE软件本身版本相关。

   
   

2.导出json的路径如果含有空格，也可能导致不能导出，直接导出到桌面是最直接的。

3.太复杂的动画可能导出会有问题，简单的遮罩是支持的，建议不要用太复杂的逻辑做动效。

最后，总结一下，为了跟上时代的潮流，拓展自己的技能，可以尝试下视频相关的设计需求。而Lottie是其中能帮助团队节省开发效率，让设计师专心设计动效掌握主动权的工具。

如想尝试，可在公众号后台回复“Lottie”，即可得到相应的安装文件文件。

往期精彩文章
《关于交互设计的思维抽象》
《在家办公是要写日报的》
《B端设计之导航》

作者简介：Sophia的玲珑阁，一枚爱折腾，爱健身的交互设计妹纸。

职场设计技能，更多教程抢先就看，请关注作者的微信公众号：Sophia的玲珑阁