unity pixel_2D Pixel Perfect：如何为复古的8位游戏设置Unity项目

unity pixel

Retro games with simple mechanics and pixelated graphics can evoke fond memories for veteran gamers, while also being approachable to younger audiences. Nowadays, many games are labeled as “retro”, but it takes effort and planning to create a title that truly has that nostalgic look and feel. That’s why we’ve invited the folks from Mega Cat Studios to help us talk about the topic. In this blog post, we’ll be covering everything you need to create authentic art for NES-style games, including important Unity settings, graphics structures, and color palettes.

具有简单机制和像素化图形的怀旧游戏可以唤起资深游戏玩家的美好回忆，同时也让年轻观众接触。 如今，许多游戏都被标记为“复古”，但是要花费大量精力并计划创建一个真正具有怀旧外观的游戏。 这就是为什么我们邀请Mega Cat Studios的人们来帮助我们谈论这个话题。 在此博客文章中，我们将介绍为NES风格的游戏创建真实艺术品所需的一切，包括重要的Unity设置，图形结构和调色板。

Get our sample project and follow along!

获取我们的示例项目并继续！

Mega Cat Studios, out of Pittsburgh, Pennsylvania, has turned the creation of highly accurate retro games into an art form. So much so, in fact, that several of their titles can also be acquired in cartridge form and played on retro consoles like the Sega Genesis.

位于宾夕法尼亚州匹兹堡的Mega Cat Studios已将高度精确的复古游戏的创作转变为一种艺术形式。 如此之多，事实上，它们的几个标题也可以盒装形式获得，并可以在Sega Genesis等复古游戏机上播放。

Unity工作流程可最大程度地提高复古性 (Unity workflows for maximum retro-ocity)

Recent additions to the Unity workflows have made it a well-suited environment for creating your retro games. The 2D Tilemap system has been made even better and now supports grid, hex, and isometric tilemaps! Additionally, you can use the new Pixel Perfect Camera component to achieve consistent pixel-based motion and visuals. You can even go so far as to use the Post Processing Stack to add all sorts of cool retro screen effects. Before any of this work can be done, however, your assets will need to be imported and set up correctly.

Unity工作流程的最新添加使其成为创建复古游戏的理想环境。 2D Tilemap系统已经做得更好，现在支持网格，十六进制和等轴测图！ 此外，您可以使用新的Pixel Perfect Camera组件来实现一致的基于像素的运动和视觉效果。 您甚至可以使用后期处理堆栈添加各种很酷的复古屏幕效果。 但是，在进行任何此项工作之前，都需要正确导入和设置您的资产。

准备精灵资产 (Preparing sprite assets)

Our assets first need a correct configuration to be crisp and clear. For each asset you’re using, select the asset in the Project view, and then change the following settings in the inspector:

我们的资产首先需要正确的配置才能清晰明了。 对于您正在使用的每个资产，在“项目”视图中选择资产，然后在检查器中更改以下设置：

• Filter mode changed to ‘Point’
  筛选模式更改为“点”
• Compression changed to ‘None
  压缩更改为“无”

Other filter modes result in a slightly blurred image, which ruins the crisp pixel-art style we’re looking for. If compression is used, the data of the image will be compressed which results in some loss of accuracy to the original. This is important to note, as it can cause some pixels to change color, possibly resulting in a change to the overall color palette itself. The fewer colors and the smaller your sprite, the greater the visual difference compression causes. Here’s a comparison between normal compression (default) and no compression.

其他滤镜模式会导致图像稍微模糊，从而破坏了我们正在寻找的清晰像素艺术风格。 如果使用压缩，则图像的数据将被压缩，这会导致原始图像准确性下降。 注意这一点很重要，因为它可能导致某些像素发生颜色变化，从而可能导致整个调色板本身发生变化。 颜色越少，子画面越小，导致压缩差异的视觉效果就越大。 这是普通压缩(默认)和无压缩之间的比较。

Another thing to be aware of is the Max Size setting for the image in the Inspector. If your sprite image has a size on any axis greater than the ‘Max Size’ property (2048 by default) it will be automatically resized to the max size. This will usually result in some loss of quality and cause the image to become blurry. Since some hardware will not properly support textures over 2048 on either axis, it is a good idea to try to stay within that limit.

要注意的另一件事是检查器中图像的“最大尺寸”设置。 如果您的子画面图片在任何轴上的尺寸都大于“最大尺寸”属性(默认为2048)，它将自动调整为最大尺寸。 这通常会导致质量下降，并使图像变得模糊。 由于某些硬件在任一轴上均无法正确支持超过2048个的纹理，因此最好将其限制在此范围内。

Above, is a sprite from a spritesheet that was 2208 on one axis with max size set at 2048. As you can see, increasing the Max Size property to 4096 allows the image to be sized appropriately and avoid a loss of quality.

上面是一个Spritesheet中的Sprite，它在一个轴上的大小为2208，最大大小设置为2048。如您所见，将Max Size属性增加到4096可以适当调整图像大小并避免质量损失。

Finally, when preparing your sprite or sprite sheet, make sure you set the pivot unit mode to ‘Pixels’ instead of ‘Normalized’.

最后，在准备精灵或精灵表时，请确保将枢轴单元模式设置为“像素”，而不是“标准化”。

This is so the sprite’s pivot point will be based upon pixels rather than a smooth range from 0 to 1 across each axis of the image. If the sprite were to not pivot from a pixel exactly, we would lose pixel-perfectness. Pivots can be set for sprites in the Sprite Editor, which can be opened from the Inspector when you have a sprite asset selected.

这样一来，精灵的枢轴点将基于像素，而不是基于图像每个轴的从0到1的平滑范围。 如果子画面不能精确地从像素旋转，则我们将失去像素完美性。 可以在“精灵编辑器”中为精灵设置枢轴，当您选择了精灵资源时，可以从检查器中打开它。

安装2D Pixel Perfect软件包 (Installing the 2D Pixel Perfect package)

With assets prepared, we can set our camera up to be “pixel-perfect”. A pixel-perfect result will look clean and crisp. Telltale signs of pixel art which aren’t displayed as pixel-perfect includes blurriness (aliasing), and some pixels appearing rectangular when they should be square.

准备好资产后，我们可以将相机设置为“完美像素”。 完美像素的结果看起来干净利落。 不能显示为像素完美的像素艺术的迹象包括模糊(混叠)，并且某些像素在应为正方形时会显示为矩形。

The 2D Pixel Perfect package can be imported through the Package Manager in Unity. Click the ‘Window’ menu in the toolbar followed by ‘Package Manager’. In the new window, click ‘Advanced’ and make sure you have enabled ‘Show preview packages’. Select 2D Pixel Perfect from the list on the left, and select install on the top right of the window.

可以通过Unity中的“包管理器”导入2D Pixel Perfect包。 单击工具栏中的“窗口”菜单，然后单击“包管理器”。 在新窗口中，单击“高级”，并确保已启用“显示预览包”。 从左侧列表中选择2D Pixel Perfect，然后在窗口右上方选择安装。

That’s it. Now you are ready to begin using the pixel-perfect camera component.

而已。 现在，您可以开始使用像素完美的相机组件了。

高水平的像素完美度 (A high level of pixel-perfect-itude)

The Pixel Perfect Camera component is added to and augments Unity’s Camera component. To add it, go to your main camera and add the Pixel Perfect Camera component to it. If the Pixel Perfect Camera component option is not there, follow the previously stated instructions to first import it into the project.

Pixel Perfect Camera组件已添加并增强了Unity的Camera组件。 要添加它，请转到主相机，然后向其添加Pixel Perfect Camera组件。 如果没有“ Pixel Perfect Camera”组件选项，请按照前述说明将其首先导入到项目中。

Now let’s look at the settings we have available.

现在，让我们看看可用的设置。

First, I recommend checking ‘Run In Edit Mode’ and setting the display aspect ratio in the Game view to ‘Free Aspect’ so you can resize the game view freely. The component will display helpful messages in the game view explaining if the display is not pixel-perfect at any given resolution.

首先，我建议选中“在编辑模式下运行”，然后将“游戏”视图中的显示纵横比设置为“自由纵横比”，以便您自由调整游戏视图的大小。 该组件将在游戏视图中显示有用的消息，说明在任何给定分辨率下显示是否不是像素完美。

Now, you can go through each setting to see what they do and how they affect the look of your game!

现在，您可以浏览每种设置，以了解它们的作用以及它们如何影响您的游戏外观！

• Assets Pixels Per Unit – This field is in reference to the setting you can select in the inspector for each asset. As a general rule of thumb, each asset that will be used in the game’s world space should use the same pixels per unit (PPU), and you’d put that value here as well. If your game world exists as a grid of tiles and sprites, with each being 16 pixels by 16 pixels, a PPU of 16 would make sense – each tile of the grid would be 1 unit in worldspace coordinates. Make sure you put your chosen PPU here.

  每单位资产像素数 –此字段参考您可以在检查器中为每种资产选择的设置。 作为一般的经验法则，将在游戏世界空间中使用的每项资产都应使用相同的每单位像素(PPU)，并且您也要将该值放在此处。 如果您的游戏世界是由图块和精灵组成的网格(每个像素为16像素乘16像素)，则PPU为16才有意义-网格的每个图块在世界空间坐标中将为1个单位。 确保将您选择的PPU放在这里。

