Search Unity

Severe banding with WebGL on Chrome

Discussion in 'Web' started by bkevelham, Mar 13, 2015.

  1. bkevelham

    bkevelham

    Joined:
    Dec 3, 2012
    Posts:
    6
    When trying to view what WebGL can mean for the visualization of some of our assets, I found the rendering to be rather terrible. But hey it's new and rough around the edges. So be it.

    Narrowing the situation down by removing any GI from the equation and only using a Standard shader with only albedo and a couple of point/directional lights, I see that there is severe banding going on as illustrated in the screenshot.



    Narrowing it down further to run without any ambient and a single spotlight still sees this effect remain. That is not something I would have expected.

    So, is this to be expected from the current WebGL build? Is there something obvious I'm missing here?

    I'm running in Chrome 41.0.2272.89
    There are no errors in the Chrome console at all.

    I have by now reported this as issue 681026 and you can vote on it here: http://issuetracker.unity3d.com/iss...a-low-smoothness-value-shows-banding-in-webgl
     
    Last edited: Mar 18, 2015
    bkevelham, Mar 13, 2015
    #1

  2. jonas-echterhoff

    jonas-echterhoff

    Unity Technologies

    Joined:
    Aug 18, 2005
    Posts:
    1,666
    The issue here (as I understand it) is that we use different implementations of the standard shader BRDF function in different graphics APIs. WebGL, having an identical feature set to OpenGLES 2.0 uses the same shaders, which use a simplified version of the shader. See page 14 of Aras' GDC talk here: http://aras-p.info/texts/files/201503-GDC_Unity5_Graphics_notes.pdf . This is the same result as you get on other GLES 2.0 devices and not a WebGL-specific issue.

    Now, the problem with this is, that some of those choices have been made with the idea of tying performance decisions to graphics APIs. This had been a reasonable choice in the past when GLES was strictly a mobile API. It is no longer a good fit today, when WebGL brings GLES to much faster hardware.

    I hope that we will eventually change our shader compilation toolchain so that you can make such decisions independently of the graphics API used, but I don't have an ETA for this. Another thing which will happen is that WebGL 2.0 will bring WebGL graphics to GLES 3.0, which generally looks much better. We showed a preview of WebGL 2.0 in Unity with Mozilla at GDC (https://blog.mozilla.org/futurereleases/2015/03/03/an-early-look-at-webgl-2/), and I expect browsers to start shipping implementations this summer (and WebGL 2.0 showing up in Unity builds some time after that).
     
    jonas-echterhoff, Mar 24, 2015
    #2

  3. bkevelham

    bkevelham

    Joined:
    Dec 3, 2012
    Posts:
    6
    Thanks for the heads up. I'll have a look through the info. So bottom line seems to be "wait for WebGL 2.0" given the circumstances?

    Or we could of course ask our client to sell shiny metal jackets online. Call it Full Metal Jackets ... I think we may have a business here ... :D
     
    bkevelham, Mar 24, 2015
    #3

  4. jonas-echterhoff

    jonas-echterhoff

    Unity Technologies

    Joined:
    Aug 18, 2005
    Posts:
    1,666
    Actually, after discussing this more with the graphics team, it turns out that we can fix this with the current setup.

    The simple version of the shader used in GLES 2.0/WebGL 1.0 uses a color lookup texture for roughness. But we can use higher precision for that texture (if the GL_OES_texture_half_float extension is supported, which is the case on all the current desktop browsers), so it still looks nice.

    So, expect to see a fix for this show up in the future (probably Unity 5.1).
     
    jonas-echterhoff, Mar 24, 2015
    #4
    bkevelham and jcarpay like this.

  5. bkevelham

    bkevelham

    Joined:
    Dec 3, 2012
    Posts:
    6
    Cool, thanks for the update.
     
    bkevelham, Mar 24, 2015
    #5

  6. ahmadian

    ahmadian

    Joined:
    Nov 24, 2015
    Posts:
    44
    which shaders should we use our project to see the same result in webgl?
     
    ahmadian, Jun 15, 2016
    #6