Use masking instead of image texture fills

Have you come up with a good Moho trick? Need help solving an animation problem? Come on in.

Moderators: Víctor Paredes, Belgarath, slowtiger

Post Reply
User avatar
Rasheed
Posts: 2008
Joined: Tue May 17, 2005 8:30 am
Location: The Netherlands

Use masking instead of image texture fills

Post by Rasheed »

I compared how you could animate pixel-based imagery with two types of features in Anime Studio:
  • masking - trace each PNG image in a vector layer, put the vector layer behind the PNG image layer, and add it to the mask, but keep invisible, while the bone layer has all its sublayers hidden by masking
  • image texture fills - trace each PNG image in a vector layer, remove the PNG image layer, and set the fill of the vector shape to image texture (stretch)
Here's a (crummy) sample movie:

http://www.youtube.com/watch?v=tQL9StdWRWk

As you can see, when the bone warps the head towards the bird's back, a little bit of the white fill color bleeds in, at the back of the head. At least, in the image texture filled version. In the masked version, it doesn't show up.

Mind you, though, they you will need to set an outline for each shape in the masked version, because the outlines in the original bitmap image doesn't line up properly.

Here is the project file: bird.zip
User avatar
heyvern
Posts: 7042
Joined: Fri Sep 02, 2005 4:49 am

Post by heyvern »

If you put in a fill color that "matches" the general color of the image texture this isn't as much of a problem.

The bleeding of the back ground color inside a texture fill can also be "minimized" by adding a point or two at those spots. This effect is caused by very few points far apart being moved. Also using a full image as the texture can eliminate the problem in long thin areas (it still happens at the "edges" of the images though).

In your bird example if you had a full square image texture the image area around the head wouldn't show the background at all because there would be image there. If you use transparency on the png image around the shape the texture is on you see the background show through.

The stretch setting in the image texture effect is based on the bounding box of all the points of the shape. If you push one point way out it expands the image to reach that size possibly causing the background to show in other areas.

By using a squared or rectangular image texture those areas still have image:

Shape on the left uses a red circle with transparent background for the image texture. Shape on the right uses a square red image with no transparency. The original shape on frame 0 is a circle with a bunch of extra points.
Image

-vern
User avatar
slowtiger
Posts: 6243
Joined: Thu Feb 16, 2006 6:53 pm
Location: Berlin, Germany
Contact:

Post by slowtiger »

I did a test the other day and found that my image texture didn't fill the entire shape, only 2/3 of it. Enlarging the texture file's dimensions didn't help.

Any idea?
User avatar
heyvern
Posts: 7042
Joined: Fri Sep 02, 2005 4:49 am

Post by heyvern »

The key is the bounding box of the mesh. If you do a screen grab or render of the shape on frame 0 the image texture should be the same aspect ratio of the shape. Crop the image so that it encloses the outermost points of the shape no matter how "irregular" the shape. Paint the texture within that area rather than keeping it tight to the actual outlines of the shape.

Set the image texture to "stretch".

What happens is that the original bounding box area of the image texture will always scale to match the bounding box of the shape no matter how much it is distorted.

There are still problems with this when the image overlaps itself using bones and sometimes there will be areas of the background that peek through when the "edges" of the image line up with the "edges" of the shape. In those areas there isn't any "bleed" for the image and if the distortion of the mesh doesn't match the distortion of the image you get gaps. That is when you could fill the shape with a color that "blends" with the image.

-vern
User avatar
slowtiger
Posts: 6243
Joined: Thu Feb 16, 2006 6:53 pm
Location: Berlin, Germany
Contact:

Post by slowtiger »

Here's some screenshot to illustrate.

Image

As you see, the texture file roughly meets the bounding rectangle of the shape. I even checked the actual dimensions: the project settings are PAL 16:9, means 1024 x 576 px, and the texture file is 595 x 869 px, clearly large enough.

I get the same effect if I set the texture to "tile" instead of "stretch".
User avatar
heyvern
Posts: 7042
Joined: Fri Sep 02, 2005 4:49 am