• Reference Resolution – Set this to the resolution that you intend all of your assets to be viewed at. If you want a retro look, this usually means a very small resolution. For example, the native resolution for the Sega Genesis is 320×224. When porting a game from Sega Genesis, we would use a reference resolution of 320×224. For general 16:9 usage, 320×180, as well as, 398×224 (if you want to keep the vertical resolution instead) should work well.

  参考分辨率 – 将此 分辨率 设置 为您希望查看所有资产的分辨率。 如果您想要复古的外观，这通常意味着非常小的分辨率。 例如，Sega Genesis的原始分辨率为320×224。 从世嘉创世纪移植游戏时，我们将使用320×224的参考分辨率。 对于一般的16：9用法，320×180和398×224(如果要保留垂直分辨率)应该可以正常工作。

• Upscale Render Texture – This causes the scene to be rendered at as close to the reference resolution as possible and then be upscaled to the fit the actual display size. Because this setting results in a filled screen, we recommend it if you want a full-screen pixel-perfect experience with no margins. ‘Upscale Render Texture’ will also significantly affect how sprites look when rotated.

  高档渲染纹理 –这将导致场景以尽可能接近参考分辨率的方式渲染，然后放大到适合实际显示尺寸的大小。 由于此设置会导致屏幕变满，因此，如果您希望全屏像素完美的体验而没有余量，则建议使用此设置。 “高级渲染纹理”还将显着影响旋转时精灵的外观。

• Pixel Snapping (only available with Upscale Render Texture disabled) – With this enabled, sprite renderers will be snapped to a world-space grid automatically, where the grid’s size is based off of your chosen PPU. Note that this does not actually affect any object’s transform positions. As a result, you can still smoothly interpolate objects between positions, but the visual movement will remain pixel-perfect and snappy.

  像素捕捉 (仅在禁用“高级渲染纹理”的情况下可用)–启用此选项后，子画面渲染器将自动捕捉到世界空间网格，其中网格的大小取决于您选择的PPU。 请注意，这实际上并不影响任何对象的变换位置。 结果，您仍然可以在位置之间平滑地插补对象，但是视觉移动将保持像素级完美和活泼。

  • Example:

    例：

  Pixel Snapping (only available with Upscale Render Texture disabled) – With this enabled, sprite renderers will be snapped to a world-space grid automatically, where the grid’s size is based off of your chosen PPU. Note that this does not actually affect any object’s transform positions. As a result, you can still smoothly interpolate objects between positions, but the visual movement will remain pixel-perfect and snappy.

  像素捕捉 (仅在禁用“高级渲染纹理”的情况下可用)–启用此选项后，子画面渲染器将自动捕捉到世界空间网格，其中网格的大小取决于您选择的PPU。 请注意，这实际上并不影响任何对象的变换位置。 结果，您仍然可以在位置之间平滑地插补对象，但是视觉移动将保持像素级完美和活泼。

• Crop Frame (X and Y) – This crops the viewed region of worldspace to exactly match the reference resolution, and adds black margins to the display to fill the gaps at the edges of the screen.

  裁剪框(X和Y) – 裁剪世界空间的观看区域，使其与参考分辨率完全匹配，并在显示屏上添加黑色边距以填充屏幕边缘的空白。

• Stretch Fill – Becomes available if you enable both x and y for Crop Frame. This causes the camera to scale to the game view to fit the screen in a way that preserves aspect ratio. Because this scaling won’t happen only in whole number multiples of the reference resolution, it will cause pixel-perfectness to be lost at any resolution which is not a whole number multiple of the reference resolution. The advantage here is that even though you lose pixel-perfectness for many resolutions, you won’t have the black bar margins and will instead have a fully filled screen. Note that although blurring often occurs from stretch fill, the usual alert display message does not show up.

  拉伸填充 –如果同时启用了“裁剪框”的x和y，则变为可用。 这会导致相机缩放到游戏视图以适合屏幕，并保持宽高比。 因为这种缩放不会仅以参考分辨率的整数倍发生，所以它将导致像素精度在任何不是参考分辨率的整数倍的分辨率下丧失。 这样做的好处是，即使您在许多分辨率下都失去了像素完美性，您也不会出现黑边空白，而是拥有完全填充的屏幕。 请注意，尽管拉伸填充经常会导致模糊，但通常不会显示警报显示消息。

关于使用Pixel Perfect Camera的建议 (Recommendations on using the Pixel Perfect Camera)

If you want a pixel-perfect and snappy display that will work for a variety of use-case, I recommend:

如果您想要一个像素完美且活泼的显示器，可以在各种用例中使用，我建议：

• Use a reference resolution that will never be bigger than a player’s window resolution (such as 320×180).

  使用永远不会大于播放器窗口分辨率的参考分辨率(例如320×180)。

• Enable or Disable Upscale Render Texture

  启用或禁用高档渲染纹理

  • Enable it if you will use rotations outside of 90, 180, and 270 and if you prefer the visual effect it has on rotated sprites.

    如果您将使用90、180和270以外的旋转，并且希望使用它对旋转的精灵具有视觉效果，请启用它。

  • Upscaled render texture can result in a non-pixel-perfect image at some resolutions, depending on your reference resolution. Experiment with this and different screen resolutions using ‘Run in Edit Mode’ enabled on the Pixel. Perfect Camera component to determine whether this is an issue for your resolution. If you can get this to produce a pixel-perfect image at all target resolutions, this will result in the best full-screen pixel-perfect experience.

    放大的渲染纹理可能会导致某些分辨率的像素不完美的图像，具体取决于您的参考分辨率。 使用Pixel上启用的“在编辑模式下运行”，尝试使用此分辨率和不同的屏幕分辨率。 完美的相机组件，以确定这是否是您的分辨率问题。 如果您能够在所有目标分辨率下生成像素完美的图像，则将获得最佳的全屏像素完美体验。

  Enable or Disable Upscale Render Texture

  启用或禁用高档渲染纹理

• Enable or Disable Pixel Snapping as you prefer

  根据需要启用或禁用像素捕捉

  • This is more personal preference than anything. Without snapping, you have much smoother movement, but pixels can be out of alignment.

    这比什么都更是个人喜好。 如果没有对齐，则移动会更加顺畅，但是像素可能会不对齐。

  Enable or Disable Pixel Snapping as you prefer

  根据需要启用或禁用像素捕捉

• Enable Crop Frame X and/or Y if not using Upscale Render Texture

  如果不使用“高级渲染纹理”，则启用“裁剪框X”和/或“ Y”

  • If you can’t consistently get a pixel-perfect result with upscale render texture, cropping X and/or Y will ensure a pixel-perfect image for any resolution greater than the reference resolution, but creates big margins at the edges of the screen for some resolutions.

    如果无法始终获得高质量渲染效果的像素完美效果，则裁剪X和/或Y将确保任何分辨率高于参考分辨率的像素完美图像，但会在屏幕边缘产生较大的空白一些决议。

  Enable Crop Frame X and/or Y if not using Upscale Render Texture

  如果不使用“高级渲染纹理”，则启用“裁剪框X”和/或“ Y”

• Disable Stretch Fill

  禁用拉伸填充

We recommend setting the camera to be optimized for 16:9 aspect ratio viewing, including reference resolution if possible. At the time of writing, most gamers play on 16:9 monitors, and in 1920×1080 resolution. For example, 320×180 reference resolution is 16:9, and so it will have no black bar margins when played at 1920×1080 or any resolution which is an even multiple of 320×180, such as 1280×720.

我们建议将相机设置为针对16：9的宽高比观看而优化，包括参考分辨率(如果可能)。 在撰写本文时，大多数游戏者都以1920×1080分辨率在16：9显示器上玩。 例如，320×180的参考分辨率为16：9，因此在以1920×1080的分辨率或320×180的偶数倍数(例如1280×720)播放时，它不会有黑边空白。

In Unity’s toolbar, you can go under Edit > Project Settings > Player and limit the aspect ratios that the game will support. If you find a particular configuration works just as you want in the ratio you’re targeting but looks bad in some particular aspect ratios, you can prevent the window from being at those ratios here. However, keep in mind that not all users will have a display setup that will work well with your limitations, so this is not recommended. Instead, enable cropping so these users will have margins, rather than having to play in a resolution which doesn’t fit their screen.

在Unity的工具栏中，您可以进入“编辑”>“项目设置”>“播放器”，并限制游戏将支持的纵横比。 如果您发现特定的配置在目标比例中可以正常工作，但在某些特定的纵横比中看起来很差，则可以在此处防止窗口处于这些比例。 但是，请记住，并非所有用户都可以使用可以满足您的限制的显示设置，因此不建议这样做。 而是启用裁剪，以便这些用户有余量，而不必以不适合其屏幕的分辨率播放。

创建真实的NES风格的艺术品 (Creating Authentic NES Styled Artwork)

Now that we’ve covered how to set Unity up for pixel-perfect art, let’s look at the basics of creating artwork for games that follow the restrictions of the classic Nintendo Entertainment System. This console generation places a large number of restrictions on the artists trying to create an authentic image. These restrictions include things like palettes used and the size and amount of objects on a screen. Additionally, it is import to keep in mind is the reference resolution of 256×240 when “targeting” this console.

现在，我们已经介绍了如何为像素完美的艺术设置Unity，让我们看一下为经典的Nintendo Entertainment System限制的游戏创建艺术作品的基本知识。 此控制台生成对试图创建真实图像的艺术家有很多限制。 这些限制包括诸如使用的调色板以及屏幕上对象的大小和数量之类的东西。 另外，重要的是要牢记“瞄准”该控制台时的参考分辨率为256×240。

调色板 (Palettes)

When creating artwork that is genuine to the NES, there are a host of restrictions that the artist will have to follow. Some of these will be consistent no matter what retro console an artist is attempting to emulate, while many others are specific to the NES itself. The first, and possibly the most important of these restrictions involve the way color palettes are used in an image. The NES is fairly unique when it comes to its color palette because the full-color palette of the console is hardcoded into the console. The NES chooses which colors to use in an image by sending a series of values to the graphics processor on the NES, and then the graphics processor returns the colors associated with those values. Below is an image of the NES’ color palette:

在创建NES真正的艺术品时，艺术家必须遵循许多限制。 无论艺术家试图模仿哪种复古控制台，其中的一些都将是一致的，而其他许多则是针对NES本身的。 这些限制中的第一个(也是最重要的)限制涉及在图像中使用调色板的方式。 NES在调色板方面相当独特，因为控制台的全彩调色板已硬编码到控制台中。 NES通过向NES上的图形处理器发送一系列值来选择要在图像中使用的颜色，然后图形处理器返回与这些值关联的颜色。 下面是NES调色板的图像：

These colors cannot be changed due to the fact that they are part of the console themselves. Every game you have ever seen for this console uses combinations of these colors in order to make their images.

这些颜色不能更改，因为它们本身是控制台的一部分。 您在该控制台上看到的每个游戏都使用这些颜色的组合来制作图像。

子面板 (Sub-Palettes)

To create the combinations that are used in the game, sub-palettes are created and assigned to either the in-game sprites or background elements. The NES breaks its palette up into sub-palettes that can be assigned to sprites and backgrounds. Each sub-palette includes one common color that is used across all of the sub-palettes and three unique colors. It is capable of loading four sub-palettes for the backgrounds and four sub-palettes for the sprites. In the case of the sprites, the common color at the beginning of each sub-palette is treated as transparency.

为了创建游戏中使用的组合，将创建子选板并将其分配给游戏中的精灵或背景元素。 NES将其调色板分成多个子调色板，这些子调色板可分配给精灵和背景。 每个子调色板包括一种用于所有子调色板的通用颜色和三种唯一颜色。 它能够为背景加载四个子调色板，为子画面加载四个子调色板。 对于子画面，每个子调色板开始处的共同颜色被视为透明。

This is an example of a series of sub-palettes that are being used in a game. The top row represents the background sub-palettes and the bottom row represents the sprite sub-palettes. In this example, black is being used as the common color that is shared across all of the sub-palettes. Because the common color is treated as transparency on sprites, a second black palette entry is needed to be made for the sprite sub-palettes, in order to use it as a visible color.

这是游戏中使用的一系列子选板的示例。 第一行代表背景子选项板，第二行代表子画面子选项板。 在此示例中，黑色被用作在所有子调色板之间共享的通用颜色。 因为公共颜色被视为精灵上的透明，所以需要为精灵子调色板创建第二个黑色调色板条目，以便将其用作可见颜色。

子面板分配 (Sub-Palette Assignment)

The restrictions on palette use get even tighter as the artist moves on to how the palettes are used in the game. To explain this, there needs to be further discussion on how retro consoles store, use, and display art. The artwork in any retro console is stored in the game as 8×8 px tiles. Using this tile-based approach allows artists to save space by reusing tiles for different things. (For example, pieces of a sidewalk can be repurposed and used to make the ledge on a building). The other important thing to note about tile based storage is that color information is generally not saved with the graphics. All of the tiles are saved with a monochromatic palette. This way, whenever a tile is displayed in the game it can have a sub-palette assigned to it, allowing the same tile to be simultaneously displayed on screen with different sub-palettes This is significant when creating artwork that is true to a retro console on a modern platform because it affects how you assign palettes to the artwork.

