动效如何落地?你学会了吗

这一次是一个非常非常干的干货,手把手教你如何配合开发将小动效在页面中展示出来。 关于如何做动效,网上 […]

2021年3月29日

这一次是一个非常非常干的干货,手把手教你如何配合开发将小动效在页面中展示出来。

关于如何做动效,网上有相关的课程和文章,我在这里就不说了,因为我可能做的也没人家好(偷笑),但是当你做完之后如何交付给开发,如何调试出比较好的效果,我这里可以分享一下我的经验和踩过的雷。

当然,如果和你配合的开发是个很厉害的大佬,你也可以直接跳过了,因为厉害的大佬可以自己写动效,写的可能还比你做的好(我就这样被虐过)。

巴拉巴拉废话一堆,现在进入正题,我会分别告诉大家小动效在小程序端和APP端如何导出,配合开发去落地,主要就是使用APNG格式的图片JOSN动画文件

小程序端

首先小程序是基于各个平台的开发框架进行开发的,实现技术类似于HTML,和APP在技术上有本质的区别,所以在APP上适用的方法不一定在小程序上适用。

虽然有些简单的小动效开发可以自己直接写出来,但是开发大大说,写太多会影响小程序的性能,那就需要我们来帮忙解决了。

APNG图片介绍

一般情况下我们会使用GIF动图来实现动效,但是GIF图片的缺点就是不清晰、有锯齿、不支持半透明。这里给大家介绍另外一种图片格式「APNG图片」。

简单来说,APNG 支持全彩和半透明,无杂边问题,文件体积小。缺点就是兼容性差,但是在小程序端是默认兼容的,这便是极好的。

简单介绍完APNG,我再给大家推荐一款我使用的制作APNG图片的软件「iSparta」。

打赏 0