突然意识到，我们平时迫切的想要学习的动效设计，膜拜过无数次的追波上面的大神动效作品，其实不是主要靠创意来实现的，而是因为其追寻现实世界中物理效果，光暗环境，从现实中的真实场景挖掘了动效最易受的一面，让受众接受的如此自然顺理成章。
比如翻页效果，卷帘效果，击飞效果，弹跳效果等。
再比如 想做一个流星划过的页面效果，不能单纯靠想象力来实现，而是真正去观察现实中的流星划过夜空，他的轨迹，角度，数量密集程度，划过的速度频率，发出的颜色。
粒子动效类web首页
事情的起因是优设上一篇讲web端页面设计的文章，提出目前最火的页面背景，其中一种就是粒子动效，由此我想到了流星划过的动效设计，很可能更加美观，有感染力。然而这个设计从何做起呢，我目前就很缺乏动效设计经验和实践，但是我首先能做的是去思考这个效果可以是什么样子，不一定做出来但一定有这个思考的过程，在心里把想要实现的外观设计呈现出来，这时候已经定下来
1.要做一个流星划过夜空的设计
那么还需要哪些信息才能支撑这个设计继续下去呢？
流星的颜色
流星的密度 数量
流星划过的速度 频率
划过的角度
这是我能短暂时间想到的。当然其实还有许多要考虑的东西，比如动效开始和结束的最佳时间、动效在用户打开网页、鼠标移动、执行按钮操作等不同场景的反馈效果，以及动效以什么样的展示方式能最恰当的引导用户完成预期目标，且不会引起过多的注意力而导致本末倒置。
这里面好多东西要和交互设计师，产品经理等等去沟通，但在设计之初，设计师应当充分考虑到这些情况下的视觉传达效果，这才有可能去成就被称之为优秀的设计。
回到我们的出发点，了解到这些供设计继续下去的信息需求后，怎么去挖掘使之真正应用于自己的设计呢？很多人在设计之初会选择去花瓣，dribbble，pintrest等网站广泛浏览收集灵感和素材（别告诉我没人和我一样这么做），然后就是不断的绞尽脑汁思考创意点，往死里憋界面。但这次我要提醒各位的，也是我以前不信后来才渐渐发现的，真正的设计来源于生活，从现实取材，在升华至超脱现实。
以上面的流星动效为例。颜色，角度，速度，密度频率这些信息从哪里来？我不认为你从各大设计网站上能够获得详细数据，即便有相似的设计，照搬别人的设计效果肯定也不会太好，因为你没有处在他进行设计时的思维空间，他整个设计从无到有的思考流程你不能完美复原甚至会完全相反，此时你所实现的表面上的效果实际上就是中国清代中学为体西学为用的花架子。
给我这个设计提案，并且有明确的需求信息，我会从现实中挖掘可用信息。比如流星的数据，可以去各大视频网站搜索流星相关的录像，搜不到你来西安打死我！我相信如果你智商不低于20肯定能够了解到流星划过天际的具体视觉特征，频率速度，颜色等等，这些可以很容易的get到，也是完全可以完美复原在你的设计稿上的，你要相信自然规则运转所带来的美感是绝对的，真实的，1.618相关的黄金比例变来源于海螺的花纹，从现实整理来的信息供给我们的设计会有意想不到的效果。
这次突然灵感迸发也让我回想起当年第一次看到MD (Material design)的惊艳，它的动效会给用户带来一种本应如此的视觉体验，色块的展开，按压，弹出反馈，全部取材于现实中的物理运行效果，当在移动设备上展现出来的效果和你现实中接触的任何物品的反馈相吻合，这个设计就真正打通了虚拟和现实，当我们使用户视觉体验的一致性原则占领整个设计的制高点，不仅是页面之间的一致性，更是用户界面和现实场景的一致性，此时此刻，相信我们所做所为可以被称为优秀的设计吧，真实而为他人着想的好设计！
网友评论