随着美术师继续在游戏中使用调色板，对调色板使用的限制变得更加严格。 为了解释这一点，需要进一步讨论复古控制台如何存储，使用和显示艺术品。 任何复古控制台中的插图都以8×8像素的图块形式存储在游戏中。 使用这种基于图块的方法，艺术家可以通过将图块重复用于其他事物来节省空间。 (例如，人行道的各个部分可以重新利用，并用于在建筑物上制作壁架)。 关于基于图块的存储要注意的另一重要事项是颜色信息通常不随图形一起保存。 所有图块均以单色调色板保存。 这样，每当在游戏中显示图块时，便可以为其分配一个子选项板，从而可以将同一图块同时显示在具有不同子选项板的屏幕上。这对于创建适用于复古游戏机的艺术品非常重要在现代平台上使用，因为它会影响您将调色板分配给艺术品的方式。

The NES assigns palettes to sprites and backgrounds differently. It assigns sub-palettes for sprites on a tile-by-tile basis. That means that every 8×8 tile in a sprite can have one of the four sprite sub-palettes assigned to it.

NES将调色板分别指定给精灵和背景。 它以图块为单位为子画面分配子面板。 这意味着子画面中的每个8×8磁贴都可以分配有四个子画面子调色板之一。

Backgrounds, on the other hand, are much more restrictive. Backgrounds assign their palettes in 16×16 chunks. The sub-palette assignments for an entire screen’s worth of background are referred to as Attribute Tables. These Attribute Tables are the reason why most retro artwork involves heavy use of repeating tiled segments. Those segments tend to be composed of 16×16 tiles so that they neatly fit into an Attribute Table. Despite being in response to a hardware restriction, this 16×16 tile-based approach to backgrounds ended up being a defining characteristic of retro artwork and is absolutely necessary when trying to recreate it.

另一方面，背景要严格得多。 背景按16×16块分配其调色板。 整个屏幕背景值的子选项板分配称为“属性表”。 这些属性表是大多数复古艺术品都大量使用重复的平铺片段的原因。 这些段往往由16×16的图块组成，因此它们整齐地适合属性表。 尽管响应于硬件限制，但这种基于16×16瓦片的背景处理方法最终还是复古艺术品的定义特征，并且在尝试重新制作时绝对必要。

精灵分层 (Sprite Layering)

Even though artists are free to use different sub-palettes for each 8×8 tile of a sprite, they might find themselves in a situation where they want to have a greater color depth in a sprite than what is already available. This is where sprite layering can come in. Sprite layering is simply splitting a sprite up into two separate sprites and then placing them on top of each other. This allows artists to circumvent the one sub-palette per 8×8 tile restriction. Doing this will essentially allow artists to double the number of colors that can be used in a single 8×8 area. The only major drawback of doing this is sprite rendering limits. The NES is only capable of displaying 64 8×8 sprite tiles on screen at once, and only 8 sprite tiles in the same horizontal line with one another. Once those numbers are reached, any further sprite tiles will not be rendered on screen. This is why many NES games would flicker sprites when there was a lot of them on the screen at once. That way, it’s only displaying certain sprites on alternating frames. These limits are something artists need to be mindful of when they are layering sprites on top of each other because while it doubles the number of colors, it also doubles the number of sprite tiles on the same horizontal line.

即使艺术家可以为子画面的每个8×8磁贴随意使用不同的子调色板，但他们可能会发现自己希望在子画面中具有比现有颜色更大的色深。 这就是可以进行子画面分层的地方。子画面分层只是将子画面分成两个单独的子画面，然后将它们放置在彼此之上。 这允许美术师每8×8格限制避开一个子调色板。 这样做基本上可以使艺术家将单个8×8区域中可以使用的颜色数量加倍。 这样做的唯一主要缺点是图片渲染限制。 NES一次只能在屏幕上显示64个8×8子画面图块，并且在同一水平线上只能显示8个子画面图块。 一旦达到这些数量，任何其他的精灵图块都将不会在屏幕上呈现。 这就是为什么当屏幕上同时出现许多NES游戏时它们会闪烁精灵的原因。 这样，它仅在交替的帧上显示某些精灵。 这些限制是美术师在将精灵彼此叠加时需要注意的一些事项，因为虽然它使颜色数量加倍，但在同一水平线上的精灵瓷砖数量也加倍。

Sprite layering can also be done with the background to get around the Attribute Table limits. This trick is generally used for static images, like story screens and character portraits, to give them a much greater color depth. In order to do this, the artist would draw part of the image as the background and then layer sprites on top of it to fill in the rest.

子画面分层也可以在背景中完成，以绕过属性表限制。 此技巧通常用于静态图像(例如故事屏幕和人物肖像)，以使它们具有更大的色彩深度。 为了做到这一点，艺术家将绘制图像的一部分作为背景，然后在其顶部分层精灵以填充其余部分。

图形库 (Graphics Banks)

