最美UI

UI设计师必备!最全的加载动画网站PRELOADERS

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

Preloaders

uisdc-gif-20170612-1.jpg

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

uisdc-gif-20170612-2.jpg

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

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

uisdc-gif-20170612-3.jpg

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

uisdc-gif-20170612-4.jpg

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

uisdc-gif-20170612-5.gif

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

uisdc-gif-20170612-9.gif

uisdc-gif-20170612-10.gif

uisdc-gif-20170612-6.gif

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

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

uisdc-gif-20170612-7.jpg

简直可怕…

想要了解更多的设计神器,可以关注@你丫才美工

来源:优设

微信公众号微信公众号:zuimeiui

扫一扫 关注公众号

0

[ 最美特色栏目推荐 ]
设计导航:全球顶尖设计网站推荐,设计师必备导航! → 猛戳这里
设计欣赏:收集海量精选APP截图,让你设计灵感小宇宙大爆发!! → 猛戳这里
APP图标:精选APP图标,看看各大app图标的设计风格提升设计感! → 猛戳这里
最美UI(zuimeiui.com)每天发布高质量的设计教程和分享设计经验,帮助喜欢UI设计的初学同学快速转型,我们给大家提供更多免费学习ui的机会,想成为设计师的你赶快加入吧!
【原创文章 投稿邮箱:tougao@zuimeiui.com | 期待您的投稿!】

上一篇
【见字如面】五月字体设计欣赏集合
下一篇
iOS 11发布!提供给你最全iOS 11 UI Kit下载