大家在用bodymovin的时候，是不是要生成一个bodymovin的文件夹，里面有json和html，也许还有个image。这时候你需要把这些传给领导预览，或者发给前端上传到网站里给个ip让领导预览。如果领导觉得不ok又得再给再传，其实大可不必，都智能办公时代了，不用那么OUT了。

不过前期我还是普及一下bodymovin的使用方法。首先你得有个after effects,不知道的去adobe的官网下载https://creative.adobe.com/products/download/aftereffects?promoid=RYGDN4F6&mv=other

然后去下载个bodymovin插件，这是汉化版的，当然你还得下一个zxp安装器

安装好后就大功告成了。

再跟大家讲解一下bodymovin生成的是网页动画，我直接用gif不就可以了吗？首先GIF是动画图片，加载起来也非常卡，体积也非常大。一个高清的gif图片大概都是2M左右起步，但是bodymovin生成的json体积非常小，只有几百kb左右，读取速度要比图片快的多。生成的json我们可以直接让前端去编辑，如果是gif的话，修改某一个颜色，还得交给设计师去返工，然后生成后再次发布压缩，这个流程咋说也得分钟计算吧，如果是修改json就按秒计算了。

安装好插件后，在AE里启动bodymovin这个插件是不是上面这个样子，如果是那就说明安装OK了，就差生成了。

点击render渲染，插件就开始自动生成了。然后点击那个路劲地址就进入那个地址，一般会生成1个json文件，这说明说明你使用的是矢量图形。如果动画里有像素图片的话，他会自动生成个image的文件，里面就存放着图片。想看效果直接点击那个html就可以了。交给前端开发把这个打包发过就可以了，那么下面，我教大家怎么把这些上传到木壳子里，因为木壳子里可以实时预览和下载。

在木壳子小组里选择动画设计上传分类“动画设计”里的"AE网页动画"，然后选择Json文件，上传成功后就可以欣赏了。

如果你碰到以下情况，显示不出图片来，不要急。说明你的bodymovin插件生成了一个image的文件，你只要点击左上角“上传匹配按钮”，把image里的图片上传上去，那么就能观看了。

那么你把所有的设计元素都上传上去后，前端人员只需要下载就可以了，领导又能直接预览，是不是很方便。