방법: 기본 질감 만들기How to: Create a Basic Texture

이 문서에서는 이미지 편집기를 사용하여 기본 질감을 만드는 방법을 설명합니다.This document demonstrates how to use the Image Editor to create a basic texture.

이 문서는 다음 활동을 보여 줍니다.This document demonstrates these activities:

  • 질감 크기 설정Setting the size of the texture

  • 전경색 및 배경색 설정Setting the foreground and background colors

  • 알파 채널(투명도) 사용Using the alpha channel (transparency)

  • 채우기타원 도구 사용Using the Fill and Ellipse tools

  • 도구 속성 설정Setting tool properties

기본 질감 만들기Creating a basic texture

[이미지 편집기]를 사용하여 게임 또는 앱에 대한 이미지와 질감을 만들고 수정할 수 있습니다.You can use the Image Editor to create and modify images and textures for your game or app.

다음 단계에서는 "bullseye" 대상을 나타내는 질감을 만드는 방법을 보여 줍니다. 작업을 마치면 질감이 다름 그림과 같이 표시됩니다.The following steps show how to create a texture that represents a "bullseye" target.When you are finished, the texture should look like the following picture. 질감에서 투명도를 더 잘 보여 주기 위해 [이미지 편집기]는 질감을 표시하는 데 녹색 체크무늬 패턴을 사용하도록 구성되었습니다.To better demonstrate the transparency in the texture, the Image Editor has been configured to use a green, checkered pattern to display it.

녹색으로 표시된 투명도가 있는 "Bullseye" 대상"Bullseye" target with transparency shown in green

시작하기 전에 속성 창이 표시되는지 확인하세요.Before you begin, make sure that the Properties window is displayed. 속성 창을 사용하여 이미지 크기를 설정하고, 도구 속성을 변경하고, 작업 중에 색을 지정합니다.You use the Properties window to set the image size, change tool properties, and specify colors while you work.

"bullseye" 대상 질감을 만들려면To create a "bullseye" target texture

  1. 사용할 질감을 만듭니다.Create a texture to work with. 질감을 프로젝트에 추가하는 방법에 대한 내용은 이미지 편집기의 시작 섹션을 참조하세요.For information about how to add a texture to your project, see the Getting Started section in Image Editor.

  2. 이미지 크기를 512x512 픽셀로 설정합니다.Set the image size to 512x512 pixels. 속성 창에서 너비높이 속성 값을 512로 설정합니다.In the Properties window, set the values of the Width and Height properties to 512.

  3. [이미지 편집기] 도구 모음에서 채우기 도구를 선택합니다.On the Image Editor toolbar, choose the Fill tool. 이제 속성 창에 채우기 도구의 속성과 이미지 속성이 함께 표시됩니다.The Properties window now displays the properties of the Fill tool together with the image properties.

  4. 전경색을 완전 투명 검은색으로 설정합니다.Set the foreground color to fully-transparent black. 속성 창의 속성 그룹에서 전경을 선택합니다.In the Properties window, in the Colors property group, select Foreground. 색 선택기 옆에 있는 R, G, BA 속성의 값을 0으로 설정합니다.Set the values of the R, G, B, and A properties next to the color picker to 0.

  5. [이미지 편집기] 도구 모음에서 채우기 도구를 선택하고 Shift 키를 누른 채 이미지에서 임의 점을 선택합니다.On the Image Editor toolbar, choose the Fill tool, and then press and hold the Shift key and choose any point in the image. Shift 키를 사용하면 채우기 색의 알파 값이 이미지의 색을 대체합니다. 그렇지 않으면 알파 값이 채우기 색을 이미지의 색과 혼합하는 데 사용됩니다.Using the Shift key causes the alpha value of the fill color to replace the color in the image; otherwise, the alpha value is used to blend the fill color together with the color in the image.

    중요

    이전 단계의 색 선택과 함께 이 단계에서는 그리려는 "bullseye" 대상 질감에 사용할 기본 이미지가 준비되어 있는지 확인합니다.This step, together with the color selection in the previous step, ensures that the base image is prepared for the "bullseye" target texture that you will draw. 이미지가 투명 검은색으로 채워진 경우에는 대상의 테두리가 검은색이므로 대상 주변에 앨리어싱 아티팩트가 없게 됩니다.When the image is filled with transparent black—and because the border of the target is black—there will be no aliasing artifacts around the target.

  6. [이미지 편집기] 도구 모음에서 타원 도구를 선택합니다.On the Image Editor toolbar, choose the Ellipse tool.

  7. 전경색을 완전 불투명 검은색으로 설정합니다.Set the foreground color to fully-opaque black. R, GB 속성의 값을 0으로 설정하고 A 속성의 값을 255로 설정합니다.Set the values of the R, G, and B properties to 0 and the value of the A property to 255.

  8. 배경색을 완전 불투명 흰색으로 설정합니다.Set the background color to fully-opaque white. 속성 창의 속성 그룹에서 배경을 선택합니다.In the Properties window, in the Colors property group, select Background. R, G, BA 속성의 값을 255로 설정합니다.Set the values of the R, G, B, and A properties to 255.

  9. 타원 윤곽선의 너비를 설정합니다.Set the width of the outline of the ellipse. 속성 창의 모양 속성 그룹에서 너비 속성의 값을 8로 설정합니다.In the Properties window, in the Appearance property group, set the value of the Width property to 8.

  10. 앤티앨리어싱이 사용하도록 설정되어 있는지 확인합니다.Make sure that anti-aliasing is enabled. 속성 창의 모양 속성 그룹에서 앤티앨리어싱 속성이 설정되어 있는지 확인합니다.In the Properties window, in the Appearance property group, make sure that the Anti-alias property is set.

  11. 타원 도구를 사용하여 픽셀 좌표 (3, 3)에서 픽셀 좌표 (508, 508)까지 원을 그립니다.Using the Ellipse tool, draw a circle from pixel coordinate (3, 3) to pixel coordinate (508, 508). 원을 더 쉽게 그리려면 그릴 때 Shift 키를 누르고 있습니다.To draw the circle more easily, you can press and hold the Shift key while you draw.

    참고

    현재 포인터 위치의 픽셀 좌표가 Visual StudioVisual Studio 상태 표시줄에 표시됩니다.The pixel coordinates of the current pointer location are displayed on the Visual StudioVisual Studio status bar.

  12. 배경색을 변경합니다.Change the background color. R44로, G165로, B211로, A255로 설정합니다.Set R to 44, G to 165, B to 211, and A to 255.

  13. 픽셀 좌표 (64, 64)에서 픽셀 좌표 (448, 448)까지 또 다른 원을 그립니다.Draw another circle from pixel coordinate (64, 64) to pixel coordinate (448, 448).

  14. 배경색을 다시 완전 불투명 흰색으로 변경합니다.Change the background color back to fully-opaque white. R, G, BA255로 설정합니다.Set R, G, B, and A to 255.

  15. 픽셀 좌표 (128, 128)에서 픽셀 좌표 (384, 384)까지 또 다른 원을 그립니다.Draw another circle from pixel coordinate (128, 128) to pixel coordinate (384, 384).

  16. 배경색을 변경합니다.Change the background color. R to 255, GB64로, A255로 설정합니다.Set R to 255, G and B to 64, and A to 255.

  17. 픽셀 좌표 (192, 192)에서 픽셀 좌표 (320, 320)까지 또 다른 원을 그립니다.Draw another circle from pixel coordinate (192, 192) to pixel coordinate (320, 320).

    "bullseye" 대상 질감이 완료되었습니다.The "bullseye" target texture is complete. 다음 그림은 투명도가 적용된 최종 이미지입니다.Here's the final image, shown with transparency.

    전체 "bullseye" 대상 질감The complete "bullseye" target texture

    다음 단계로 이 질감에 대한 MIP 수준을 생성할 수 있습니다.As a next step, you can generate MIP levels for this texture. 자세한 내용은 방법: MIP 수준 만들기 및 수정을 참조하세요.For information, see How to: Create and Modify MIP Levels.

참고 항목See Also

이미지 편집기Image Editor