15
\$\begingroup\$
  • What does it mean a 'mask' in 2D (and possibly 3D) Game development?
  • What would an experience Game Dev understands if I say ´make this Rect a mask´?

I know it could be a very broad term and it may depend on the context, if is so then just a bullet list of possible meaning would do.


My understanding is that is something that 'masks' with the purpose to cover some other entity on the game world, however what are the most use cases and why would you use it?

I research a bit online, but because of the naming 'mask' the search result gets easily polluted with unreleated topic (especial after covid).

\$\endgroup\$
2
  • 1
    \$\begingroup\$ "Masking tape"/"Painting tape" is the real-world term that has the same application/meaning. \$\endgroup\$ Nov 4, 2022 at 17:36
  • 1
    \$\begingroup\$ do not confuse image masking with GPU stencil buffers; very similar function but completely different technical implementation and capabilities it provides \$\endgroup\$
    – ivan866
    Nov 6, 2022 at 1:11

4 Answers 4

34
\$\begingroup\$

Conceptually, masking involves selectively ignoring something, usually to isolate something else.

The two main uses I've familiar with are:

  1. Masking data such as bit fields or flags for bitwise operations.
  2. Masking images, often for compositing or other effects.

Data Masking

For an example of the first, let's say you have a bit field such as the 6502 status register:

Bit 7 Bit 6 Bit 5 Bit 4 Bit 3 Bit 2 Bit 1 Bit 0
Negative flag oVerflow flag - Break flag Decimal flag Interrupt-disable flag Zero flag Carry flag

ANDing the register with 01000000 would mask out everything except the overflow flag. So something like if(R & 01000000) would allow you to check for the overflow condition. Specifically, the logical operation preserves (masks) only the 6th bit for evaluation.


Image Masking

This question examines ways to use an alpha mask to ignore unwanted portions of a texture in order to get a more complex result:

Mask Addition of a red hexagon sprite Result of masking the sprite
mask mask & sprite result

In the above example, the mask preserves the portion of the sprite in the round center area. You might use this form of masking to implement a circular field of view in a top down game as it allows the player to see things in the field of view, but not outside it.

It's probably worth mentioning, sometimes it can be a bit ambiguous regarding whether mask is being used to refer to what is kept versus what is discarded.

\$\endgroup\$
5
  • 1
    \$\begingroup\$ I'd say "ignoring or protecting", especially if operation you want to perform is destructive like "wipe out portion of the image". \$\endgroup\$ Nov 4, 2022 at 17:40
  • \$\begingroup\$ @AlexeiLevenkov Those are not terms I've heard used or would recognise for this. Keep in mind that, masking is generally considered a binary operation: you mask X with Y to get Z (z = x ∧ y); there's no need to destroy an argument if you'll need it again later. In the graphics example above, the masking would generally be done as part of a copy operation from the source (such as an object or sprite table) to the destination (such as a frame buffer). \$\endgroup\$
    – cjs
    Nov 5, 2022 at 3:02
  • \$\begingroup\$ while being technically correct and diverse, this answer is likely to be useless for a novice asking such a question \$\endgroup\$
    – ivan866
    Nov 6, 2022 at 1:12
  • \$\begingroup\$ @ivan866 Please elaborate - how could it be made more useful to a novice? \$\endgroup\$
    – Pikalek
    Nov 6, 2022 at 14:54
  • \$\begingroup\$ @Pikalek an image mask is a separate image which provides SHAPE which you want the first image to be seen through; mask can differ in size and position compared to first image; mask can also have transparency, which yields a semi-transparent effect for the shape; mask position can be animated, yielding a searchlight effect \$\endgroup\$
    – ivan866
    Nov 6, 2022 at 15:09
4
\$\begingroup\$

Maybe I'm too old, but back in the day a mask meant an area of blank pixels around the outer shape of a sprite. This was to isolate the sprite from the background and prevent the background colours mixing with or showing through the sprite colours. I'm sure it's still used in 2D games to give sprites separation from the background. In fact, you can see a mask at work when you look at your mouse cursor - the white area around the black arrow icon is a mask.

