We are updating our Mars panorama WebGL tool to include the latest Mars Science Laboratory (MSL) “Curiosity” panoramas as they get created at JPL. The display system demonstrates some capabilities of WebGL – an API that allows browser-based systems, via HTML5, to directly exploit the power of your system’s graphics card.
Ashima Arts is developing a range of technologies to allow developers to use WebGL more effectively and efficiently. Check out our upcoming presentation at the 2012 OCaml Users and Developers Workshop (Sept. 14, 2012 in Copenhagen, Denmark). The usual caveat is in place that the display tool will not work for some combinations of browsers and graphics cards (and as usual, friends don’t ever let friends use Internet Explorer). In case this doesn’t work on your machine, here’s a youtube video showing the demo running on one of our Mac laptops.
We’ve mentioned our implementation of Perlin simplex noise in GLSL in a couple of prior posts – this is now sometimes also referred to as “Ashima noise.” The paper describing the noise function was just published in the Journal of Graphics Tools. The paper is available in its final aesthetic form at the publisher’s website. A preproduction version (with the same informational content) is available from the arXiv.org site. The code is available via github .
UPDATE: Check out video of David Sheets’ presentation at WebGL Camp Orlando from Friday March 16.
UPDATE: David Sheets is scheduled to speak at the next San Francisco WebGL Developer’s Meetup in May.
We have just released our first version of gloc, a toolkit for WebGL and OpenGL ES2 GLSL shaders. The purpose of gloc is to make it much easier to build – and much easier to share – shaders. As a result, we hope gloc will help to further the creative potential of 3D graphics on the web and mobile platforms. (gloc links our creativity!)
With gloc, shaders and shader fragments, for numerical and graphics functions, become portable first-class web resources.
What gloc enables:
- Libraries of shader functions
- Capability-based shader component fall-backs
- Collaborative shading effect mash-ups
- LD_PRELOAD-like functionality
- Compression by factorization of common shader functions
What gloc makes much easier:
- Semantically-linked shaders in visualization systems
- Cascading shaders for selective overriding
- User Interface effects and compositing
- and much more!
Where gloc lives:
The source code for the gloc suite version 1.0.0 has been released under the BSD 3-Clause license on GitHub. A Web interface is immediately available.
How gloc works:
gloc pipeline: gloc transforms ES SL into glo object files which are subsequently linked by glol with other glo resources to produce complete WebGL shaders.
We’ve collected together a bunch of panoramas from the surface of Mars, taken by NASA spacecraft over the last 15 years, and wrapped them in our WebGL panorama viewer. The viewer takes panorama images in equirectangular coordinates (that’s just even spacing in equal increments of latitude and longitude) and manipulates the projection – so this is an example of 2D pixel manipulation. The panoramas were all generated by a combination of the Jet Propulsion Laboratory, University of Arizona, Cornell University, and/or Arizona State University (depending on which mission the specific images were from). From top to bottom, the panoramas are: 1. Spirit at Eagle Crater; 2. Spirit in the Columbia Hills; 3. Spirit’s final panorama from ‘Troy’; 4. Opportunity at Victoria Crater; 5. Opportunity on the rim of Erebus Crater; 6. Mars Pathfinder landing site; 7. Phoenix Lander landing site. To move around the panoramas, use the image scroll function. You can use the magnifying buttons to zoom in and out.
Here’s a great example of our noise function used to power a beautiful piece of 3D art in WebGL. Click on the image to go check it out (with a WebGL-enabled browser, of course…)
Ashima Devices’ first demo of its 3D reconstruction and display technology just went live on the web. With a WebGL-enabled browser – and a modern GPU and drivers – you can check out the demo at the Ashima Devices website. The demo provides an idea of how a customer finished product would look – in this case if partial building reconstruction were required.
So we have finally got the contracts in place to start work on a cool interface to the Lunar Reconnaissance Orbiter moon data and modeling coming out of the Diviner team at UCLA. The idea is to re-use the indexing system we developed to localize game events on a true-world-sized virtual planet. We are taking that same game engine and using it to aid in model and display Diviner data and thermal model maps in real-time. And by real-time, I mean full 3D at (hopefully) FPS game speed, and in a web browser using HTML5 technologies!
As part of our Ooman game tech demo release, we open-sourced some code including a new implementation of simplex noise. Noise is a key component of making procedural game assets: instead of loading in a texture for marble or clouds (or most materials), you can calculate these noisy aspects of nature on the fly, and at different resolutions.
For webGL (and for a few other applications), current implementations of noise are problematic because of resource demands. Our version of noise fixes these issues and has been gaining notice in the community. Check out this post from WebGL.org:
“Mar 17, 2011 – Since its inception, GLSL has sadly lacked native support for noise(). A few GLSL implementations of Perlin noise have been presented over the years, but now it seems like we have a winner. Ian McEwan of Ashima Arts has come up with a very clever version of “simplex noise” that requires neither texture access nor arrays. It is compatible with WebGL, it is a set of self-contained GLSL functions with no external dependencies, and it runs fast. A demo with full source code has been posted to the GLSL developer’s forum.”
We are releasing a “vertical slice” of our new game tech demo, Ooman. Ultimately, our goal is to make Ooman an immersive 3-D puzzle platformer in a “real” virtual environment. This means full use of three spatial dimensions with smooth camera interpolation from any angle. The demo highlights the 3D environment tech using WebGL including our camera model and character motion system.
The key thing here is: this is smooth, 3D game play native in a web browser!
“Click friction” is the drain on a game’s potential player base associated with making the player jump through hurdles to get to the game. A major hurdle is the client download – people hate waiting for software to download and are afraid that what they’re downloading might actually be a virus. But the flip side of the problem – building a game that doesn’t require a client or plug-in download – usually means poor quality 2D or isomorphic ’3D’ graphics. Here’s where WebGL comes in.
WebGL is a piece of the new HTML5 standard, and it allows direct access to the graphics card from the browser. With WebGL, the same kinds of 3D graphical environments that can be built with OpenGL / OpenGL ES can now be built right into the browser. In principle, a player could be in a game with a single click and from any browser on any platform (so long as the browser supports the modern HTML5 standard and has non-antiquated graphics cards / drivers). The WebGL standard is still developing, but here’s an example of a demo game room to give some idea of the possibilities: