3D plane effect

[Presurn]

Hello,

I'm trying to give a little 3D effect to a 2D plane when the cursor hover it using a translation in a vertex shader, but I'm facing a problem.

https://i.imgur.com/bBMDoSY.mp4

As might be expected, (c.f. Fig. B of the video) the 3D effect works only if the sprite is centered to the screen. And even if I guess I need to update vertex coordinates in the shader (as if the sprite was already centered), then calculate the projection, and finally restore real coordinates, I didn't achieve it.

I searched a lot and tried a lot of things (inside and outside the shader) to modify the coordinates but nothing conclusive or even promising.

Do someone have an idea how should i go about it?

uniform mat4 transformMat;

void main() {
    gl_Position = gl_ProjectionMatrix * gl_Vertex * transformMat;
    gl_TexCoord[0] = gl_TextureMatrix[0] * gl_MultiTexCoord0;
    gl_FrontColor = gl_Color;
}
 

...

sf::Vector2f v2fMousePos {
    static_cast<float>(sf::Mouse::getPosition(window).x) -
    (sprite_card.getGlobalBounds().left + (sprite_card.getGlobalBounds().width / 2.f)),
    static_cast<float>(sf::Mouse::getPosition(window).y) -
    (sprite_card.getGlobalBounds().top + (sprite_card.getGlobalBounds().height / 2.f))
};
sf::Vector2f v2fDiffPos {
    v2fMousePos.x / (sprite_card.getGlobalBounds().width / 2.f),
    v2fMousePos.y / (sprite_card.getGlobalBounds().height / 2.f)
};

sf::Transform transformMat;
transformMat.translate(v2fDiffPos.x * .5f, -v2fDiffPos.y * .5f);
sf::Glsl::Mat4 modelMat(transformMat.getMatrix());
shd_cardPersp.setUniform("transformMat", modelMat);

window.draw(sprite_card, &shader_card);
window.display();
 

[eXpl0it3r]

I don't have a specific solution to your code, but maybe you can find some inspiration from SelbaWard's Sprite 3D which essentially does the same thing.

[Presurn]

It seems the idea of adding subdivisions works better than I thought.
SelbaWard is perfect, thank you!