[Unity] Unity6 픽셀 아트 2D 라이팅 튜토리얼 (2)

포스트 프로세싱으로 효과 강조하기

1. 포스트 프로세싱 소개

1) 포스트 프로세싱이란?

포스트 프로세싱(Post-Processing)은 카메라가 촬영한 장면의 결과물에 추가 효과를 적용하여 그래픽을 더욱 화려하고 풍부하게 만드는 과정입니다.

2) Universial RP와 포스트 프로세싱

Universial RP(URP) 템플릿은 포스트 프로세싱 작업을 쉽게 할 수 있도록 설계되어 있습니다.

이를 위해 Volume 컴포넌트와 Volume Profile 에셋을 제공합니다.

• Volume 컴포넌트: 포스트 프로세싱 효과를 적용할 영역을 정의합니다.
• Volume Profile 에셋: 다양한 포스트 프로세싱 설정(효과)을 저장하고 관리합니다.

 

2. 포스트 프로세싱 준비하기

1) 2D 프로젝트에서 포스트 프로세싱 설정 필요

Universial RP의 3D 기본 Scene에는 Global Volume이 포함되어 있지만, 2D Scene에서는 별도로 설정해야 합니다.

 

2) 카메라 설정 변경

1. 카메라 선택 : Hierarchy 창에서 Main Camera를 선택합니다.
2. Post Processing 활성화
   • Inspector 창에서 Rendering 카테고리를 펼칩니다.
   • Post Processing 속성을 찾아 체크합니다. (기본값은 해제되어 있음)

3) Global Volume 생성

1. Global Volume 추가 : Volume > Global Volume를 선택하여 생성합니다.
2. Volume 컴포넌트 설정
   • Global Volume의 Mode를 Global로 설정합니다. (전역에 포스트 프로세싱 효과 적용)
3. Volume Profile 생성
   • Volume 컴포넌트에는 Volume Profile 에셋이 필요합니다.
   • Inspector 창의 New 버튼을 클릭하면 해당 Scene 폴더와 함께 Global Volume Profile 에셋이 자동 생성됩니다.

3. 빛번짐 Bloom 효과 추가하기

1) Volume Profile에 효과 추가

1. Volume Profile 활성화 확인
   • Global Volume에 Volume Profile이 이미 할당되어 있어야 합니다.
2. Add Override 선택
   • Inspector 창에서 Add Override 버튼을 클릭합니다.
   • Post-processing > Bloom을 선택하여 추가합니다.

2) Bloom 효과 조정

1. Intensity 설정
   • Intensity 옆 체크박스를 클릭하여 활성화합니다.
   • 값을 1 ~ 2 사이로 조정하며 적절한 수치를 찾습니다.
   • 주의: 너무 높은 값은 분위기를 해칠 수 있으므로 적절한 값을 선택합니다.
2. 추가 속성 조정 (선택 사항)
   • Threshold (임계값): Bloom 효과가 시작되는 밝기의 기준을 설정합니다.
   • Scatter (번짐의 세기): Bloom 효과의 확산 정도를 조절합니다.

 

3) 사전 설정 활용

샘플 프로젝트의 Settings 폴더에 사전 설정된 Global Volume Profile이 포함되어 있습니다. 이를 적용해도 무관합니다.

Before / After

---

입체감을 표현하는 효과 넣기

1. 노멀맵 소개

1) 노멀맵이란?

• 정의 : 노멀맵은 3D 객체의 표면을 세밀하게 표현하기 위한 텍스처로, 빛에 반응하여 입체감을 표현합니다.
• 사용 이유
  • 물리적인 폴리곤으로 디테일을 표현할 경우, CPU, GPU 연산량 증가 및 메모리 부담 발생.
  • 노멀맵은 이러한 문제를 해결하면서도 입체감을 제공합니다.

 

2) 노멀맵의 유니티 2D 지원

유니티의 2D 스프라이트에서 노멀맵을 활용할 수 있는 기능을 제공합니다.

 

2. 픽셀아트 노멀맵 제작하기

1) 픽셀아트 노멀맵의 특징

• 일반 노멀맵 제작 방식과의 차이:
  • 일반 텍스처의 경우, 고해상도에서 제작되며, 이에 따른 노멀맵도 고해상도로 생성됩니다.
  • 픽셀아트는 저해상도 기반이므로 기존 방식 그대로 노멀맵을 제작하면 부자연스럽고 어긋난 결과물이 나올 수 있습니다.

 

2) 픽셀아트 노멀맵 제작 도구

• Aseprite 플러그인: 픽셀아트 제작에 특화된 Aseprite는 자동으로 노멀맵을 생성할 수 있는 플러그인을 지원합니다.
  • #mooosik's normal-toolkit
  • #securas's Edge Normals
• 직접 제작 가능성:
  • 픽셀아트는 저해상도이므로, 3D 그래픽과 달리 직접 노멀맵을 제작하는 것도 충분히 가능합니다.

 

3) 노멀맵 제작을 위한 가이드

• 가이드 이미지 사용:
  • 방향별 색상을 참고하며 제작할 수 있도록 가이드 이미지가 필요합니다.
  • 이 프로젝트에는 이미 포함되어 있으며, 경로는 Sprites > Props > Sample_Normal 스프라이트에서 확인할 수 있습니다.
• 가이드 이미지의 예:
  • 입체적인 구체 표면의 노멀맵 표현:
    • 평면 부분은 연보라색으로 표시됩니다.
    • 이 색상표를 활용하여 픽셀아트 해상도에 맞춘 정확한 노멀맵 제작 가능.
      

      

4) 예시: Block 객체 노멀맵 제작

• 프로젝트에 배치된 Block 객체는 픽셀아트 노멀맵 제작 방식의 이상적인 예시입니다.
• 가이드 이미지를 참고하며 Block의 표면에 맞는 색상을 칠하여 노멀맵을 생성해보세요.

 

3. 노멀맵 적용하기

1. 유니티에서 노멀맵 적용 방법

• Secondary Texture로 등록:
  • 유니티에서 노멀맵을 적용하려면 원본 스프라이트의 Secondary Texture로 등록해야 합니다.
  • 드롭다운 기본 항목 중 _NormalMap 이 존재하므로 손쉽게 추가 가능합니다.

 

2. 노멀맵 적용 후 확인

Witch 객체를 Light 2D 가까이에 배치합니다. 하지만 처음에는 입체감이 명확히 드러나지 않습니다.

 

3. 추가 설정: Light 2D에서 Normal Maps 활성화

• 모든 Spot Light 및 Sprite Light 2D에서 다음 설정을 변경합니다:
  • Normal Maps > Quality 를 Accurate로 설정.
  • 픽셀아트의 저해상도 특성상 정확한 노멀맵 반영이 필요하기 때문입니다.
• 설정 적용 후:
  • Witch 객체의 마법사 모자 부분에서 노멀맵 경계에 따른 명암 변화를 확인할 수 있습니다.

4. 추가 작업 필요성

• 현재 상태 문제점:
  • 노멀맵 효과는 활성화되었지만 효과가 부족하게 느껴짐.
  • 기존에 비추던 조명이 더 어두워지는 문제 발생.
• 다음 작업:
  • 노멀맵 효과를 증폭하고, 무너진 조명을 복구하는 방법을 추가로 다룰 예정입니다.

이상해진 Mineral 조명

4. Rim Light로 전환하기

1) Rim Light의 특징과 필요성

• 노멀맵의 한계: 고해상도 2D 프로젝트에서는 노멀맵을 활용해 입체감을 주지만, 픽셀 아트에서는 이질감을 줄 수 있습니다.
• Rim Light의 활용: 테두리에 광원이 나타나는 Rim Light는 픽셀 아트의 외곽을 강조하며 자연스럽고 화려한 조명 효과를 제공합니다.

 

2) Rim Light 전환 과정

1. 기존 Sprite Light 2D 복구: Normal Maps > Quality 설정을 Disable으로 되돌립니다.
2. Rim Light 객체 생성: 기존 객체를 Ctrl+D 로 복사 후 이름을 Rim Light로 변경하고, 기존 객체는 비활성화 처리합니다.
3. Rim Light 설정 변경:
   • Light Type: Spot으로 변경.
   • Radius > Outer: 기존 조명보다 더 크게 설정.
   • Intensity: 10 이상으로 높게 설정.
   • Normal Maps > Quality: Accurate로 설정.
   • Normal Maps > Distance: 1 이하로 설정.

아직 빛이 이상하게 표현된다.

 

3) Rim Light와 기존 조명 병합

1. Rim Light 객체 추가: Witch 객체에 Rim Light 추가로 테두리 조명이 뚜렷해짐.
2. 무너진 조명 복구는 Target Sorting Layer를 활용하면 됩니다.
   • Rim Light의 Target Sorting Layer는 Default만 설정.
   • 기존 Sprite Light 2D를 다시 활성화.
   • Rim Light를 Sprite Light 2D의 자식 객체로 등록.
3. 다른 Spot Light 2D에도 똑같이 적용.
   
   

 

4) Rim Light 활용 팁

• 동적인 대상 강조: Rim Light는 보통 동적인 대상에 부여하며, 이 객체들이 사용하는 정렬 레이어만 대상으로 삼습니다.
• 기존 Sprite Light 2D 활용: 배경과 전경 모두에 적용하거나 특정 분위기에 따라 배경만 대상으로 조정 가능.

 

5. 불필요한 배치를 줄여 최적화하기

1) 성능 확인: Frame Debugger 활용

• Frame Debugger를 통해 한 프레임의 Batch 수를 확인.
• Batch 수 증가 문제:
  • 초기 Batch 수: 16 → 그래픽 요소 추가 후: 93.
  • Shadow2D UnsafePass 단계에서 많은 연산이 이루어지고 있음.

Batch란?

• CPU가 GPU에 그래픽 명령을 전달하는 절차.
• Batch 수가 많을수록 CPU와 GPU 간 데이터 통신이 빈번해져 성능 저하 발생.
• 최적화를 위해 Batch 수를 줄이는 것이 중요.
• Batch 기본기에 대한 자세한 정보는 Unity Korea 유튜브 채널 참고.
  (https://youtu.be/w14yjBlfNeQ)

 

2) 문제 원인 분석

• 모든 Light 2D가 그림자를 생성 중.
• 조명이 겹치는 영역에 Shadow Caster 2D가 진입하면 연산량이 곱셈으로 증가.

 

3) 최적화 작업

1. Witch 객체: Shadow Caster 2D의 Target Sorting Layers를 Background로 제한.
2. Mineral 객체: Shadow Caster 2D의 Target Sorting Layers를 Background로 제한.
3. Rim Light 객체: Shadows 속성 비활성화.
4. Block 객체: Shadow Caster 2D 비활성화.

 

4) 최적화 효과

• Batch 수 감소: 최적화 후 Batch 수가 93 > 60로 줄어듦.
• 연산 부담 감소: CPU와 GPU 간 데이터 통신 최적화.

 

화려한 그래픽 효과는 성능 부담을 초래하므로 추가적인 요소 도입 시 항상 최적화 작업을 병행해야 해야 합니다.

---

원하지 않는 부분의 조명 처리하기

1. 새로운 문제점

1) 빛샘 현상

Witch 또는 Block 객체를 조명 근처로 이동시키면, 강력한 Rim Light로 인해 스프라이트 형체를 알아볼 수 없을 정도로 심한 빛샘 현상이 발생합니다.

 

2. 마스크 텍스쳐 소개 및 제작하기

1) 마스크 텍스쳐란?

• Sprite Editor의 Secondary Textures에서 확인할 수 있는 텍스쳐 유형으로, _MaskTex라는 이름의 항목입니다.
• Sprite Lit 기반 셰이더는 특정 영역에만 효과를 부여할 수 있도록 마스크 역할을 수행하는 텍스쳐를 요구합니다.
• 이 텍스쳐를 사용하면, 빛에 반응하는 영역과 반응하지 않는 영역을 세밀하게 제어할 수 있습니다.

 

2) 프로젝트 내 적용 예시

• 사용된 스프라이트:
  • Sprites > Ground > Ground1
  • 빛에 반응하는 영역을 붉은색으로, 빛에 반응하지 않는 영역을 검은색으로 표시.
    

    

3) 마스크 텍스쳐 제작 및 적용 방법

1. 제작 방법:
   • EmissionMap과 동일하게, 원본 스프라이트의 필요한 부분을 붉은색 계통으로 칠합니다.
   • 빛에 반응하지 않는 부분은 검은색으로 처리합니다.
2. 유니티에서 등록:
   • Sprite Editor에서 원본 스프라이트의 Secondary Textures를 열어 _MaskTex 항목에 텍스쳐를 추가합니다.
   • _MaskTex는 기본적으로 제공되는 항목으로, 손쉽게 추가 및 관리할 수 있습니다.

 

3. 마스크 적용하기 

1) Light 2D의 Blending 설정

Light 2D 컴포넌트의 Blending 카테고리에서 Blend Style 속성을 설정하여 조명과 스프라이트의 색상을 섞는 방식을 조정할 수 있습니다.
주요 옵션은 아래와 같습니다:

1. Multiply
   • 색상을 곱하는 연산 방식.
   • 예: 회색 * 회색 = 더 어두운 회색
   • 조명 강도(Intensity) 값에 따라 결과 색상이 밝아질 수 있습니다.
2. Additive
   • 색상을 더하는 연산 방식.
   • 예: 회색 + 회색 = 밝은 회색
3. with Mask (R)
   • 마스크 텍스쳐의 빨간색 채널(R)을 사용하는 옵션입니다.
   • 마스크 텍스쳐가 없는 경우: 모든 빛을 그대로 반영.
   • 마스크 텍스쳐가 있는 경우: 붉은색의 강도에 따라 빛이 필터링됩니다.

 

2) 설정 방법

모든 Rim Light의Blend Style을 Multiply with Mask (R)로 변경합니다.

 

3) 적용 결과

Witch는 빛샘 현상이 사라지며 표면에 자연스러운 빛 효과가 생기며 바닥은 입체감이 좀 더 강화됩니다.

 

4) 추가 최적화

• 마스크는 그림자 연산보다 가벼운 작업입니다.
• Shadow Caster 2D 대신 마스크 텍스쳐를 활용하여 그림자를 표현하면 성능 최적화를 확인할 수 있습니다.
• 특히 대규모 장면이나 픽셀아트 프로젝트에서는 마스크 기반 설정이 더 유리할 수 있습니다.

---

마무리

이번 튜토리얼을 통해 픽셀 아트 게임에서 조명을 활용하는 다양한 방법을 배웠습니다. 이 기술들은 간단한 조명 효과부터 고급스러운 분위기 연출까지 폭넓게 응용할 수 있습니다.

---

https://learn.unity.com/project/pixelartlight2d?utm_source=youtube&utm_medium=social&utm_campaign=kr_unitylearn_pixelartlight2D_cardnews

픽셀 아트를 위한 2D 라이팅 - Unity Learn