- Đã chỉnh sửa
Best way to animate eyes moving?
For eyes that move all the way to the left or right- but seem "masked" inside the eye area- what is the best way to do it?
The best way I can think of is having the head texture have holes cut out for where the eyes go- and have the eyes(pupils/ irises) placed behind the head texture, so they can move behind it and look "masked".
Is that the best method for a variety of different eye animations (looking around, blinking by changing out the graphic, ect)?
Depending on your style it could be, another method could also be to have different sets of eyes or just having the pupils on top and deforming those. It depends if you value more being able to turn the face of the character or the expressivity.
I don't think many put holes in the head of the characters, but I've seen some nice examples of pupils with transform constraints such as here: Allow influence percentage of influence to be over 100?
Awesome, thanks! Yeah, deforming the pupils could achieve a nice effect (I had been looking at this one for using the eyes in a cut out head: Spine - Skeleton Utility - Eye Constraint - YouTube)
Do you think it's possible to have the pupils/iris follow the cursor in a runtime(Unity) this way?
I guess I could have positions for top,left,bottom, right, and mix them to make it follow the cursor?
I need to find more tutorials on doing stuff with the runtimes (a lot of things don't work "right"- like combining multiple animations, or transitioning animations- have some odd behaviors that have to be fixed by putting keys everywhere, or nowhere).
Yes, I think you can, but I've never tried it myself yet so I'm afraid I can't suggest the best practice. (also, I'm just an animator, coding is obscure magic to me)
hey Erika!
is it possible to clip the object (iris) like we do on affinity designer? this is an example of what I'd like to do on using spine.
would be awesome to have this kind of clip by the image shape.
I'm struggling to use the clipping standard function on spine, since you need to place the polygon points...
I see there are some limitations about the image editing on spine.
but I was thinking in a kind of system that works exactly like the "MESH trace for the images" but for this time for tracing clipping mask,
which allows the objects inside of this mask displays the layers inside, like affinity designer does.
I'm not coder but re-using the same mesh system for mask, I hope that make sense.
let me try to upload an example here
cheers!
Jhonatan
Hello Jhonatan!
I am not sure about the way you clip the iris in affinity designer, but I'll assume you have the sclera placed above the face and clip the iris to stay within it.
Now, that is a way to go in illustrations, but the problem with clipping can be a very expensive operation, especially if you use dense mesh attachments. Clipping has to be implemented CPU-side in all runtimes to be compatible, as most engines do not support direct stencil buffer access or masking.
Clipping - Spine User Guide
Therefore I would suggest considering different routes such as:
Cutting holes in the face to put the irises behind it.
For example, I used this to rig the painting of an elderly lady, filed available for download here: Spine: Twitch: video 24kNQivHVVoCovering the iris with separate eyelids images so that they cover enough space to not let the iris be visible outside of it
Here's a beautiful example by Arman: https://twitter.com/WArmanW/status/1171089653992235009Scaling the iris down when it reaches the side to avoid making it go out of the boundaries of the eye, or placing a limiter (or both!)
here's a blog post about creating a setup that keeps the iris always inside the eye: Blog: Distance limit setup for eyes
The mix-and-match example project does something similar by lowering the influence on the iris so that it stays more in the middle of the eye: Hình ảnh bị xóa do không hỗ trợ HTTPS. | Vẫn hiển thị
Spine: Tips: 2 eyes
Mix and Match example
I know this limitation requires a shift in the way one thinks of buiding their character, but considering the result is a great optimization, and you can combine the above suggestions, I'd say they are very worth exploring!
Hi Erika, Nate and the Spine team,
Well I'm 2d game artist, and I really love spine.
the point that I want to bring here with Spine pro is about the clipping sprites by their alphas channel,
I would say.. the same functionality used to auto trace the Sprite Mesh.
We use a very useful clipping operation, that Photoshop does with Clipping objects by displaying what is inside of that image
And I'm really wondering for a good time if this can be possible to add as a feature on Spine.
this would be a game-changing because we could display sprites that are inside of another sprite "Alpha"
we all always struggle to create a way to build eyes with pupil and all those slots, using multiple characters/mesh/skin
Even with the amazing tutorials provided by Erika, we still have many limitations and difficulties, like create the eyes socket erased on the head, or many other types of ways to build,
and the solution I can tell is the clipping.
and I want to show these examples it would help a lot in many situations
I'd like to know @Nate if this is something that Spine can handle.
The thing is: Display an image that is inside of another Sprite by Alpha (not displaying what is outside of the image).
Example:
- Eyesball.png
- Drag the Pupil.png inside of the Eyesball.png
- One operation that can make the Eyesball.png with "Mask alpha" making the Pupil displaying inside of it.
- and now by moving the Pupil, it will display inside of that eyeball, you can make in all directions, no eyes socket behind, no head erased!
like shown on the GIF that I did on Affinity Designer
So I hope these examples can be helpful, I see that spine doesn't work with images directly as a software image editor.
But if the "Mesh sprite system" already exists and can display what is inside of that vertices, I think this similar system could be used to display the Sprite that is inside of the other one by the vertices generate as clipping.
That's all! thanks guys!
jhonatanssilva đã viếtThe thing is: Display an image that is inside of another Sprite by Alpha (not displaying what is outside of the image).
The clipping we do currently is done by clipping the geometry using a polygon. This results in a hard edge, as you found. What you describe is called an "alpha mask", where the alpha from a texture is used to clip rendering of other textures. Doing this requires special shaders and is not possible in all game toolkits. We would like to implement the feature for the game toolkits that can support it, but unfortunately it will be some time as we have other things planned for the short term.
Until then there are a number of workarounds. The simplest is to poke a hole in the face and put images behind it, so the face effectively masks the eye images. Note that doing that will always be more efficient than any kind of clipping. That can be combined with a clipping attachment (with as few vertices as possible, for performance) in the case that the images underneath are larger than the top image.
Another workaround if you really need it is to implement clipping using an alpha mask in the game toolkit you are using. You can do this even though it is not yet supported in the Spine editor.