Category Archives: Demo大赏

Kleki —— 用于准专业鼠绘的 Web App

Kleki是一个类似于Paint和Photoshop的Web App,用户可以在上面用笔触进行绘画。
Kleki中使用了WebGL技术,尤其是使用了在图片处理方面专门优化的glfx库,支持图片的移动、旋转、变换、色调调整、亮度对比度调整、模糊等等。
Kleki的功能相对比较齐全,支持图层操作,还可以将绘制状态利用HTML5的Local Storage技术储存在本地,这项下次打开Kleki网站的时候,还可以继续上次的绘制。绘制完毕后,还可以将图片导出为JPG格式。

Posted in Demo大赏 | Leave a comment

丰田雅力士汽车广告

今天带来的这个Demo来自于丰田雅力士(Toyota Yaris)汽车广告。和传统的FLASH制作的广告不同,这则广告使用了多种HTML5的新特性,并完美的结合在一起,给访问者一种无缝的顺畅体验。粗略数来,其中包括HTML5 Video、WebGL和CSS3等等。另外,广告还允许同时在线的观看者进行互动。尤其是WebGL,广告中的主人公在多处都提到了WebGL。

Posted in Demo大赏 | Leave a comment

WebGL皮肤渲染

这是一个在WebGL平台上为实现人体表皮渲染Demo。此Demo主要使用了次表面散射技术(Subsurface Scattering)来模拟人体皮肤下层发生的散射现象,通过模拟这种光线散射,渲染结果表现出来了非常逼真的皮肤材质质感,令人叹为观止。

Posted in Demo大赏 | Tagged , , , | 2 Comments

2011 Mozilla Demoparty赏析

Mozilla Demoparty是由Mozilla Labs发起的一项旨在启发人们将艺术与web技术相结合的活动,参与者可以自由提交他们的Demo。大部分的Demo都是基于HTML5、WebGL和CSS3等新技术构建的,并巧妙的融入了艺术元素,提高了Demo的内涵和观赏度。本月1日,在历经了网友投票和专业评委的评选之后,获奖作品终于出炉。下面就让我们一起来看看吧!

Posted in Demo大赏, 推荐 | Tagged , | Leave a comment

用WebGL进行局部水体环境渲染

Evan Wallace的Water Demo结合了基于高度的水面渲染、反射与折射(reflections & refractions)、基于统计的漫反射遮挡(Analytic AO)及平滑的实时软阴影生成技术、向我们呈现了一个非常逼真的局部水体环境的渲染解决方案。这个Demo的亮点在于将多项常用图形渲染技巧精彩完美得结合在一起,并使用WebGL技术在网页前端展示出来,同时也验证了基于浏览器前端硬件加速能力的WebGL应用,已经可以达到非常高质量的实时环境渲染水平了。

Posted in Demo大赏, 推荐 | Tagged , , | 1 Comment

用WebGL实现光线追踪!

作为一种计算复杂度为O(n*n)的算法,由于计算机的速度问题,光线追踪目前仍然无法大规模应用于实时3D演算,暂时只能用于电影CG和渲染效果图等领域。这个基于WebGL技术实现光线追踪的Demo,实验价值大于实用价值,但仍然给了我们很大的启发,显示出WebGL技术强大的潜能。

Posted in Demo大赏, 推荐 | Tagged , , | 4 Comments