WebGL around the net, 2-July-2014

Web-based Virtual Reality: fast, cheap, out of control and now RUNNING IN YOUR BROWSER.

  • Virtually Awesome! Vlad  Vukićević, WebGL creator and VR guru at Mozilla, discusses the First Steps for VR on the Web. Firefox now has support for Oculus stereo rendering of Canvas elements, CSS3 3D transforms, mixing Canvas and CSS into single 3D display space, and VR head tracking.
  • Rye Terrell of TyroVR has created a Three.js renderer that uses the new Firefox APIs; the site also has an excellent getting started tutorial.
  • Brandon Jones of Google just released his VR update about Chrome… now in Chromium nightlies!
  • Google is trying to keep one-up Oculus and keep up with Firefox with its new Chrome VR Experiments demo site. The site is really for Android-based Cardboard apps, but you can see the demos in mono on a regular web page.
  • Music video + WebGL + embeddable content == three great tastes! Google’s The Cube is “an experimental platform for interactive storytelling” that features videos playing on a cube surface, connected to Google Play. A new way to sell music?
  • Check out this beautiful national park visualization powered by BabylonJS. Geotrek.fr, a territory management tool developed by Makina Corpus, is going to incorporate 3D features in an upcoming  release. Here is additional information on  camera positioning according to the land features, and the making of Geotrek 3D. Non-francophones – the sites are all in French. But the visuals are worth the trip and you can always try to get Google to translate.
  • Here is a nice particle physics simulation running entirely on the GPU, developed by Christopher Wellons.
  • Perf matters: last week I gave a talk on WebGL and Web Site Performance at WebPerfDays Silicon Valley. We are just at the beginning of this field of study – and I encourage WebGL devs to start thinking about traditional web site performance issues when scaling up your applications to reach millions. Feel free to comment on the SlideShare or mail me directly if you are keen to do something in this area.

WebGL around the net, 24 June 2014

3D ads and popup books! It doesn’t get more fun than this in WebGL Land. Here are this week’s developments:

  • Glacéau Smartwater has launched a beautiful 3D ad campaign, Explore the Sky. The ad features animated camera fly-throughs and great interaction. You can even paint clouds in the sky! Could this be a glimpse into the future of web advertising?
  • Want to create your own 3D Popup Card? Check out http://www.chromeexperiments.com/detail/3d-pop-up-card/
  • This week on Chrome Experiments features The Life of a Particle, “A particle simulation from another perspective — inside.” I’m not sure what that means, but this thing is damn gorgeous.
  • Here is a behind-the-scenes look at creating the amazing Urban Jungle Street View. It’s a fantastic, insightful writeup by Einar Öberg, Developer and Technical Director at North Kingdom in Stockholm.
  • Tarek Sherif, Software Developer at Montreal Neurological Institute/McGill University, has released BrainBrowser v2.0.0 – a new, mobile-friendly version of the real-time neuroimaging visualization software.
  • The Khronos Group has announced a WebGL Widget Contest. Here’s your chance to get your 3D content onto the WebGL spec home page! Submission deadline is August 1st, so better get crackin’.
  • CL3VER has released Version 2.1 of their viewer that touts higher performance on all devices.
  • Version 0.56 of taccGL, the JavaScript class library for HTML5, CSS and WebGL page creation by Helmut Emmelmann, is now out. taccGL can animate integrated scenes of HTML+CSS elements and 3D objects with depth buffering, lighting, and shadows; map HTML elements on 3D objects; or align 3D objects with HTML elements. Transitions include linear motion, accelerating, rotating, fading, deformation, or processing with customized shaders.

WebGL around the net, 17 June 2014

