悬浮动效常见的几种玩法.docVIP

悬浮动效常见的几种玩法 　　动效是如今UI设计中的重要组成部分，也是目前最热门的设计趋势之一。在之前的《在现代网页设计中，动效常见的几种用法》这篇文章中，我们探讨了动效对于交互和用户的重要意义，动效在不同的环节发挥的作用越越来越大。而今天我们要聊的是光标悬停特效，这也是近年动效设计的热点之一。 　　 　　正是由于Material Design 和苹果所引领的动效设计风潮，许多曾经有过的设计技巧和元素正在逐步回归，而悬停特效就是其中之一。但是相比于曾经那些闪烁弹跳的特效，现如今的光标悬停特效来的更加微妙，更加强调功能性和体验。 　　和其他动效相似，光标悬停特效让交互的引导性更强，有的还带有预览的作用，它的使用范围非常广，大到全屏，小到提示和导航元素，不一而足。 　　接下来，我们通过实战案例看看，光标悬停特效目前有哪些创新的玩法。 　　首页动效 　　 　　光标悬停特效用的好，能成为你的网页整体设计中的大杀器。当你光标悬停在特定的位置的时候，整页的动效随之触发，视觉上是相当惊艳的。 　　比如Haus 这个页面，触发动效之后，整页的卡通角色在屏幕上走来走去，这个工作量和效果都是相当惊人的。触发动效前，只有标题文字会在屏幕上舞动。 　　触发全屏幕动画之后，让用户觉得愉悦而不是给用户带来压力。这中间的平衡很难把握。在这个案例中，设计师让黑色的背景和白色的非衬线体来构成对比，而中间留出空间给动效