网页设计中滚动动画的7个例子

滚动触发动画的例子

现在很难想象一个没有任何动态元素的现代网站。小的,大的,中等的,他们将会出现在许多网站上。Web用户界面不再使用单独的静态解决方案填充。你可以在这里、那里以及几乎任何地方看到各种各样的动画。每个人都试图远离被动的、停滞的界面,而选择更吸引人的交互式界面。

无论是一个异想天开的个人作品集还是一个严肃的公司网站,你都有可能偶然发现一些有趣的动态细节。在所有令人眼花缭乱的动画中,滚动触发动画是最受欢迎的一种。

什么是滚动触发动画?

滚动触发动画已经伴随我们很多年了。与其他强劲趋势一样,它也经历了起起落落;今天是它重新上马的日子。

这种方法越来越受欢迎,因为它允许网站所有者将静态界面转变为动态界面,而不需要牺牲空间或花费大量金钱。它结构紧凑,重量也相对较轻。它只是自然阅读流程的一部分,丰富了用户体验,使其愉快。

更重要的是,当您需要设置不显眼的焦点时,滚动触发动画是非常好的工具。它们还可以将您的受众从一个检查点带到另一个检查点。这项技术有很多额外津贴和福利,而且已经经过了时间的考验。

让我们来考虑一些现代网站的优秀例子,在这些网站中,滚动触发动画支持用户体验的美感和交互性。

滚动触发动画的例子

元音乐-一个伟大的例子滚动触发动画

我们收集的第一个网站是元音乐。这是一个典型的滚动触发动画的例子。在这里,您可以看到解决方案如何巧妙地结合线样式和掩蔽,带来一个突出的结果。滚动可以激活各种元素——有时是图标,有时是插图。

在Meta Music的网站上,用户可以享受到一种一致的体验,其中充满了非静态的细节和赏心悦目的动画短片,一旦进入读者的视线,这些短片就会开始播放。

Limnia

Limnia

虽然Limnia不能吹嘘杰出的滚动触发动画,但它是一个完美的例子,一个常规的促销网站,有了新鲜的气息,感谢这一趋势。

在这里,您可以看到滚动所触发的简单效果。更准确地说,当section进入视图时,效果将被激活。它们是图片和内容块的简短漂亮的过渡。然而,这已经足够将界面变成一个看起来现代的部分,同时,满足公司的品牌。

此外,Limnia向我们证明了现代滚动触发动画不仅仅是关于老式的大动画。微的相互作用和小的,短期的影响统治了这些天。因此,这一趋势也与微小的动画有关,这些动画也可以被认为是过渡效果。

Stefano De Rosa的个人作品集

在Stefano De Rosa的个人作品集中,我们可以看到滚动触发的转换效果,而不是传统意义上的动画。然而,它丝毫没有减少它的美丽。这只是为了迎合当今世界而重新构想的潮流的另一个版本。

这些效果影响界面的各种元素,从标题开始,以文本结束。它们在各个部分之间创造了一种吸引人的转换,将用户体验变成了一种纯粹的乐趣。

文化连接

文化关联是滚动触发动画的一个很好的例子

文化连接是一个典型的,部分说明的网站,丰富了滚动触发的解决方案。后者有助于揭示隐藏在项目内部的全部美,因为插图和动画注定要一起工作。这两个设计元素构成了相当强大的一对。

在这里,几乎每个部分都有它的花卉作品与一个互动的组件在滚动触发。这个动作也创造了一个活生生的,呼吸界面的感觉。请注意,尽管有许多动态的细节,但它们既不会压倒对方,也不会让对方感到畏惧,而是完美地一起工作来创建一个和谐的体验。

高大真实,错综复杂

正如我们前面提到的,滚动触发的动画可以用于引导用户从一个点到另一个点,允许所有者控制读取流。《高大,真实和纠结》就是一个很好的例子。

该团队创建了从上到下的整个视觉路径。你可以在这里看到一个简单的线条形式的小轨迹,它从一开始就吸引了人们的注意力,从上到下引导着人们的视线。它完美地融入了整个设计,完成了主题,并且没有激怒用户。它只是工作。

世界语

世界语是滚动触发动画的一个很好的例子

就像前面的例子一样,世界语背后的团队也利用滚动触发动画的趋势来操作读取流。在这里,你可以看到一辆汽车(以及几节中的一架飞机)伴随着读者浏览整个主页。它可以移动,旋转,甚至翻转。它创造了一条自然吸引注意力的路径,并设置了一些锚点。

每个部分都增强了动态效果,也由垂直滚动触发。总的来说,界面看起来新鲜、现代、令人兴奋。

智慧

智慧

支持Wits的团队设法用大量滚动触发的动画填充了主页,并且仍然保持了娱乐和信息部分之间的平衡。

在这里,每个部分都是一个有其主题和支持动画的屏幕。在某些情况下,它们是短的;另一些则很长。他们中的一些人处理界面的标准细节,如排版或图像,而另一些人处理一些不寻常的概念。

Wits就是一个例子,它向我们展示了滚动触发动画的过度使用是如何带来好处而不是损害用户体验的。

结论

滚动触发动画是一种时断时续的趋势。即使它不是什么新的、大的或特殊的东西,当它回来时,它很容易与当今的主流协作,并为接口添加了自己的风格。

它吸引了人们的注意力,给界面带来了一种前沿的感觉,并把用户体验变成了一种愉快的消遣。在某些情况下,它是无声的,几乎不引人注目,而在另一些情况下,它听起来像雷声一样响亮。它的用途非常广泛。因此,每一种类型的网站都有可能打开其潜在的可能性,并从这一趋势中获益。

2020-05-24 17:43
相关热门