Virtual Reality and Stereo Photography lead this week’s WebGL developments.

  • At last week’s San Francisco WebGL Developers Meetup, we got a glimpse of WebGL running on the Oculus Rift. The very next day, Josh Carpenter and Vlad Vukićević of Mozilla announced that Firefox nightly builds will soon include native support for Oculus Rift head tracking and stereo rendering! Check out their great talk on the future of web VR on Air Mozilla. Also, Brandon Jones of the Chrome team said that they will follow suit with their own Oculus support in upcoming Canary builds. (FYI the Oculus WebGL demos I presented can be found here in my Vizi and Glam repos on Github.) And here’s my rant about where this is all going…
  • Last week, Light Field camera maker Lytro announced a WebGL open player for inclusion into partner web sites, so that users can upload their Lytro creations for others to view on the web.
  • At long last, Microsoft has launched an Internet Explorer development channel. New IE builds feature much higher WebGL conformance, up from 93 percent to 97 percent. See The Next Web coverage for more information.
  • San Francisco-based Ludei has released version 2.0.1 of CocoonJS, featuring performance improvements, and cloud compiler support for Apache Cordova.
  • Callum Prentice, Second Life developer by day, and enthusiastic WebGL hacker by night, has released this wonderful Three.js application template generator: fill in the blanks, and out pops a working Three.js app!
  • Check out Wizard Warz,  experimental multi-player WebGL game. Nice art!
  • Michael DeLay has created a drag-and-drop WebGL audio visualizer with beautiful graphics.

WebGL around the net, 10 June 2014

Open source gaming, terrain generators and music visualization lead this week’s WebGL headlines.

  • TOP STORY: PlayCanvas is now open source! This is an excellent game engine and great tool set. Go forth and make great games, people!
  • Isaac Sukin, author of  a book on game development with Three.js, has written a terrain generation engine for use with Three.js. Here is the code, and a really nice demo showing off the engine. It’s fast and makes great terrain using a variety of well-known algorithms.
  • WebGL jock Florian Boesch has looked into the new iOS WebGL implementation and found some issues. Here’s his report.
  • Copenhagen’s Vibeke Bertelsen aka Udart has created a trippin’ WebGL animation set to music. Two 3D models are distorted using an animated normalmap material. Bertelsen also perform live at concerts as a VJ with these WebGL graphics, tweaking the animations in real time.
  • London-based Damien Mortini has also developed a great interactive music piece. Check out this house music – literally – using Santa’s house as the interactive playground. http://www.chromeexperiments.com/detail/house/
  • Video: write massively parallel code using the GPU and WebGL. http://vimeo.com/97329154
  • Video: delightful WebGL built in the Elm functional programming language http://vimeo.com/97408205

WebGL around the net, 3 June 2014

