Waving Pixel Art Siamese Cat
I tried to put a pixel-art texture on a 3D model.
The image of the cat is based on our cat at home.
GSAP is really easy to use to animate almost anything on the web.
I used GSAP timeline to animate the cat, looks like it is waving. Though, I still need to practice my animation skills, and I want it to be better.
I also animated the cat to rotate 360 degrees so we could also see the rear-side of the cat. Although, there is nothing to see there.
I used primitive geometries provided by ThreeJS to create the model of this cat. Creating the head and the body was not a problem, but the shoe. I used combination of box, sphere, plane, and circle to create this shoe.
The only things that has a texture on the model is the head, and the body. Others are just a simple colored mesh.
The color palette I used in this model is Arne32.
How the model looks is inspired by the popular Nintendo Switch game: Animal Crossing.
ThreeJS: Next thing to study
Next to study: SkinnedMesh
Based on the documentation, SkinnedMesh can be used to twist and bend a mesh to simulate the skeleton, and can be used to animate an object.
GSAP For animation
ThreeJS For 3D rendering and modelling
Aseprite For pixel art texture
Arne32 Color palette