[SOLVED] Add skinning code to a custom shader

Hi, I have a custom shader with MatCap (material capture). The problem I’m having is that as soon as I set my material with the custom shader to the mesh instance the skinning stops working. Can anybody give me the directions to add skinning to my shader?

This is my vertex code (I don’t think frag will have to change)

attribute vec3 aPosition;
attribute vec3 aNormal;
attribute vec4 aTangent;
attribute vec2 aUv0;

uniform mat4 matrix_model;
uniform mat4 matrix_viewProjection;
uniform mat4 matrix_view;

varying vec2 vUv0;
varying vec3 vWorldPos;
varying mat3 vTbn;

void main(void)
    vUv0 = aUv0;

    vec3 worldPos = vec3(matrix_model * vec4(aPosition, 1.0));
    vec3 N = vec3(matrix_model * vec4(aNormal, 0.0));
    vec3 T = vec3(matrix_model * vec4(aTangent.xyz, 0.0));
    vec3 B = cross(N, T);

    vTbn = mat3(T, B, N);
    vWorldPos = worldPos;

    gl_Position = matrix_viewProjection * matrix_model * vec4(aPosition, 1.0);

and this is the code to create the shader:

Matcap.prototype._createMatcapShader = function()
    var gd = pc.app.graphicsDevice;

    // frag shader
    var fragmentShader = "precision " + gd.precision + " float;\n";
    fragmentShader = fragmentShader + this.matcapFrag;

    // vextex shader
    var vertexShader = this.matcapVert;

    // A shader definition used to create a new shader.
    var shaderDefinition = {
        attributes: {
            aPosition: pc.SEMANTIC_POSITION,
            aUv0: pc.SEMANTIC_TEXCOORD0,
            aNormal: pc.SEMANTIC_NORMAL,
            aTangent: pc.SEMANTIC_TANGENT,
            aBoneIndices: pc.SEMANTIC_BLENDINDICES,
            aBoneWeights: pc.SEMANTIC_BLENDWEIGHT
        vshader: vertexShader,
        fshader: fragmentShader

    // Create the shader from the definition
    var shader = new pc.Shader(gd, shaderDefinition);

    return shader;

I tried this code, but I couldn’t get it working, so I removed the skinning code

I understand that where I use matrix_model in my vert I’d have to replace with getSkinMatrix(), but what I don’t get is how.

One other reference is this:

I’d really appreciate any help, and sorry for the long post.

Can someone with shader experience take a look at this please?

Run the project with the default shader, so that skinning works, and capture it using Spector JS (install Chrome plugin). Then you can see the whole vertex shader, not just parts of it - and you can learn how it all fits together.

1 Like

But I assume that based on this: Bug cloning or setting materials for an entity that has skinning and was created with instantiateRenderEntity() · Issue #3393 · playcanvas/engine · GitHub you got it to work already.


Yes, I’ve fixed the problem, Thanks