WebGL in iOS 8. ’nuff said.

  • As reported in Gizmodo and everywhere, at yesterday’s opening day of Apple WWDC, the company showed WebGL turned on by default in Safari on the upcoming Mac OS X 10.10, code-named ‘Yosemite’. (In case people didn’t know this: WebGL has been in desktop Safari for years already, hidden under a Developer menu… but now it’s turned on by default. Nice I guess… but don’t act like you invented it, Apple!) MUCH more importantly however: people are discovering that WebGL is running in the beta of mobile Safari on iOS 8! The site HTML5 Test indicates this, as well as independent confirmation by AlteredQualia, Jay Moretti, Cecile Meuller (60FPS Quake 3 on iPad 2!!! http://vimeo.com/97167583) and there’s even been a Pearl Boy sighting. This is a very big deal. The final domino of WebGL world domination is toppling…
  • Two great tastes that go great together: Conroy’s Game of Life running in a WebGL shader http://www.chromeexperiments.com/detail/colorful-life/
  • Here is a nice Chrome Experiment using WebGL for a multiplayer football game (er, that’s “soccer” to us Yanks).
  • Blend4Web release v14.04.22 is now out, with a bunch of new features and nice demos. http://blend4web.com/en/article/17
  • Londoners: the next FREE London WebGL Workshop will be Thursday, June 26, 2014 6:30PM. They’ll be taking a look at how WebGL can be employed to visualise your data. Venue: SkillsMatter, 116-120 Goswell Road, London (http://skillsmatter.com) Register: (http://www.meetup.com/WebGL-Workshop-London/events/186608872/)

WebGL around the net, 27 May 2014

This week in WebGL: Tetris, quantum computing, and… Assassin’s Creed!

  • BlockTris is a 3D version of Tetris. Warning: maybe become habit-forming.
  • Jerome Etienne shows his THREE.X terrain generator game extension built with Perlin noise.
  • The awesome Potree point cloud renderer has been rewritten in Three.js! Check out the beautiful new demos on the site.
  • Simulating a quantum computer with WebGL. To see it in action, make sure to hit Compile, then Run. http://qcplayground.withgoogle.com/#/home
  • Tarek Sherif of BrainBrowser fame has put together some beautiful procedural texture shader examples featuring shadow mapping.
  • Is Flash dead? Marcus Kruger from the Goo team wrote an article on the subject for Wired. Read the flak he gets in the comments, especially entertaining! I’m on Marcus’ side… but what do you think?
  • Get immersed in your world: NICTA, Australia’s Information Communications Technology Research Centre, has created an Oculus Rift Plugin for the Cesium virtual globe and mapping engine.
  • And finally… not to be outdone by Mozilla’s aggressive stance on in-browser gaming, Microsoft has gotten into the act. The Internet Explorer team joined forces with Ubisoft to create an Assassin’s Creed Ship Race in WebGL!

WebGL around the net, 6 May 2014

Lasers, robots and Machinima top this week’s WebGL developments.

  • Jerome Etienne, creator of the great blog Learning Three.js, has been a busy boy with his ‘one THREEx a day’ challenge. Here are how-to’s on developing threex extensions for video textures, realistic physics, and dynamic lasers. Choose your next witticism carefully, Mr. Bond; it may be your last.
  • Giles Bowkett has developed a great video and software package that demonstrates how to create Tachikomas, or  robotic spider tanks, in WebGL. The package isn’t free, but it’s inexpensive and chock full of great info. Check it out.
  • The folks behind Blend4Web show how to make simple WebGL Machinima in this article.
  • WebGL game developers should check out the updated version of Craig Buckler’s intro to the Fullscreen API, highlighting the latest changes.
  • Want faster physics? Ok with a sprinkle of native code in your browser? Then you might want to have a look at this physics demo created using a port of Bullet to PNaCl (Portable NAtive Client). Fast!
  • There’s a new game engine in town: Minko Engine. This one boasts cross-platform support for HTML5/WebGL, iOS, Android, Windows, OS X and Linux and is MIT-licensed. The online demos and peppy and look great. More information can be found at http://fr.slideshare.net/Minko3D.
  • Finally, from the How’d I miss this? department: a stunning promotional piece for Nestle’s Special.T Ô Green brand tea: a gorgeous, tranquil underwater scene http://ogreen.special-t.com/en/.

WebGL around the net, 24 April 2014

_

  • CORRECTION: Our humblest apologies to Tarek Sherif, the true guru in charge of BrainBrowser.  Last week we mistakenly reported that the tool was created by “a team at McGill University lead by Nicolas Kassis.” Apparently, Kassis left McGill two years ago after creating the original application in O3D. The current iteration of BrainBrowser as a WebGL app, library and web service has been developed almost entirely by Sherif. (For the curious, full credits can be found here.) Sorry, man… our bad. And again: great work!
  • For anybody in the San Francisco bay area: I am presenting tonight at the Tales of JavaScript meetup: HTML5 and WebGL Game Evolution and Development. My usual fare, plus some Oculus ranting for good measure. I hope you can stop by. If not, the slides for my talk, The Browser as Console, can be found on SlideShare.
  • Londoners: the next FREE London WebGL Workshop, on Writing Shaders and Effects for Three.js,  will be held on Thursday, May 22, 2014 6:30PM. Register at http://www.meetup.com/WebGL-Workshop-London/events/177288532/. Venue: at SkillsMatter, 116-120 Goswell Road, London (http://skillsmatter.com). Prerequisites: A laptop with a browser that supports WebGL and an editor that can handle HTML and JavaScript. Some knowledge of HTML and programming, preferably JavaScript (or similar).
  • Faskat-Neon is *coolest* neo/retro Tron-style game I’ve seen in while. Code and design by Andrea Doimo – music by Fabrizio Radica.
  • The folks at Goo made a lovely Easter egg featuring their little minion guy. I know, cutesy, but the rendering is really nice on this one.
  • Two great Chrome Experiments hit the site this week: http://www.chromeexperiments.com/detail/dollyzoomjs/, which covers cinematic camera dolly techniques, and http://www.chromeexperiments.com/detail/light-paint-live-mercury/, a light painting experiment that uses the GPU to composite frames, like a real-time photo exposure simulation.
  • Haxe fans: Brazil-based Eduardo Pons has just released a preview of his new engine Haxor, a Haxe language-based game engine and Rich Internet Application framework. Here is a nice dungeon level demo. Use arrow keys to move  (animation uses GPU skinning), space bar to attack (featuring cross fades), 1, 2, 3 and 4 keys show debug gizmos for various features, and there are light maps and 8 dynamic lights. Off to a good start!

WebGL around the net, 17 April 2014

This is your brain on WebGL: browsing the human brain and the Earth’s weather in 3D are top in this week’s developments.

  • A team at McGill University led by Nicolas Kassis has developed BrainBrowser, a set of web-base 3D visualization tools for neuro-imaging. Browse the human brain in real-time at https://brainbrowser.cbrain.mcgill.ca/
  • Zooming outward, take a look at World Weather Viewer, an WebGL weather forecast application that displays current world wide pressure, wind, humidity, and surface temperature on an interactive globe.
  • Look down: you can see the Pompeii Ruins in a point cloud visualization developed using the Potree WebGL PointCloud Viewer. Stunning.
  • AlteredQualia continues his groundbreaking WebGL rendering work: here is a great demonstration of deferred skin rendering using physically-based rendering and filmic tone mapping.
  • Kevin Roast, a total stud when it comes to rendering 3D with the 2D canvas API (his Phoria library is featured in Chapter 7 of my new book, plug!), has branched into real-time 3D with various GPU shader experiments in distance fields and generative art. Great stuff!
  • Is your boss getting on your case about playing with WebGL during work time? Here’s some extra ammo from Cesium’s Patrick Cozzi on why WebGL should be used for graphics research. Might help?
  • The folks from Ambiera have released version 4.5 of CopperCube. The game engine now has the option to publish WebGL games with fullscreen and pointer lock support, meaning first person games and apps are now easy to use when run from websites. There is also a new WebGL demo available, showing this feature in action: http://www.ambiera.com/coppercube/demo.php?demo=fpsdemo&mode=webgl

WebGL around the net, 8 April 2014

A fresh crop of development tools leads this week’s WebGL headlines.

  • CL3VER is a cloud-based 3D engine in HTML5 and WebGL to create and publish interactive 3D scenes on web and mobile. They recently released the latest version of the product, which includes a free way for architects to publish designs and presentations to their clients.
  • The team at Clara.io has some great new samples to check out: http://clara.io/?mc_cid=448bd04d01&mc_eid=a428ee9647
  • New kid on the block Blend4Web (http://blend4web.com/en/) develops  a software framework for authoring and interactive rendering of three-dimensional graphics and audio in browsers. The platform is intended for creating visualizations, presentations, online-shops, games and other rich internet applications, and is integrated tightly with Blender (hence the name).
  • Still reeling from the Oculus acquisition? Me too. Here is Brandon Jones’ take on it.
  • Welcome to the modern age, Unity! In this interview from GDC, CEO David Helgason presents his vision for the future of gaming. Guess what? WebGL looms large…
  • How Did I Miss This? Dept: Check out Matter.js, 2D rigid body physics library http://brm.io/matter-js-demo/ Also fast animated WebGL fractals.
  • And, finally, for those of us like me who think you can’t have enough WebGL aquaria… here is FishGL, from the RethinkIE team at Microsoft.
Subscribe to RSS Feed Follow Learning WebGL on Twitter