The mask data was often stored alongside the sprite data, and applied first to the background to mask out a "hole" for the sprite, before the sprite was drawn on top.

\$\endgroup\$
2
  • \$\begingroup\$ to understand the 'present' we need to first learn about the 'past'. So yea thanks for sharing this info and actually it make sense. Interesting the mouse cursor has a mask too! \$\endgroup\$ Nov 3, 2022 at 18:16
  • 1
    \$\begingroup\$ On Microsoft Windows, this is still how many cursors are stored. There's an AND and an XOR mask; putting a hole in the XOR mask leads to a mouse cursor that inverts whatever's under it. \$\endgroup\$
    – wizzwizz4
    Nov 4, 2022 at 19:07
2
\$\begingroup\$

This is how Wikipedia describes it.

This technique is used for painting pointing device cursors, in typical 2-D videogames for characters, bullets and so on (the sprites), for GUI icons, and for video titling and other image mixing applications.

Although, personally, I mostly only use masks for UI. Very often you'll have one UI element sliding under another and a mask is an easy way to prevent something from being visible when it shouldn't.

\$\endgroup\$
2
\$\begingroup\$

There are some decent answers so far, but I think this part deserves a bit more attention.

What would an experience Game Dev understands if I say ´make this Rect a mask´?

To a game dev, there would be no doubt that if you are using a Rect (short for rectangle in a lot of game engines), that you would clearly be asking about an image mask. You would generally not be creating a data mask from a polygon.

However, if the developer is unfamiliar with the project, there may be some ambiguity about if you want a vector or raster mask. 2d graphics can generally be saved in 2 ways, a vector image which is a composition defined by lines drawn from points procedurally filled with colors, or a raster image which is an image made from a grid of pixels. In most cases it does not matter that much which kind of map you use, but it can. If you are trying to mask an image that has to be highly scalable, you will generally want to use a vector mask to keep from loosing detail to poor resolutions. If you need to make an especially complex mask, like for doing photographic selective tinting, then a raster mask is often the better choice.

enter image description here

enter image description here

\$\endgroup\$
8
  • \$\begingroup\$ yes thank you to point this out, was actually part of the question. However keep in mind that what i wrote: "make this Rect a mask" was completelly random (and Maybe wrong). Maybe it is not clear but what I meant was just a possible example and completelly made up of a conversation between 2 devs that talks about a "mask". Having said that, your answer is interesting but it gives me somehow more questions than answer, I guess what you write is correct, but because Im new in Game Dev I dont have much experience. So may you please explain better what is a ´raster´and a ´selective tinting´? \$\endgroup\$ Nov 5, 2022 at 10:53
  • 1
    \$\begingroup\$ @FedericoBaù It's hard to explain in words more than I have already; So, I've added some graphics to try to illustrate it. Raster images (think photographs) get blurry as you make it bigger because they store everything as a grid of colors. Vector images don't get blurry because they are drawn from lines that can just be recomputed when you zoom in, but because they don't store a separate color for every little point of the image, they don't do complexity as well. Selective Tint masks are often used in game design for things like coloring units with faction colors. So in 2d design, you'd \$\endgroup\$
    – Nosajimiki
    Nov 6, 2022 at 18:46
  • \$\begingroup\$ have an image of your unit (like the X-wing shown above), and you'd have a masking image where each pixel says how much of the faction color to tint onto each pixel below it. Usually white =100%, black = 0% and shades of grey are everything in between. So instead of 20 different unit spites for all of the different colors it could be, you just make 1 sprite + 1 mask and procedurally add the color you want to tint with, and the Mask makes sure it's only the parts you mean to color that get the tint. \$\endgroup\$
    – Nosajimiki
    Nov 6, 2022 at 18:46
  • \$\begingroup\$ nice one thanks! \$\endgroup\$ Nov 7, 2022 at 11:52
  • \$\begingroup\$ This is an additional (more GPU-like) approach of a mask while the first one was the traditional usage of a mask. Obviously the xwing makes an upvote easy :) \$\endgroup\$ Nov 7, 2022 at 16:58

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .