Join a community!

The Free Ebook Foundation envisions a world where ebooks will be funded, distributed and maintained for the benefit of all, by coordinating the efforts and resources of many.

You can find thousands of freely available programming books at https://github.com/EbookFoundation/free-programming-books/blob/master/free-programming-books.md

Go and amaze yourself!

In October 2014, HTML 5.0 final version arrived. HTML 5 includes in the norm significant definitions for several media (audio, video, 2D graphics) but, sadly and against what was desirable, 3D is absent. At least apparently because, on one hand, VRML/X3D the "official" norm was not revoked (although never widely adopted and still relaying on third party plugins)  and, on the other hand, recently a "de facto" norm, WebGL, is emerging strongly and already runs plugin less over the major web browsers.

In this series of short blog articles we expose our view on two decades of 3D graphics for the Web. VRML past, why according to several evidences WebGL is the road ahead and the new phase of WebGL era coming with full grown 3D applications, like Unity 3D and Blender, being WebGL ready:

1. VRML/X3D: the first 3D graphics standard for the Web (part I)
2. VRML/X3D technology, What went wrong? (part II)
3. WebGL, the road ahead for 3D on the Web (part III)
4. Tools for designers with some programming skills (part IV)
5. 3D Graphical editors and Web deployers (part V)

• Please feel free to comment the posts and add your own information or corrections so we make emends to the text. Thanks!

Before any statements about the future of Web 3D graphics on part I we rationalize and review in short what we have learned from the history of 3D graphic standards for the web.

1 - VRML/X3D: the first 3D graphics standard for the Web

Proposed in 1994 by web3d,org an organism under w3c.org, VRML/X3D technology has been around for two decades and is "the", so called, 3D graphics standard for the Web. Yet, despite this "official" status, it was never implemented natively on any major web browser. Until today users must consider installing a plugin in order to run VRML/X3D content inside a browser.

Enthusiasm in the 1990s
VRML looked, back then, cool and unique for the Web. It supported 3D geometry, animation, and scripting. From the beginning and specially on the second half of the nineties VRML/X3D gathered considerable attention and enthusiasm among, artists, engineers and educators. Since it was doing well and achieving an interesting (moderate) widespread and use over the Web, the enthusiasm spread engaging some reference public and private organizations, from NASA to SUN corporation. Even today search engines still show a significant evidence of the quantity and quality of VRML work done back then. Beside its own potential and "official" status as a web technology, some key important factors have contributed to this early enthusiasm and use of VRML:

• In the mid-nineties, during the first “browser war" days, Netscape and Microsoft had their focus on every relevant novelty and, in no time, Netscape Navigator and Internet explorer had, each one, their free VRML plugin to offer. That was an obvious incentive for users to install VRML capability on their browsers and use 3D on the Web.

• Some Innovative 3D multiuser VRML worlds with avatars, most using technology from Blaxxun (initiated on a start up, "Black Sun", born at Sun Technologies) .
  Black Sun's worlds (1997),Cybertown (1997) and “Le Deuxième Monde” (1998) are among the most significant and iconic projects done in VRML on the nineties. They gathered legions of world users around this technology.
  More than 3D graphics blaxxun technology brought 3D multiuser communities to the Web. As I remember they looked incredibly innovative and the appeal was ... overwhelming!

In the next part (part II) we rationalize about how VRML/X3D technology changed from a phase of initial enthusiasm to the present low pace.

Vitor Cardoso

Continued from Part I and Part II

3 - WebGL, the road ahead for 3D on the Web

At this point we rationalize about WebGL and the available reasons and evidence pointing it as the road ahead.

What is WebGL?
In mid 2000s the non-profit khronos group deploys OpenGL ES, a 3D rendering API for mobile and "embedded systems" (ES), based on the desktop long-established 3D rendering standard OpenGL but optimized for mobile/handheld devices. As an industry standard and royalty free, OpenGL ES became universally adopted on small computing devices, most notably phones and tablets to deliver a hardware-accelerated 3D experience. WebGL is a Web version of OpenGL ES 2.0. The designers felt that, by basing the API on OpenGL ES’s small footprint, it would be more achievable to deliver a consistent, cross-platform, cross-browser 3D API for the web.

WebGL is implemented as low-level API JavaScript. It uses the HTML5 canvas element and is accessed using DOM (Document Object Model) interfaces. Automatic memory management is provided as part of the JavaScript language. As such WebGL runs directly in browsers (desktops or mobiles) without the need for a specific plugin to harness the full power of the computer’s 3D rendering hardware. It is today supported by all the major browsers (IE, firefox, Chrome and Safari) on desktops and mobile platforms.

Why WebGL?
Some relevant aspects:

1. Technically sound and proved standard. WebGL is based on long experienced, widely adopted, open and free standards and is already supported by all major browsers (IE, Firefox, Chrome and Safari) on desktops and mobile platforms. It is the long waited 3D on the web without plugins!
2. It's light and fast. Based on standards with a small footprint, it is more capable to deliver a consistent, cross-platform, cross-browser 3D API for the web and capable to deliver a hardware-accelerated 3D experience using the device GPU directly. We should say here that we where amazed by the incredible speed this scene runs on a three year old galaxy note II mobile phone.
3. Perfectly integrated in HTML 5 canvas. WebGL wires the GPU to the browser with a Javascript-based OpenGL ES API, thanks to the HTML5 canvas tag. This means WebGL content is a DOM element (this was never true with VRML, because it operated as a plug-in) and can be manipulated with the same procedural or formatting techniques as any other element. Its finally at reach a seamless 2D/3D web content integration.

WebGL risks, performance and compatibility
There are some concerns with WebGL security risks coming with direct access to the GPU. Due to these risks, initially Microsoft and Apple refused to support WebGL but that changed in time partially because the browsers war is back again and no one wants to be left behind and also because the upcoming WebGL versions addressed the security concerns. According to WebGL Security white paper, by the Khronos Group, WebGL conforms to all the security principles of the web platform and was designed with security in mind from day one.
WebGL performance is in general not as good as native execution, It is limited by the dynamic nature of JavaScript. Even so, performance has increased over time and the current browser implementations do a great job of optimizing it. In situations mostly GPU-bound, we can now expect WebGL to perform very similar to native code.
Universal WebGL availability and compatibility is growing but, in the meantime, here and there problems may occur. We have experienced problems with android running in virtual machines, which was to be expected, but problems may also occur, as we also have experienced, on systems with older graphics cards (GPU) and/or outdated drivers. In some cases certain features or all of WebGL isn't available. The Khronos WebGL wiki has a list of supported configurations.

How are going the alternatives to WebGL?
Comparing to VRML/X3D, WebGL is an obvious advance. On the other side comparing to Flash is not. Flash has been an incredible platform, done a lot for the web as an interactivity and entertainment platform. The reasons to change from flash to WebGL in the foreseen future are more "political" than technical.
The exact timing is not entirely known right now but there is a declared intention (started by apple in 2010) to end, sooner or later, the support for plugins in major browsers. Specially plugins that run proprietary compiled code. It affects Java, Silverlight, bs contact (VRML/X3D), Unity 3D Web plugin, Flash and many others. This is one of the reasons why Unity dropped flash to switch all development efforts in the creation of a WebGL deployer.

WebGL is already supported on more devices than Flash
"The times they are a-changin". The declared intentions to end the support for third party plugins in major browsers and the mobile market growth are changing the landscape dramatically and Flash isn't anymore the largest platform on the planet for interactive browser graphics. Flash is not supported on mobile browsers out of the box; it primarily reaches Mac and PC desktop browsers. On the contrary, WebGL reaches all platforms, desktop and mobile, via the browsers but can also be packaged into native apps and run independent of a browser on both desktop and mobile. It is now supported on more devices than Flash (according to Wired magazine estimates).
With such a wide support for WebGL, the demand for content is growing rapidly and the software industry is already committing. Tool producers are working on WebGL exporters or already have the solutions to offer. Unity 3D stopped flash export development (the feature was removed in recent versions) and is now committed to WebGL. The next version (version 5, already available in beta and the final coming soon) replaces the former Web plugin by a WebGL export format . Even Adobe itself has adapted its professional tools to produce content in HTML5 and WebGL alongside with Flash. Adobes position is incredibly pragmatic and, obviously, endorses WebGL as the road ahead for 3D graphics on the Web.

In the next part IV we list some fundamental tools for programmers (and designers with some programming skills) to create WebGL content for the on going virtual Web.

Vitor Cardoso

Continued from Part I, Part II, Part III and Part IV

This post is about the best 3D graphical editors to convert and create WebGL content for the on going virtual Web.

5 - 3D Graphical editors and Web deployers

WebGL 3D editors and converters
Although Javascript middleware libraries may be fundamental at some point in the building process, common graphic creators might have a hard time dealing with them. Nothing like using a good graphical 3D editor, indeed. Fortunately a significant number of new editors, tools and plugins (for mainstream 3D editors) appear daily. Look for news and info about them in places like http://learningwebgl.com/blog/.

