WebGL today. Just a hype or future of our industry?

What exactly WebGL is?

WebGL is an implementation of a low-level programming interface for 3D graphics based on the OpenGL ES 2.0. It uses DOM and HTML5 Canvas element for this purpose.  WebGL is designed and maintained by the Khronos consortium, but also big concerns related to web browsers market working on development of this technology, namely: Google, Mozilla, Opera and Apple.

WebGL capabilitiesc

At first I will show how you can use of this technology. On the internet you can find lots of applications, tools and showcases, that presents opportunities and high potential of WebGL. Below I list some personally most interesting examples and briefly describe them.

I think so far the most widely used solution for placing preview of 3D models directly on the website. Ideally suited to present projects on the portfolio or fast sharing preview model between users.

Very impressive tool for the so-called sculpting, or virtual "carving". This application really made ​​a big impression on me. Currently on the market there are many applications for scuplting such as Mudbox, Zbrush but it most reminds me of Scupltris. Impressive is that it is possible to make such a tool while maintaining pretty good performance and stability.

Very interesting tool for building interactive 3D scenes prepared to act directly on the website. Scenes prepared in the above applications can additionally be scripted so that we can plan the interaction between the elements of the scene.

One of the many graphics engines currently available on the web. Still in the development phase, but the demo shows the remarkable potential that this solution brings.

Another graphics engine, but the company also offer a tool for creating a scene and interaction design as in the case Verold. In addition, producers have delivered a very nice demo.

Port of the popular Unreal Engine 3 to Javascript using asm.js , Emscripten, WebGL and other technologies, they managed to prepare a very efficient demo that runs in the browser without additional plug-ins.

Another interesting thing, port of I think every well-known game of Quake 2. It allows us to play in this iconic game without installing it locally on your computer. In this link you can see how this attempt went and go back for a moment to the old days.

An interesting and impressive simulation of rippling water in the ocean using WebGL

One of few, very enjoyable game prepared by Google.

A perfect example of WebGL capabilities for marketing and advertising. The demo allows you to better understand the history, character and the film world. Google already presented similar demos for other films.

These are some examples, more can be found among others on Chrome Experiments and on the library Three.js  to which I strongly encourage.

WebGL vs website design industry

Here are some examples of the possibilities presented WebGL. Of course there are many more, such as placing interactive data visualization, 3D charts and three-dimensional elements directly on the website. Here are some solutions:

WebGL libraries

As WebGL is an API for Javascript, along the spread of this technology began to form libraries for the language to facilitate the creation of 3D scenes in WebGL. Some of them implement comprehensive solutions while others assist in specific operations. Also created a comprehensive graphic engines, and even graphic editors for creating scenes that do not require knowledge of Javascript, some of which appeared in the "Possibilities" section. However, I will discuss some of the most critical and fastest growing solutions.

One of the first and most extensive libraries allowing for quick and easy access to the WebGL API. Implements a lot of ready-made solutions such as matrix operations and vectors, predefined 3D primitives among others cube, circle, cylinder, cone, etc., the manipulation of the camera, lights, and basic shaders.

Example:

If you're going to start having fun in WebGL I recommend just start from the knowledge of this library.

The library built based on Three.js, which introduces a syntax similar to that of jQuery. In addition, allows you to easily write plugins.

The library built based on Three.js, which introduces a syntax similar to that of jQuery. In addition, allows you to easily write plugins.

The library built based on Three.js, which introduces a syntax similar to that of jQuery. In addition, allows you to easily write plugins.

These are some of the important libraries, which is worth a read. More can be found on the official WebGL wiki.

Future or hype?

As you can see WebGL creates huge opportunities for Web, games developers, animation and graphic artists. In conjunction with the new HTML5 capabilities, such as Web Audio, WebSockets, Local Storage API, WebRTC, etc. allows you to create advanced and professional applications running in the browser. A perfect example is the first commercial game based on the latest technologies

Therefore a question arises whether the technology has a wider future, or will be only an enrichment that will be used only for some pages. It should be considered its practicality in the case of using it to provide content in the form of Web pages.

The content is still a key element of the web site and searching for information on the Internet, however, we expect that we will find there primarily information. Information on the other hand can be classified and presented in a different way, a good example are infographics, charts and diagrams.

So why the big companies are fighting for the widest and most effective support WebGL in their products?

Even in his latest Sony Playstation 4 uses WebGL to render the user interface. Google releases more and more demos under the Chrome Experiments collaborating with numerous world titles and developers. Mozilla is working with Epic over the port of the Unreal Engine 3, and adds option to live edit shaders from Firefox developer console. The creators of devices and mobile systems also strive to provide the best possible support for this technology.

Well, the good support of web technology allows it to use the program written in Javascript for all of these devices, without major modifications, and most of them is to adapt the interface to the screen size of the device. However, it remains a utopia. Mainly due to the performance of devices, but it is impossible to create applications that will run flawlessly on any hardware. Of course it is difficult to expect and there is nothing surprising in this, however, many developers of such applications, and these technologies brags about the opportunity to work with them on any hardware that supports WebGL and HTML5, which of course is not entirely true, as the likely application starts, but on the part of the device's performance will not allow for comfortable use.

Despite its flaws, I welcome the fact that in the future it may become possible, but I would never be a happy medium.

All interested in learning about technology and programming 3D graphics in the browser would recommend undergoing course on Udacity.com

In addition, I encourage you to play the game that our company developet called Skytte, although it does not use the opportunity to WebGL, but takes advantage of HTML5 Canvas element and Web Audio. But certainly in the near future also will use WebGL in our projects.

Navigate the changing IT landscape

Some highlighted content that we want to draw attention to to link to our other resources. It usually contains a link .