Skip / Always skip

Digital savoir-faire


blackstage Ultranoir Blackstage

Monday, June 18, 2018

behind the noir

Sign up for our newsletter for
lastest news & releases !

WebGL and E-commerce
Visuals for tomorrow?

Today, e-commerce generates some €31 billion in revenues.
However, many brands are still having difficulty selling online.
Even if online sales have become a regular activity for many custumers, there are still perceived risks during transactions.

What does WebGL technology offer ?

According to Wikipedia’s current definition, e-commerce is an exchange of goods and services between two entities via electronic networks. In France, e-commerce was first introduced in the 80s, with Minitel transactions. Internet development during the 1990s had a huge impact on custumers' buying habits. By the end of 2000, many European and American businesses companies were offering their services via the World Wide Web. Since then, people have begun to associate the word "ecommerce" with the ability of purchase various goods through the Internet using secure protocols and electronic payment services.

In France today, e-commerce generates some €31 billion euros. Mobile commerce is expanding rapidly and is expected to involve as many as 14 million people in France by 2015. However, we still have to overcome some obstacles.
How have new technologies changed e-commerce? Augmented reality, holography, social shopping, storytelling ... there are many suggestions! We believe that one of these technologies will change everything: WebGL. Let's take a look at some of the possibilities offered by this technology.


Let me begin by giving you some statistics (in France, FEVAD):

- In 2010, €31 billion were spent in online shopping
- The number of e-commerce websites is increasing (+ 28% between 2009 and 2010)
- 97% of online buyers are satisfied with their purchases (over the 6 last months)

It is also important to mention that:

- The most profitable sectors in term of income and clients are those selling intangible goods: travel, tourism and services.
- The average basket is relatively low (€91)

Perceived risks

Low average basket, intangible goods ... and yet all these are seen as the most risky sites for buying online. These risks include:

Financial risk
related to a waste of money: for a high product (especially in luxury goods), it is difficult to buy without seeing the product first, without touching it.

Technical risk
related to the possibility of a malfunctionning product

Psychological risk
related to disappointment after receiving the purchase.

Studying the consumer behavior, we can clearly see that custumers like to be sure before buying: by touching, looking at and feeling the product... Custumers focus their attentions on seams, textures, graphic details, colours and smells.

Why is product image so important in e-commerce ?

They are many issues relating to online sales. Who hasn't said to themselves, when looking at screen images of products:
- "This coat seems to be pretty but I can’t see the button, or material’s textures."
- "What is exactly the colour? It looks brown, but it could be a dark red..."
- "I think there is a pattern on the chair's foot, but I can't see what it is"

For customer, these are key issues when buying something valuable which they will keep for months or years. Quality and details provided by visual images are the key to online sells. For Internet users, it is important to ensure that the picture shows how the product looks in reality.

To illustrate this point, a study on Darty's e-commerce store has shown that the conversion rate increased by 25% when the customer could see a zoom of the images.


As explained in the Nouvelle Vague project, WebGL is a specification of 3D display for web browsers created by the Khronos Group and Mozilla. Using WebGL, you can display 3D in real time, without a plug-in for a browser (via graphics card drivers). Today, both Firefox and Chrome support WebGL and all modern browsers will in 2012 (it is currently being tested by Opera and Safari).

WebGL offers exceptional images and is already in use. It will play a key role in e-commerce of the future. There are two possible ways for using this system:

WebGL and online sales

For e-commerce applications, this technology can be used to show products with 3D images that can spin or rotate 360 degrees or zoomed.
Users can see the texture, the materials used, the exact colours of the product (and even specify their preferences)... with full details as if they have it in their hands !

This WebGL application makes sense for products that are very valuable (especially for luxury goods) or highly crafted (artisanal work, hand-made).

Imagine, for example, looking at a luxurious bag from every angles: above, below, the sides, and also all the inside features, including details of pockets, materials, and colours.

To see how this works, here are some WebGL products that will be seen on tomorrow's e-commerce websites:

- An handmade French chair ( <= click to lauch demo)
In China, hotel owners like that kind of product, but would they be prepared to pay a large sum of money simply because they saw a picture? Would they be able to come to France just to see a piece of furniture? Probably not. WebGL is a good alternative.

Example : video of a chair in WebGL

Other examples
Reproduction of the human skin
Edit and customize your car
Watch and driving a Formula 1

Note: Google Maps also uses WebGL for more fluidity

Digital experiences, games and product placement

Another use of WebGL is the "experience", the "game".

When they can see entertaining and beautiful design or experience an interesting visit, users will spend longer time on the site and take the time to explore the game from every angle.

It will be fun to see products, messages, and even brand images incorporated into a storefront, hotel room, city, ect... the possibilities are endless!
And then users will move on to shop in another section of the site.

WebGL is expanding into the music business. Users spend time on the site discovering the experience; they have time to listen to a song from beginning to end, and then an e-commerce tab appears, allowing them to buy the track.

Lights - Ellie Goulding - Polydor
In England, Polydor launched an experiment to promoteone of Ellie Goulding's songs some time ago.

Other examples - 3 Dreams of Black
WebGL music visualizer
Endless Forest
Nouvelle Vague


Currently supported by Chrome, Firefox and Opera, WebGL technology will be available very soon on all modern browsers (except Internet Explorer). It gives us a new vision of e-commerce and there are many possibilities that can be exploited. Everything suggests that it will be in common used in the very near future, both on mobile computers and tablets ... but the question is: who will be the first to use it!?

A watch for

Top of page