Home/ Questions/Q 7975819
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T08:44:59+00:00

I would like to create an origami-like paper folding animation using WebGL or Canvas

  • 0

I would like to create an origami-like paper folding animation using WebGL or Canvas (no Flash!).
The effect I would like to reproduce is similar to the one in the video here.

A clear view of the final animation could be represented as follows for a cube:

I was trying to use three.js library, but I couldn’t find a way to animate a single face of a THREE.Mesh. I also tried simple CSS3 animation, but it would make very difficult to animate solid with more than 6 faces – as it is not possibile to create relationships between 2 or more faces.

Anyone can recommend other JS libraries? Or is there a way to achieve this with three.js?
Of course, it would be great if there could be a way to make it work just using canvas2d – but I think is pretty unlikely!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’m not sure which framework is best, but I think it’s best to use a framework that supports skinned meshes and animation playback. A quick search gave…

    http://www.oak3d.com/

    …but I have no idea if it’s the way to go. Three have (or at least had) support for skinning but to get the data out of a 3D-program wasn’t trivial and animation playback was/is limited.

    • 0