To explain the next major restriction of the NES, first, we need to circle back to the fact that graphics are stored in tiles. Graphics tiles are stored in 256 tile pages and tiles from these pages cannot be loaded into VRAM in different locations, so it becomes difficult to mix and match tiles from different pages on the fly. The NES’ VRAM is only capable of displaying 512 of these tiles at once. Beyond just that restriction, it splits the tiles in half for sprites and background. That means it is only capable of displaying 256 sprite tiles and 256 background tiles at any given moment. This can become very restrictive if the artist wants to display a large variety of sprites and background elements.

为了解释NES的下一个主要限制，首先，我们需要转回一个事实，即图形存储在图块中。 图形图块存储在256个图块页面中，并且这些页面中的图块无法在不同位置加载到VRAM中，因此，很难即时混合和匹配来自不同页面的图块。 NES的VRAM一次只能显示512个这些图块。 除了该限制之外，它还将图块一分为二，以获取精灵和背景。 这意味着它在任何给定时刻只能显示256个Sprite Tile和256个Background Tile。 如果艺术家想显示各种各样的精灵和背景元素，这可能会变得非常严格。

In order to combat this limitation, the NES has a feature that allows the artist to break each page up into partial pages called banks. So while the NES isn’t capable of loading individual tiles from various points in the graphics data, it is capable of loading different sections of a page at different times. For most games, these banks are either going to be 1K or 2K banks. A 1K bank equals one-fourth of a page or 64 tiles, while a 2K bank is half of a page or 128 tiles. The artist must decide if they want to reserve the use of each type of bank for either Sprites or Background elements because both types of banks need to be utilized. That means that you cannot have 1K banks for both the sprites and backgrounds. One page needs to use 1K banks and the other needs to use 2K. Generally speaking, most games tend to use 1K banks for the sprites and 2K banks for the backgrounds because background tilesets tend to be more static and need less in terms of on the fly variety.

为了克服此限制，NES具有一项功能，该功能使美术师可以将每个页面分成称为bank的部分页面。 因此，尽管NES不能从图形数据的各个点加载单个图块，但它可以在不同时间加载页面的不同部分。 对于大多数游戏，这些银行将是1K或2K银行。 1K库等于一页的四分之一或64个图块，而2K库等于一页的一半或128个图块。 艺术家必须决定是否要保留对Sprites或Background元素使用每种类型的库，因为两种类型的库都需要使用。 这意味着精灵和背景都不能有1000个库。 一页需要使用1K银行，另一页需要使用2K。 一般而言，大多数游戏倾向于将1K库用作子画面，将2K库用作背景，因为背景图块集趋向于更静态，并且在动态变化方面的需求更少。

The usefulness of 1K banks for sprites is pretty significant. If the player sprite has a large range of animations that will not fit in a single page along with all of the other sprites that need to be loaded, individual actions can be saved in 1K banks and then swapped between depending on what action is happening on screen. It also allows for a larger variety of sprites that can be used in a single area of a game. For instance, if the player is to encounter six different kinds of enemies in an area of a game, but the sprite page only allows for the player and three other types of sprites, then when one enemy type is cleared off of the screen, the game can swap one of the enemy banks in for a new enemy type.

1K库对于子画面的有用性非常重要。 如果播放器精灵的动画种类繁多，并且无法加载需要加载的所有其他精灵，那么它们就无法容纳在一个页面中，则可以将各个动作保存在1K库中，然后根据发生的动作在它们之间进行切换屏幕。 它还允许在游戏的单个区域中使用更多种类的精灵。 例如，如果玩家要在游戏区域中遇到六种不同类型的敌人，但精灵页面仅允许玩家和其他三种类型的精灵，则当从屏幕上清除一种敌人类型时，游戏可以将敌方银行之一换成新的敌方类型。

One of the only major drawbacks of using 1K banks for sprites and 2K banks for backgrounds is how the NES handles background animation. In order to animate a background element for a NES game, the artist has to create duplicate banks of the animated background elements. Each new duplicate bank will contain the next frame of animation for each of the animated elements. These banks are then swapped in and out one at a time like a flip-book, in order to create the animation. If the artist is using half-page banks for the backgrounds, then storing all of those duplicate banks can take up a lot of space. One way to circumvent this though is to put all of the animated background elements for the entire game into a single bank. But, that also leaves the artist with the restriction of only having 128 tiles left over for the static elements for each background. It is up to the artist to decide the best course of action when deciding what kinds of banks they are going to use for the art.

