如何巧用 SLOGAN,让 BANNER 变得更有设计感!

UI设计师在工作过程当中难免会遇到一些界面设计之外的细节,比如Loading动画,或是转场动画等,今天推荐的一个网站,就是一个Loading动画收集站,除了可以直接调用其中的资源之外。还能直接线上修改Loading效果。实乃UI设计必备之佳品。

UI 动效设计灵感站:《让界面动起来!9个移动动效设计必备的灵感收集站》

Preloaders

Preloaders的动画类别非常之多,可以看到除了常见的图片以外,他们对图片还进行了分类可以是三维的loading效果,也可以是纯文字的。总之你能想到的常见分类,这里都是可以直接找到对应的作品。

​它里面可以生成的格式是GIF、SVG或者APNG,有“Free”标签的Loading是可以直接下载使用的。这对于设计师来说减少了很多与RD同学的沟通成本。

与此同时,美丫姐觉得最最方便是它有很多的效果是能够直接在网页里面去编辑的。比如:修改颜色、修改运动速度。要知道这些在AE里面修改之后输出资源,还是非常麻烦的。

​从上图可以看到,可以修改的地方还是非常多的。比如前景背景色,还有大小,运动速度等等。让我们修改看看吧。

改起来非常直观,这样我们就获得了一个崭新的蓝色GIF图片。这里选用的是.gif格式进行下载,所以最终的显示效果也是直接就能预览的GIF动图,效果如下:

其他的样式也可以随意更改,总之是非常非常方便,以下效果均出自Preloaders

​以后再跟RD哥哥沟通页面效果的时候,完全可以拿出这个网站的案例作为范例来给RD哥哥演示。即使图形上有偏差,也可以作为效果演示。简简单单搞定~

当然,这个网站也有一个非常逼死强迫症的地方:就是它的网站图标,是一个Loading图!!总觉得没有加载出来啊啊啊啊啊,急死我了…

简直可怕…

关键字:设计, 设计文章

版权声明

本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符,请点击 举报 进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部