webgl1到webgl2_9个其他令人振奋的WebGL演示

webgl1到webgl2

With Firefox OS, asm.js, and the push for browser performance improvements, canvas and WebGL technologies are opening a world of possibilities.  I featured 9 Mind-Blowing Canvas Demos and then took it up a level with 9 Mind-Blowing WebGL Demos, but I want to outdo those with this post.  I've found nine more mental WebGL demos that you shouldn't miss.  Enjoy!

随着Firefox OS,asm.js以及浏览器性能改进的推动,canvas和WebGL技术为人们带来了无限可能。 我介绍了9个令人兴奋的Canvas演示 ,然后将其与9个令人兴奋的WebGL演示进行了比较 ,但是我想在这篇文章中超越那些。 我发现了另外九个您不应该错过的心理 WebGL演示。 请享用!

1. WebGL水 (1.  WebGL Water)

This incredible demo is as fluid as you could believe.  Raise and drop the ball into the water to see realistic, beautiful splashing of the water.  You can also just click the water to see it ripple away.  I'm completely awestruck at how realistic and smooth the animation is in this excellent WebGL demo.  Unreal.

这个令人难以置信的演示就像您所相信的一样流畅。 将球升起并放到水中,可以看到逼真的美丽的水花。 您也可以单击水以查看其涟漪消失。 在这个出色的WebGL演示中,动画的逼真度和平滑度令我非常震惊。 虚幻。

WebGL Demo

2.碳酸凸轮 (2.  Fizzy Cam)

Fizzy Cam uses your machine's webcam to display your likeness but with thousands of moving blocks overlaid, giving a fun and artsy feel to the display.  The boxes move with motion so move about as you use the demo and marvel at how creative this WebGL demo is.

Fizzy Cam使用机器的网络摄像头来显示您的头像,但上面覆盖了成千上万个移动块,使显示充满乐趣和艺术气息。 这些框会随着运动而移动,因此在使用演示时会四处移动,并惊叹于此WebGL演示的创造力。

WebGL Demo

3.开花 (3.  Blossom)

The Blossom demo animates leaves from a tree.  That sounds simple but there's something very realistic about this WebGL treat; the leaves look so real and flow so naturally that you can't help but keep watching.  Call me soft but I think this animation is incredibly beautiful.

Blossom演示将树上的叶子动画化。 听起来很简单,但是WebGL的处理方式有些现实。 叶子看起来很真实,而且流动得很自然,以至于您不得不继续观察。 叫我柔软,但我认为这个动画非常漂亮。

WebGL Demo

4.教我飞 (4.  Teach Me to Fly)

Teach Me to Fly is a fun game where your character flies through the air and it's your job to guide him around buildings.  The controls are simple, the game is simple, and yet it's very fun and challenging to play.  The 3D buildings look outstanding and control is spot on.

“教我飞”是一款有趣的游戏,您的角色在空中飞舞,引导他到建筑物周围是您的工作。 控件很简单,游戏也很简单,但是却非常有趣且富有挑战性。 3D建筑物看起来非常出色,并且可以控制。

WebGL Demo

5. Visualeyezer (5.  Visualeyezer)

This demo features an enormous eye that follows your cursor around the screen, all the while pulsating and changing colors as music plays.  Unsettling?  A bit.  Impressive?  Absolutely.  The detail within the the lessor obvious parts of the eye is what really caught my attention -- fluid, smooth, and consistent.

此演示的特点是,巨大的眼睛跟随您的光标在屏幕周围,同时随着音乐播放而不断跳动和改变颜色。 不安? 一点点。 印象深刻? 绝对。 眼睛的次要明显部分中的细节真正吸引了我的注意力-流畅,平滑且一致。

WebGL Demo

6.核 (6.  Nucleal)

Nucleal is another particle-based animation but this one transcends others.  Choose the amount of particles to use (i.e. how toasted you want your CPU to get) and drag/hold around the animation to view different perspectives.  The particles also animate at and curves to an amazing smoothness.

Nucleal是另一种基于粒子的动画,但是它超越了其他动画。 选择要使用的粒子数量(即,您希望CPU如何烘烤),并在动画中拖动/按住以查看不同的视角。 粒子还会在处产生动画,并弯曲到令人惊奇的平滑度。

WebGL Demo

7.互动地球仪 (7.  Interactive Globe)

This interactive globe is amazingly reactive and practical.  As you drag/pull around the globe, the information labels fluidly display.  The revolving, animating spheres round the globe also add great visual appeal.

这个互动式地球仪React灵敏且实用。 在全球范围内拖动/拉动时,信息标签会流畅显示。 绕地球旋转的动画球也增加了巨大的视觉吸引力。

WebGL Demo

8. Google Maps Cube (8.  Google Maps Cube)

Google Maps Cube is a game whereby you rotate your cursor around a cube, tipping the cube in a given direction, so as to get a ball to a destination on the map.  This is an interesting, creative use of Google Maps and very well executed.

Google Maps Cube是一款游戏,您可以在其中绕立方体旋转光标,将立方体向给定方向倾斜,以将球传到地图上的目的地。 这是对Google Maps的有趣,创造性的使用,并且执行得很好。

WebGL Demo

9.埃莉·古尔丁的灯 (9.  Ellie Goulding's Lights)

This demo may be the most impressive of the lot but I have to feature it last to hide my shame in that I really enjoy this...song.  Oh, but the demo.  This demo is outstanding, with lights...lots of lights.  As the music plays in the background, you navigate a beam of light through hills of lights.  Press down on your mouse and the beam of light accelerates.  As the demo continues, more and more lights and colors come into the animation.  I can't recommend this demo enough.

这个演示可能是最令人印象深刻的,但是我必须最后展示它,以掩饰我真正喜欢这首歌的耻辱。 哦,但是演示。 该演示非常出色,有灯光...很多灯光。 当音乐在背景中播放时,您将一束光束导航穿过山丘。 按下鼠标,光束加速。 随着演示的继续,越来越多的灯光和颜色进入动画中。 我不能推荐这个演示足够。

WebGL Demo

I have to say that I believe these nine demos are shocking and possibly better than the original nine.  The great work being done by animators is awe-inspiring and hugely ambitious.  I hope you strive to greatness after seeing these massive demos!

我必须说,我相信这九个演示令人震惊,并且可能比原始的九个演示更好。 动画师正在完成的伟大工作令人鼓舞,而且雄心勃勃。 希望您在观看了这些巨大的演示后努力实现卓越!

翻译自: https://davidwalsh.name/webgl-demo

webgl1到webgl2

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值