Is WebGL the Technology of the Future? What’s AexolGL?

By  on  

Many companies and people from the IT world claim that WebGL is the technology of future. Is this a correct statement? WebGL has many advantages, one of its biggest is that it is a technology that could revolutionise the gaming experience. With WebGL we can play 3D games directly in the browser without downloading any plugins. In the era of easy Internet access, web based projects have great commercialization potential, which is tempting to big players from the gaming market. What are the negatives then? First of all WebGL technology is not that easy.

Need of Frameworks

WebGL technology is not easy for developers and it is almost impossible to code in without a framework. In comes the AexolGL engine. We came up with the idea to create a framework which would make writing a WebGL code easy and enjoyable. Our goal was to do all the hard work for the developer and I think we have succeeded. Using AexolGL ensures developers don't have to worry about complicated GL functions. AexolGL comes with simple RenderTree and GameObjects:

//Treemethod
world = newScene()
shad = basicShader({})
shad.setParent(world) 
mat = new Material({color:[1.0,1.0,1.0]}) 
mat.setParent(shad)
sphereMesh = Mesh.sphere() 
sphereMesh.setParent(sphereMesh) 
sphere1 = new Aex() 
sphere1.setParent(sphereMesh) 
sphere2 = new Aex() 
sphere2.setParent(sphereMesh) 
sphere2.move(0,2,0)

//GameObject method
sphere3 = new GameObject(world, { 
	mesh: Mesh.sphere(30).scaleUniform(50.0), 
	shader: basicShader({}), 
	material: new Material({color:[1.0,1.0,1.0]}) 
})
sphere3.rotate(0,90,0)

Enhanced Texture Performance

Obviously WebGL has its flaws. There are some fields in which it needs to be improved or even reimagined. A good example is WebGL's texture performance, which is a little archaic, you need to share memory between textures and runtime events. AexolGL binds textures to a mesh, draws an object and then finally unbinds textures. With this texture system you can have the maximum number of textures per mesh. Furthermore it improves performance on older and integrated graphic cards.

Infinite Degrees of Freedom Pivot System

AexolGL pivots are created to set up 3D objects matrixes. Let's take a car as an example. It has 4 wheels (usually). A wheel rotates around its X axis when you accelerate or brake. You also need to rotate it around its Y axis to turn. If you have a flat tire, you will have to remove it and put it inside the trunk. How to handle these events? The solution is AexolGL's Pivot system, with which you can create as many local coordinate systems as you want.

speedOfWheel = newPivot() speedOfWheel.add(car.tire).add(car.inner_rim).add(car.Material__80).setPivot(car.tire.position)
turnOfWheel = newPivot() turnOfWheel.add(speedOfWheel.setPivotToCenter()

Reflections Made Nice and Easy

What makes 3D scenes so beautiful? The answer is simple ­ realism.

WebGL Reflection

More detailed examples at http://gl.aexol.com

AexolGL offers many visual features which could enhance your projects. Create beautiful reflection maps from images or snap them inside a 3D environment. Reflections are especially useful in regard to realistic metal or car paint element depiction.

WebGL Scene

Point Lights with Shadows

We are aware that our 3D world can not seem real without shadows. That's why we have created shadowing features like real-time point light shadowing and hard shadows system, which give you free reign over creating shadows.

Cubic Z­Buffer implementation

Snap the whole environment in one cube for later use as an environment, shadow or reflection map. Create a Zbuffercube and put it in the desired place.

A Long Lasting Project

Nowadays many WebGL engines are created and soon abandoned. Although our WebGL engine is totally free, we will keep extending its functionality. It's not a GitHub project with few collaborators, but a scientific project that will be continued eternally. Can we guarantee it? YES, we are a games & apps development studio, we have spent a long time testing different game engines, trying to find the one that would best suit our projects. Finally we learned that if we want to have a perfect engine, we must create it ourselves.

The Silent Race

When we started creating our web engine, WebGL was supported only by Firefox and Google Chrome. Now its becoming more and more popular. In Q1 of 2014 Unity stated its commitment to Mozilla's vision of high performance, plugin­free web experience. We didn't have to wait long for Cupertino's giant response. In March of 2014 Apple silently joined the race and started supporting WebGL technology in their Safari browser, with iOS 8 on the horizon, WebGL seems poised to become the technology of the future.

Artur Czemiel

About Artur Czemiel

Artur is a mobile devloper, owner of Aexol - apps studio based in Poland. His background is 3D graphics & FX production. When he’s not being online, you will find him listening to Bob Marley or experimenting with oriental kitchen.

Recent Features

  • By
    I’m an Impostor

    This is the hardest thing I've ever had to write, much less admit to myself.  I've written resignation letters from jobs I've loved, I've ended relationships, I've failed at a host of tasks, and let myself down in my life.  All of those feelings were very...

  • By
    5 More HTML5 APIs You Didn’t Know Existed

    The HTML5 revolution has provided us some awesome JavaScript and HTML APIs.  Some are APIs we knew we've needed for years, others are cutting edge mobile and desktop helpers.  Regardless of API strength or purpose, anything to help us better do our job is a...

Incredible Demos

  • By
    Full Width Textareas

    Working with textarea widths can be painful if you want the textarea to span 100% width.  Why painful?  Because if the textarea's containing element has padding, your "width:100%" textarea will likely stretch outside of the parent container -- a frustrating prospect to say the least.  Luckily...

  • By
    Sara Soueidan’s Favorite CodePen Demos

    A few months ago, Chris Coyier shared his favorite CodePen demos right here on David's blog. A while back David asked me to share some of my favorite pens too, so here are some of the demos that have blown my mind in the past...

Discussion

  1. WebGL is certainly a fun thing to play around with. I’ve been toying with ThreeJS and you can do some really cool stuff very easily with it. Rendering basic shapes is very easy, and adding basic animations isn’t too hard to do.

    http://lukepettway.name/demo/threejs/extrude.html

  2. WebGL has the potential to completely transform the gaming world. Moreover, advent of a helpful framework will certainly act as a catalyst. But this is still in its infancy but in coming times, it is certainly going to become huge and as I said earlier will change the gaming scenario.

  3. Can’t understand much of the WebGL or AxolGL, but what i got is much exciting as if it comes popular then we will not require a zillion dollars machine, we can play awesome games with ordinary computer. Is that what the both GLs are for? or something else? However, nice piece of information.

  4. Could you expand on the texture section? Is that instead of leaving all textures bound forever? I though bind-draw-unbind was pretty much the normal technique..

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!