将1K库用作子画面和2K库作为背景的唯一主要缺点之一是NES如何处理背景动画。 为了给NES游戏的背景元素制作动画，艺术家必须创建动画背景元素的重复库。 每个新的重复库将包含每个动画元素的下一帧动画。 然后像翻书一样一次将这些库换入和换出，以创建动画。 如果艺术家使用半页存储库作为背景，则存储所有这些重复的存储库会占用大量空间。 规避此问题的一种方法是将整个游戏的所有动画背景元素放入一个库中。 但是，这也给美术人员留下了限制，即每个背景的静态元素只能剩下128个图块。 在决定他们将用于艺术的银行种类时，由艺术家决定最佳行动方案。

分层技巧 (Layering Tricks)

Many games from that era will employ tricks to create effects like parallax scrolling in the background, but these too present the artists and designers with a challenge. While the later 16-bit consoles allowed for multiple background layers, this is not an option on the NES. All backgrounds are a single flattened image. In order to create a sense of depth and layering, different programming tricks were used. In order to create a parallax background, for instance, the developer is able to set a register that can tell when a certain horizontal line (known as a raster line) is being rendered on the screen. They can then use that register to control the speed and direction that the screen is scrolling in. By using that, they can create a horizontal row of the background that scrolls at a different speed as the rest of the background. The trick for the artists and designers at this point is to be mindful that the background is still one flat image. If a platform or any other element that is supposed to be “in front” of that slower moving background is placed in that region, then it too will scroll slower than the rest of the image. That means that designers need to be mindful of where they are placing background elements in the scene, and artists need to create the background in a way that the effect will be seamless.

那个时代的许多游戏都会使用技巧来在背景中创建效果，例如视差滚动，但这些也给美术师和设计师带来了挑战。 尽管后来的16位控制台允许多个背景层，但NES上不是一个选项。 所有背景都是单个拼合的图像。 为了营造深度感和层次感，使用了不同的编程技巧。 例如，为了创建视差背景，开发人员可以设置一个寄存器，该寄存器可以告知何时在屏幕上呈现某个水平线(称为栅格线)。 然后，他们可以使用该寄存器来控制屏幕滚动的速度和方向。通过使用它们，他们可以创建背景的水平行，并以与其他背景不同的速度滚动。 在这一点上，对于艺术家和设计师而言，技巧是要记住背景仍然是一个平面图像。 如果将平台或任何其他元素(假定应该位于该移动较慢的背景“之前”)放置在该区域中，则其滚动速度也将比图像其余部分慢。 这意味着设计师需要注意在场景中放置背景元素的位置，艺术家需要以无缝的效果来创建背景。

There’s also another trick for artists that want to have one of their background elements appear in the foreground. On the NES, developers are able to set a sprite’s priority to be less than zero. When this is done, it will cause the sprite to be displayed behind any non-transparent background pixels. Sprite priorities can be modified and triggered on the fly as well, allowing for certain elements to change a sprite’s priority as needed.

对于想要让其背景元素之一出现在前景中的艺术家来说，还有另一个技巧。 在NES上，开发人员可以将Sprite的优先级设置为小于零。 完成此操作后，它将使子画面显示在任何非透明背景像素的后面。 Sprite优先级也可以即时修改和触发，允许某些元素根据需要更改Sprite的优先级。

结论 (Conclusion)

When someone is trying to create a project that is authentic to a retro console, there are many technical considerations that they need to keep in mind that might not be things that modern development has to worry about. Due to the way older machines would render images and handle having small amounts of room to maneuver with the CPU and GPU, the designers would have to think creatively to work around the hardware’s limitations. In the modern age, it becomes important to learn about those limitations and the techniques, in order to truly recreate the look and design of games from that era. In the next post, we will look at the design limitations imposed by the 16-bit era as well as the Unity work needed to get that truly “old TV” feel. The 2D Pixel Perfect guide for 16 bits retro visuals is now available here.

当某人试图创建一个对复古控制台真实的项目时，他们需要牢记许多技术上的考虑，而这可能并不是现代开发所要担心的。 由于较旧的机器会渲染图像并处理少量的空间以便通过CPU和GPU进行操作，因此设计人员必须创造性地考虑硬件的局限性。 在现代，重要的是要了解这些限制和技术，以便真正重现那个时代的游戏外观和设计。 在下一篇文章中，我们将研究16位时代带来的设计局限性以及获得真正“旧电视”感觉所需的Unity工作。 此处提供16位复古视觉效果的2D像素完美指南。

—

-

First time designing levels with Tilemap? Explore worldbuilding in 2D in this beginner tutorial on Unity Learn.

第一次使用Tilemap设计关卡？ 在Unity Learn的 这个 初学者教程中 ， 以2D探索世界建构 。

翻译自: https://blogs.unity3d.com/2019/03/13/2d-pixel-perfect-how-to-set-up-your-unity-project-for-retro-8-bits-games/

unity pixel