I'm still pretty new at Spine, but I've been thinking about the idea of trying my hand at animating a single photo or sprite and attempting to "bring it to life". Finally got around last night to giving it a go. Thought I'd chronicle my first attempt and see what feedback or suggestions I get for future attempts...
To get started, I ran the selfie through a Prisma filter to give it a more painterly and gamey feel. I trimmed out the background, and cut out the eyes from the image so that I could layer the eyes and pupils for independent movement behind the eye-lid. I had to repaint the eyes after separating the pupil, but it only took a few minutes to get it all edited and into Spine.
Once in spine, I setup the image as a mesh and proceeded to add almost 500 vertices to it. I haven't done much in the form of mesh deformation so I'm sure it could be vastly improved:
Image as mesh. Eyes and pupils layered below face.
After that, was just a matter of using mesh deformation to adjust the image as needed to create a pretty basic breathing animation loop. Some of the challenges I hit as I went were:
1. Glasses. They have glare. Not ideal for meshes.
2. A picture with wider eyes is better.
3. A picture where you mouth was agape would allow for the mouth opening & closing.
Here is a close-up of my flaring nostrils and eye movement after putting together a pretty basic breathing loop:
http://i.imgur.com/GStWJDj.gifv
It definitely needs work as neither my mesh or the image were very ideal, but overall- I was pleasantly surprised with how it turned out for a first attempt. Definitely gives me confidence that with a good image and mesh, you could convert a single image into a pretty decent animation. Any feedback, or suggestions (on mesh, process etc) I'd love to hear.
Developer