One of the most interesting new editors is Coppercube (http://www.ambiera.com/coppercube/), a commercial product. Appeared a couple of years ago and was the first WebGL ready 3D editor. Uses CopperLicht, an open source WebGL library developed by the same owner. Coppercube is not (yet) as full featured as mainstream 3D editors like blender, but is clean, easy to use and has been until now one of the few tools around that made WebGL content development easy, practical and exciting, as its demos and user forums show. Check our own tests here.
Unfortunately the absence of a free editor version for non profit users and education somehow restrained a potentially larger dissemination that this fine product have merited. Now that the big named editors are committing to be WebGL ready, coppercube faces a harder fight.

A duo of essential free editors to deploy 3D on the Web
As wee see it today, by the products already in place, the ones coming soon and the intentions declared, Unity 3D is the best positioned to build and deploy Web 3D content, either it is games or interactive virtual scenes and environments, for multiple purposes. Since Unity is not a 3D modeler, designers will need to choose a modeler of their preference and constitute their duo virtuoso of tools.

Unity 3D (unity3d.com)
The reasons why in our vision Unity 3D is a fundamental tool to build and deploy Web 3D content are:

• Unity is a key tool to deploy games and dynamic virtual environments on several platforms: desktop, mobile and Web. Unity Has committed itself to WebGL, starting on the coming soon version 5 (already available in beta, while you don't have it use Unity Web plugin to publish your scenes)
• Unity 3D had, for a long time, a hardly interesting free version since it did not include some essential features of 3D (like dynamic shadows, among others) and that disappointed users. Al that has changed now, Unity has a more open policy in favor of free users and in 2014 the free version come out complete (only a couple of very "high" advanced features, more directed to professional developers differentiate it from the paid version) and now, in our view, the free version is totally adequate for non-profit users and education.
• Adding to this Unity renewed the interface editor (GUI) starting from version 4.6. The 3D editor is now more intuitive and easier to learn for new users.
• Multiuser worlds can be created with current Unity version but it is not an easy task so Unity has also committed itself to deploy, in a short time, tools and features to simplify the creation of multiuser 3D environments and games, an area much appreciated by former VRML/X3D creators and from other 3D communities.

Why Unity's WebGL deployer is so important?
Unity commitment to WebGL is not to be seen as one more in a long list. Unity 3D will be the first "big named" 3D/game editor to have a full WebGL deployer (not a limited exporter for simple stuff). As a reference tool for games and interactive virtual scenes/worlds creation with everything we like to have, including avatars, special effects, and so on, Unity's WebGL deployer has to be incredibly advanced, a first of a kind, in order to generate correctly all the interaction and special effects demanded by commercial games.
This defines a new era for WebGL where we change from experiments with limited tools (even coppercube is an experiment, some features are absent or still in development), limited exporters and "specific" tools to full grown 3D applications that offer in WebGL all we had before for other technologies/3D formats.  All this available for free! It has been already declared that WebGL deployment will be available for both, free and pro versions of Unity 3D.
Take a look at the new Unity build window showing WebGL deploy on the article about the first commercially available Unity WebGL game!. This article has important information and is a vivid confirmation of what we said about Unity´s WebGL deployer importance (update: Unity 5.0 was launched on March 3 2015, confirmed all the information we have advanced here and gone even further with more features and good news for non profit users and education).

Unity uses assets (3D content) that can be created by any modeler you use or prefer, even the easy to use Vivaty Studio (the editor that web3d.org recommends to create VRML/X3D environments) or Sketchup since both export to 3D formats used by Unity. Look in unity manual for more info, like this "How do I import Models from my 3D app?"; once you get it, the process is simple and intuitive. Unity manual has special workflow advices to work with mainstream editors like 3D Studio Max (Max is free for education) and Blender, among others.

If you do not have preference for a specific 3D editor or want to try one of the best around, install Blender. Beginners will probably prefer the more intuitive Sketchup. Use one of these fine 3D editors together with Unity 3D and you will have a duo virtuoso of free tools that constitutes a solid base for a seamless Web 3D content creation workflow.

Blender (www.blender.org)
Free and one of the best tools for 3D. Does not have (yet) its own WebGL exporter, out of the box, but now we can install the excellent Blend4Web exporter plugin (https://www.blend4web.com/en/) and enjoy its promising WebGL conversions.
Blender is a complete tool and can also create games (includes its own game engine) and interactive virtual scenes. With Blend4Web plugin scenes with limited interactivity can be deployed to the web but not games (not yet at least) nor highly interactive virtual scenes. As said before, Blender is much more interesting if used with Unity 3D. In this duo virtuoso Blender is the modeler for objects and scenes that Unity (which reads blender files directly) uses to create the action of the game/virtual environment and deploy to end user platforms. Look in Unity manual for useful info on how to integrate both seamlessly (http://docs.unity3d.com/Manual/HOWTO-ImportObjectBlender.html) or in other sources (http://www.zakjr.com/blog/blender-to-unity-workflow-part-1/).

Have in mind that Blender is a serious choice, surely a good one in the long run, but is not the easiest choice. Even if you have previous 3D editing experience will need at least a week of serious dedication to get the hang of Blender. For a quick evaluation about if this is the 3D modeler for you, do the quick 13 steps of Beginner's Guide to Blender and/or view the fine and comprehensible eight instructional videos of Blender Virtual Smart Book (a free course, also available for mobile devices)

Sketchup (http://www.sketchup.com)
A powerful 3D editor, very intuitive and much easier to work with than blender. Skectchup free version is a great 3d creation tool and exports to collada (.dae), an universal format that Unity3D can import quite well.
Has good documentation, instructional videos, a huge collection of free 3D objects and plugins. Adding to this, Sketchup has a legion of followers and tons of free tutorials and resources on the Web. For these reasons many creators, specially 3D beginners (but advanced creators too) choose it as their primary 3D modeler.

We have presented here a selection of tools, most free, to deploy 3D on the Web. This is intended mainly for students and 3D creation beginners. There are, of course, other alternatives, tools and choices, free or paid, to deploy WebGL content. Keep looking and learning!

Please feel free to comment any of the posts and add your own information or corrections so we make emends to the text. Thanks!

Vitor Cardoso