Post by heyvern »

Have you translated the layer?

Translating the layer does not translate the texture fill. the only way to move the points of a vector layer shape "globally" is to use bones or moving the points.

-vern
User avatar
Rasheed
Posts: 2008
Joined: Tue May 17, 2005 8:30 am
Location: The Netherlands

Post by Rasheed »

heyvern wrote:Translating the layer does not translate the texture fill. the only way to move the points of a vector layer shape "globally" is to use bones or moving the points.
Or to put the layer in a group type layer and translate that group type layer.
User avatar
slowtiger
Posts: 6243
Joined: Thu Feb 16, 2006 6:53 pm
Location: Berlin, Germany
Contact:

Post by slowtiger »

No, haven't translated anything. It's still all in frame #0.
User avatar
synthsin75
Posts: 10266
Joined: Mon Jan 14, 2008 11:20 pm
Location: Oklahoma
Contact:

Post by synthsin75 »

That's interesting. Layer scaling and translation has a multiplied effect on texture fills.

I would still have to say that masking is more flexible and, perhaps more importantly, predictable.

I originally thought this new feature would work well for hair, but to acheive various directionality, I'd have to rotate the shapes before I sculpt them to fit. It's still easier to rotate several different masked textures. And I have yet to see any impressive bone distortion of the new texture fills. I guess this makes that angle constraint limit that much more important.
User avatar
Blade_Rain
Posts: 16777215
Joined: Thu Mar 27, 2008 10:20 pm
Location: Delaware

Post by Blade_Rain »

slowtiger wrote:Here's some screenshot to illustrate.

Image

As you see, the texture file roughly meets the bounding rectangle of the shape. I even checked the actual dimensions: the project settings are PAL 16:9, means 1024 x 576 px, and the texture file is 595 x 869 px, clearly large enough.

I get the same effect if I set the texture to "tile" instead of "stretch".
I wonder, slowtiger, why is your bone setup as such in the picture? I'd always assumed it easier to just use four verticle bones... Could you share what you know, please?
User avatar
slowtiger
Posts: 6243
Joined: Thu Feb 16, 2006 6:53 pm
Location: Berlin, Germany
Contact:

Post by slowtiger »

Please ignore the bones. This file was just a test of the texture fill, that's why I added that many points and bones. There's no sense behind that.
User avatar
heyvern
Posts: 7042
Joined: Fri Sep 02, 2005 4:49 am

Post by heyvern »

Wild goose chase:

Are you absolutely sure there is no whitespace around the image?

Is it possible you have a "stray point" that is part of shape off somewhere that could be changing the max size of the shape?

It doesn't look like the image isn't filling the shape or getting scaled. It looks like it is being offset somehow. The only time I've seen that is when I've translated the layer (even on frame 0) or there is white space on the image.

What program are you using to create the image? Some programs "add" image area around the image (Adobe Illustrator sometimes exports with the DOCUMENT bounds creating white areas.)

If you could post both the AS and image file I bet I could figure it out.

-vern
User avatar
heyvern
Posts: 7042
Joined: Fri Sep 02, 2005 4:49 am

Post by heyvern »

I did my own test and the only way I could offset the image like that was to move the layer:

Image

You are absolutely certain there is no layer translation?

-vern
User avatar
slowtiger
Posts: 6243
Joined: Thu Feb 16, 2006 6:53 pm
Location: Berlin, Germany
Contact:

Post by slowtiger »

I am, because the image is not imported as an image layer, but as a texture only in that texture dialogue.

And the texture doesn't have white around, I made it in Photoshop.

- Maybe we leave this problem as it is, I don't have time to do further tests right now and am away for the next week . Back after 25.4.
User avatar
heyvern
Posts: 7042
Joined: Fri Sep 02, 2005 4:49 am

Post by heyvern »

The vector layer might still have some translation. Check just to be sure because I can't find anything else to cause this.

-vern
Post Reply