加载动态设计--等待的艺术创作思维

在市场发展的趋势中，为了产生更好的视觉或者跳转的过程的必要，设计师都很清楚认知到在目前的APP设计和网站加载是无法避免的事了，所以在面对这种困难，必须把这种缺点一步步的变成为优点，打造优秀的用户体验。

 

目前许多产品的加载或者等待动效常用于增加用户的第一印象，但是可以延伸到更多的实际使用范畴，在设计项目中，遇到加载动效是必定的，有时会在内页切换遇到，有时在组件加载的时候遇到，或者在幻灯片切换的时候用上，还有一个比较重要的是，填补系统的崩溃或者出错的页面，都可以换成有创意的等待动效，会很大程度的引导用户觉得不是发生了错误。

 

等待和加载动效中，最常见的表现形式是进度条，但是许多设计师采用了更加有趣的表现手法。

 

4:20 Dead Obies

在很多传统的设计师的思维中都会有遇到等待加载时总会用进度条，然后就是一个生硬的LOADING的英文，不仅会让用户产生烦躁，而且也十分无趣，设计师可以通过把字母给拆分，然后让静态变成动态，让画面显得更新鲜，更有趣。

 

NewsTech

有一些充满科技感的加载等待画面，让人产生一个种在看科幻的片的感觉，用各种加载数据的样式，让等待变成一次高科技的表现形式。

 

Ferias Beach Park

这个Ferias海滩公园的页面借助了美观的配送和怀旧的人物设计，让人联想到那个过去的童年，也是一种不错的创意。

 

Mad Max Fury Road

年度神作《Mad Max 4》本就是以突出的视觉设计而令人记住，所以它的官网在设计美学上也保持了一致性。加载动效中那个粗糙但古朴的LOGO也与整个电影风格相呼应，营造出躁动而个性十足的氛围。

 

Panda Raid

网站的加载等待需要还是用了类似进度条的方式，但是图中的汽车轮胎的速度会随这个画面的加载速度而改变，更形象化。

Wiser Digital


在这个加载话面中用了一种乒乓球击打的效果，会产生一种不规则的动画，会使人觉得等待时间不会很长。

Tenfold Creative

为了填补等待的时间，设计师将朗朗上口的文字做成动效，在加载的时候用它们来与你进行互动。虽然许多文字是一闪而过，但是你可以在阅读中度过这段时间。

Tham Nguyen

Tham Nguyen 是一位著名的法国女设计师，她的个人网站中糅合了自然的情怀和女性的细腻，加载动画采用了走路的小女孩儿，俏皮而有趣。

50m.space

和前面许多案例一样，设计师采用了扁平风的动态插画来填补等待时间，强化整体风格。

 

Kajikenseiji

设计师在这个网页中，使用的是吐着气泡的鱼来作为过度，古朴的文字强化了网站的品牌形象，简单的色调和鱼的形象也充满了日系网站的独特气质。

One Kichjoji

和之前的网站一样，加载动效采用了单色的灯塔形象，简单有趣但是也优雅地呈现了品牌形象。

 

Interatction with Artificial Physics

这是一个精心设计的网站，强调人造和物理的属性，这种兼顾自然和人工设计的特征也体现在加载动效上，四个相互运动的气泡时大时小，看起来自然而混乱，但是仔细看你又仿佛能找到某种规律，这个有趣的过程中你会忘记时间的流动，直到网站加载完成。

 

Catch the Dragon

水波纹扩散一般的加载动效，在黑白色调之下，兼顾了自然的特征和科技的感觉，微妙的互补效应和震动的效果令整个动效简单而赏心悦目。

 

SLMF

沉稳和有创意的排版，让等待转换成为数据的透明度有虚转为实。

Zodiac

 

这是一个星际的画面，充满人类对宇宙的向往和探索，科幻般的感觉，充满艺术感，在等待中欣赏也是一种好主意。

 

MTV Bump

打开页面之后，鼠标光标变成了复古的沙漏造型，更让人惊喜的是加载动画是一个不停吞吐着彩虹色带的MTV Logo，复古而有趣。

 

Y7K

Y7K的加载动效其实蛮讨巧的，巨大的LOGO上叠加一个色彩丰富的视频，漂亮而简单。

 

The Happy Forecast

这个网站的动效设计手法并不鲜见，但是设计是不仅仅是添加了进度条那么简单，他还用渐变的动态文字告诉用户正在加载网站的哪个部分。时间很长，但并不无趣。

结语

动态设计虽然是一个很少的部分，但也会起到意想不到的效果，在用户体验中让不愉快的等待，变成有趣，有创意的快乐感，动态设计是大势所趋，加载/等待动效也是其中的重要组成部分，如果你热衷于动效设计，不妨关注一下这个领域。