课程咨询 :0571-56020837 QQ:162157806

南昌达内UI名师

南昌UI培训 > 达内新闻 > 达内:动感粒子动效设计的优秀案例
  • 达内:动感粒子动效设计的优秀案例

    发布:南昌UI培训      来源:优设网      时间:2015-12-28


  •     喜爱现代风的网页设计师们倾向于用动态、抽象的元素为页面渲染出富有科技和未来感的氛围。其中最常见也最受欢迎的元素是粒子动效,南昌达内ui设计培训专家重点来说一下这一设计元素。

        粒子动效的运动轨迹可谓是千差万别,有些能与用户的操作产生联动,随着鼠标指针运动,震颤,舞蹈。不过所有的粒子动效都有个共同作用,就是为整个页面营造出动态、活泼和科技感十足的氛围。

        Deutser

        黑色的极简风背景是这些粒子动效的舞台,粒子每隔几秒会打散重组出新的图案,并且搭配上相应的文案,并且粒子本身会随着鼠标的移动而进行恰如其分的偏移,不仅让用户充满了参与感,而且动态的展示方式让信息的展现更有厚度。

        Share the Force

        这是一个星球大战主题相关的网站,意为“分享原力”。整个网站的设计非常贴合星战的主题,加入了许多宇宙相关的设计元素,背景中的粒子动效更是强化了这种环境的动感和气氛。

        Seven Brief Lessons

        开发者让移动的粒子构成了一个环形,并让它们顺滑地运动着,漂亮的渐变效果让整个背景加分不少。环形运动的粒子动效让用户将注意力集中到中间的文字上,这使得动效的功能性强化了不少。

        Brandify

        复杂的立体几何图形和运动的粒子组合到一起,充满了韵律感。整个动效丰富了页面的细节,让它看起来一点都不单调,也增强了趣味性。

        NYCIG Marathon

        这个壮丽而又专业的粒子动效将NYCIG 马拉松的逼格提升到了一个全新的高度,壮阔的场景令人难忘。

        Double Pi

        粒子动效在这个网站中不仅充作背景,同时也是用户交互的对象,它会构成一个隧道随着鼠标光标移动。

        Sift Agent

        作为一个以宇宙为主题的网站而言,粒子动效还是非常点题的。在这个页面中,粒子动效会模拟宇宙中星座的运行轨迹来运动,当你点击不同的区域的时候,能显示相关星球的图片。

        Sony Experia

        四处移动的小气泡会构建成不同的东西,让用户心情愉悦,当用户用鼠标点击气球的时候,这些移动着的气球会爆掉,非常好玩。不同的气球会链接到不同的图片。

        Signature Art

        大量的3D粒子会帮你创建签名,给人以优雅而精致的感觉,当最终生成签名的时候,你可以放大查看细节。

        Citak

        Citak 网站将极简风格发挥到机制,用干净的色彩和大量的留白来营造出现代而时尚的感觉。设计师使用丰富多彩的粒子动效引导用户关注标题文案。

        The Alkemistry

        网站提供了更加个人化的粒子动效来提高整个网站的“个性化体验”,网站的设计和星座风格背景紧密关联,营造出统一而一致的浏览体验。

        Think Less Love More

        这个网站在交互设计上非常突出,同时在动效和简约风格之间找到了不错的平衡点。动态粒子构成的糖果构成了网站的主视觉,个性十足又充满魅力。

        Decta

        Decta 网页中的颗粒动效和网页闲适的风格相互呼应,按照一定韵律聚散的粒子让页面充满了呼吸感。

        NodePlus

        NodePlus 页面中三角形的粒子和它们的动效让整个网站呈现出强烈的个性,给人创造力十足的感觉。

        Petar Stojakovic

        这是 Petar Stojakovic 的作品展示页,作为欢迎界面,黑白分明的设计清晰简单,向中央收拢的粒子动效营造出一种深邃的效果,吸引用户的注意力。

        VOID

        Void 的网站为用户提供了近乎无可匹敌的抽象粒子动效,这些时尚又精致的粒子动效,展现出设计师的高超水平。

        CloudNine

        CloudNine 的网页是关于一个在宇宙环境中生存的超级英雄的,页面中这些微妙的动效让背景显得微妙又漂亮无比。

        Treskon

        同样是使用了经典的强对比的黑白色系来设计网页,Treskon 的设计师也倾向于借用粒子动效来强化页面质感,突出内容。

        Fixed Group

        细腻的粒子动效在这个网页中起到了支撑作用,完善了整个设计。动态的背景在动效支撑下显得更加富有美感。

        Orion9

        Orion9 是一个独特的个人作品网站,刚打开页面有些枯燥,但是当粒子动效充塞页面的时候,就完全不会感到枯燥了,体验感不错。

        结语

        南昌达内ui培训专家指出,粒子动效的运用范畴非常广泛,动态,活泼,具有引导性,交互性,可以和色彩、图片、内容充分的组合,并且在美学上产生化学反应,可能成为新的主流设计趋势。





    原文链接:http://www.uisdc.com/particle-animation-web-design
    原文作者:@陈子木


    推荐文章

上一篇:达内:网页设计师必须具备的基本技能

下一篇:达内:扁平化设计如何突破革新

最新开班日期  |  更多

UI设计培训免费训练营

UI设计培训免费训练营

开班日期:每周一

UI设计培训高级班

UI设计培训高级班

开班日期:每周一

UI设计培训全日制班

UI设计培训全日制班

开班日期:每周一

UI设计培训周末班

UI设计培训周末班

开班日期:每周一

  • 地址:南昌市北京西路156号洪城大厦10楼
  • 课程培训电话:0571-56020837 QQ:162157806     全国服务监督电话:400-827-0010
  • 服务邮箱 ts@tedu.com.cn
  • 2001-2016 达内国际公司(TARENA INTERNATIONAL,INC.) 版权所有 京ICP证08000853号-56