Unity/정보

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

달시_Dalsi 2025. 1. 5. 00:10
728x90

튜토리얼용 샘플 프로젝트 소개

1. 샘플 프로젝트 다운로드

유니티에서 샘플 프로젝트를 제공하고 있습니다. 아래의 Git으로 샘플 프로젝트를 다운로드하여 유니티 허브로 열어줍시다.

https://github.com/Goldmetal/Unity.PixelArtLight2D

 

GitHub - Goldmetal/Unity.PixelArtLight2D: Unity 2D Basic Lighting Example

Unity 2D Basic Lighting Example. Contribute to Goldmetal/Unity.PixelArtLight2D development by creating an account on GitHub.

github.com

 

 

2. 샘플 프로젝트 구성

우선 Scenes 폴더의 Basic 씬을 열어봅시다. 
 
 
Basic씬은 아직 아무런 라이팅이 적용되있지않아서 현재씬에서 튜토리얼을 진행하면 된다.
Basic 씬
 

 

최종 완성된 씬은 Complete씬을 열어보면 알 수 있다.

Complete 씬
 
확장할 이미지 선택
이 샘플 프로젝트 다음과 같은 것들을 포함하고 있습니다.
  • 픽셀 아트 스타일 타일맵 스프라이트
  • 타일맵 스프라이트를 사용한 타일 팔레트와 타일
  • 픽셀 아트 스타일 캐릭터 및 사물 스프라이트
  • 캐릭터 및 사물의 마스크 텍스쳐 및 노멀맵, 이미션맵 스프라이트
  • 캐릭터를 위한 셀 애니메이션
  • 이미션을 위한 스프라이트 Lit 셰이더 그래프
  • 이미션이 적용된 머티리얼
  • 플랫포머 조작 및 간단한 제어를 위한 비주얼 스크립팅 그래프
  • 위의 모든 것을 종합하여 제작된 라이팅 비적용 Basic과 라이팅이 완성된 Complete 장면

 

3. 픽셀아트 사전 설정

픽셀 아트는 해상도가 작은 이미지가 특징이므로, 유니티의 기본 설정만으로는 픽셀 아트 고유의 느낌을 제대로 표현하기 어렵습니다. 픽셀 아트를 활용할 때는 다음의 스프라이트 설정 3가지를 필히 조정해야 합니다. 샘플 프로젝트의 모든 스프라이트는 픽셀 아트에 맞도록 설정되어있습니다.

 

  1. Pixel Per Unit
    • 개념: 유니티 씬의 1 단위 크기(Transform에서의 1 값)에 들어가는 픽셀 개수.
    • 설정 방법: 프로젝트에 따라 픽셀 크기를 지정 (예: 1칸에 16픽셀 → Pixel Per Unit = 16).
    • 효과: 값이 작을수록 픽셀이 커져, 스프라이트가 더 크게 보이는 효과를 얻습니다.
  2. Filter Mode
    • 개념: 카메라와의 거리 변화에 따른 텍스처 처리 방식.
    • 설정 방법: Point (no filter)로 변경.
    • 효과: 픽셀이 번지지 않고 선명하게 보이도록 함. 기본 값인 Bilinear는 픽셀 아트에 적합하지 않음.
  3. Compression
    • 개념: 텍스처의 색상 데이터를 압축하여 파일 크기를 줄이는 속성.
    • 설정 방법: None으로 변경.
    • 효과: 색상이 손상되지 않아 픽셀 아트의 본래 색감을 유지.

 

4. 비주얼 스크립트 로직 소개

유니티는 기본적으로 C# 기반의 MonoBehaviour 스크립트로 게임 로직을 작성하지만, 프로그래밍 언어에 익숙하지 않은 사용자들을 위해 비주얼 스크립팅 기능을 제공합니다. 이를 통해 코드 없이도 게임 로직을 개발할 수 있습니다.

Witch 캐릭터 움직임의 비주얼 스크립트 로직

  1. 비주얼 스크립팅이란?
    • 코드 작성 없이 시각적 도구로 게임 로직을 개발할 수 있는 기능.
    • 유니티 내부에서 Script Machine Variables 컴포넌트를 활용하여 작동.
    • Unity Learn에서 제공하는 튜토리얼을 통해 학습 가능.
      (https://learn.unity.com/project/bijueol-seukeuribting-sogae)
  2. 플레이어 객체와 비주얼 스크립트
    • 예제: 플레이어 역할인 Witch 객체 Script Machine Variables 컴포넌트를 가짐.
    • Script Graph 에셋을 사용해 게임 로직 구현.
  3. Script Graph 구성
    • Script Graph 창에서는 여러 개의 작은 그래프가 나열되어 있음.
    •  노드는 특정 로직을 수행하며, 그룹화하여 제목을 붙여 이해를 돕는 방식 제공.
  4. 장점
    • 프로그래밍 지식이 없어도 간단한 게임 로직 작성 가능.
    • 시각적으로 직관적이라 빠르게 기능을 이해하고 구현 가능.

비주얼 스크립팅은 프로그래밍 경험이 없는 개발자에게 쓰이기 용이하며 간단한 로직부터 복잡한 동작까지 쉽게 구현할 수 있는 기능입니다.


지금부터 Basic씬에서 작업합니다. 

전역 조명 이해하기

1. Global Light 2D 살펴보기

Global Light 2D는 유니티 2D 라이팅의 기본 조명입니다.

 

1) 주요 속성

  • Light Type: 조명의 형태를 결정.
    - Freedom: 모양을 자유롭게 조절.
    - Sprite: 스프라이트 모양을 그대로 활용.
    - Spot: 원형 또는 원뿔 형태로 퍼짐.
    - Global: 씬 전체에 조명 반영.
  • Color: 조명 색상.
  • Intensity: 조명 밝기.

2) 분위기 조절

  • Color를 어두운 색으로, Intensity를 1 이하로 설정하면 어두운 장면을 연출할 수 있습니다.

 

Global Light 2D는 장면의 모든 2D Renderer 요소(Sprite, Tile, SpriteShape)에 영향을 줍니다. 장면 전체의 분위기를 설정하는 데 핵심 역할을 합니다.

 

 

2. Light Pass 생략하기

1) Global Light 2D와 Light Pass

Global Light 2D가 포함된 프로젝트에서는 Light2D Pass라는 추가적인 장면 렌더링 과정이 작동합니다. 이 단계는 CPU와 GPU에 부하를 줄 수 있으므로, 사용하지 않는 경우 제거하는 것이 최적화에 좋습니다.

 

2) Render Graph Viewer로 확인

  • Render Graph Viewer(Windows > Analysis > Render Graph Viewer)를 통해 그래픽 렌더링의 단계를 시각적으로 확인할 수 있습니다.
  • Global Light 2D 객체를 삭제하면 Light2D Pass 단계가 제거되며, 렌더링 시간이 단축됩니다.

기존 렌더러 그래프
Global Light 2D 제거 후 Light2D Pass단계가 사라짐(상단 목록)

 

3) 최적화 팁

  • Global Light 2D 기본 설정(Color: White, Intensity: 1)에서는 제거해도 시각적인 변화가 없습니다.
  • 프로젝트의 렌더링 효율을 높이기 위해 사용하지 않는 Global Light 2D는 제거하는 것이 좋습니다.

샘플 프로젝트에서는 던전의 어두운 분위기를 표현하기 위해 Global Light 2D의 Color와 Intensity를 어두운 상태로 설정 한 뒤 작업을 계속 이어갑니다.

 

 

3. 2D 그래픽 정렬

1) 2D 그래픽의 정렬 방식

유니티의 2D 프로젝트에서 스프라이트가 가려지거나 표시되는 순서는 3가지 속성에 의해 결정됩니다.

  • Transform-Z: Z축 값이 작을수록 카메라에 가까워지고, 더 나중에 그려집니다.
  • Sorting Layer: 정렬 우선순위를 결정하는 레이어. 우선순위가 높을수록 나중에 그려집니다.
  • Order in Layer: 동일한 Sorting Layer 안에서 숫자가 높을수록 나중에 그려집니다.

2) Witch와 Mineral의 정렬 문제

Witch(플레이어)와 Mineral(광물) 객체를 겹치면, SpriteRenderer의 정렬 순서가 동일하기 때문에 가려질 수 있습니다. 이를 해결하려면:

  • Order in Layer 값을 Witch 객체에 더 높게 설정합니다.
  • Sorting Layer 설정값을 변경합니다. Mineral과 Ground의 Back (Tiled)객체를 Background 레이어로 설정합니다.

Back (Tiled)
Mineral

 

 

 

3) Sorting Layer의 설정 방법

  1. Background 레이어 설정
    • Mineral과 Ground > Back(Tiled)의 Sorting Layer를 Background로 변경합니다.
    • Background 레이어는 Default 레이어보다 우선적으로 그려지기 때문에 정렬이 올바르게 작동합니다.
  2. Sorting Layers 편집
    • Edit > Project Settings > Tags and Layers 메뉴에서 Sorting Layers 리스트를 확인합니다.
    • 레이어의 순서를 드래그로 조정하거나, + 버튼으로 새로운 레이어를 추가할 수 있습니다.

 

4) 참고 사항

  • Sorting Layers 추가 후 프로젝트를 Save후 재실행해야합니다.
  • Sorting Layers 활용: 전경 및 후경을 나누어 세밀한 장면을 제작할 때 매우 유용합니다.

 

 

4. 정렬 레이어를 통한 부분 라이팅

1) Target Sorting Layer 소개

Target Sorting Layer는 2D 라이팅에서 특정 Sorting Layer를 대상으로 빛을 조절할 수 있는 속성입니다.

  • 기본 값: Everything (장면의 모든 2D Renderer에 영향을 미침).
  • 설정 가능: 특정 Sorting Layer만 선택하여 부분적으로 라이팅 효과를 적용.

 

2) Target Sorting Layer 활용

  1 Nothing 설정

  • Target Sorting Layer를 Nothing으로 변경하면 장면 전체가 검게 변합니다.
  • 이는 빛이 완전히 제거된 상태를 시뮬레이션합니다.

아무런 빛이 없어 보이지 않느다.

 

  2 background 설정

  • Target Sorting Layer를 background로 설정하면, background 레이어에 있는 객체만 조명이 반영됩니다.
  • 이 방식을 통해 특정 객체만 강조하거나 제한된 영역에 빛을 비출 수 있습니다.

background 객체인 배경과 Mineral객체만 보인다.

 

 

3) 세밀한 장면 연출

  • 별도의 Global Light 2D를 하나 더 추가하고, Target Sorting Layer를 Default로 설정합니다.
  • 결과적으로 Default와 Background에 각각 다른 조명 효과를 적용하여, 더욱 세밀한 명암을 가진 장면을 연출할 수 있습니다.

 

4) 주의 사항

  • 여러 Global Light 2D가 동일한 Target Sorting Layer를 가지면 에러가 발생합니다.
  • 항상 각 Global Light 2D의 Target Sorting Layer를 개별로 설정하세요.

픽셀 조명 제작하기

1. Spot Light 2D 배치하기

  1. Hierarchy 창에서 + 버튼을 클릭.
  2. Light > Spot Light 2D를 선택하여 조명 추가.
  3. Color Intensity를 조정하여 원하는 색상과 밝기로 설정.
  4. Radius 값을 조정해 조명 범위를 자유 조절.

 

2. Spot Light 2D 조정 및 배치

  • Scene에서 직관적인 조명 편집 가능:
    • 노란색 커서와 삼각형의 위치를 조정하여 특정 영역만 밝히는 스포트라이트 형태 제작.

 

3. 조명 경계 선명도 설정

  • Inner / Outer Spot Angle:
    • 두 값의 차이가 작을수록 빛의 범위가 좁아지고 집중도가 높아짐.
  • Falloff Strength:
    • 값이 낮을수록 조명 경계가 선명하게 나타남.


 

2. 픽셀 라이트 제작 첫번째 : Pixel Perfect Camera 활용하기

1. Pixel Perfect Camera란?

픽셀 아트 스타일의 게임에서는 픽셀 크기가 화면에 따라 일정하지 않을 수 있습니다. 이를 해결하기 위해 Pixel Perfect Camera 컴포넌트를 활용하여 화면의 모든 픽셀이 고르게 표시되도록 설정합니다.

 

2. Pixel Perfect Camera 추가 및 설정

  1. Main Camera를 선택하고 Add Component를 클릭하여 Pixel Perfect Camera 컴포넌트를 추가.
  2. Pixels Per Unit:
    • 픽셀 아트 에셋의 Pixel Per Unit 값과 동일하게 설정.
  3. Reference Resolution:
    • 적절한 화면 크기를 지정하여 원하는 해상도로 조정.
  4. 해상도 에러 해결:
    • Game 창의 해상도가 짝수인지 확인하고, 필요 시 창 크기를 여러 설정으로 조절해 에러 메시지 제거.

현재 프로젝트에 쓰이는 스프라이트들의 Pixels Per Unit값과 Pixel Perfect Camera의 Assets Pixels Per Unit값이 동일해야합니다.

 

3. Grid Snapping으로 픽셀화

  • Grid Snapping 활성화: Upscale Render Texture 설정을 통해 화면 픽셀을 일정한 위치에 고정.
  • 효과: Spot Light 2D의 경계 및 객체 이동/회전 모두 픽셀화되어 레트로 느낌 강화.

 

3. 픽셀 라이트 제작 두번째 : Sprite 에셋 활용하기

1) Sprite Light 2D 활용 개요

프로젝트에 자연스럽게 어울리는 적절한 라이팅 효과를 만들기 위해 미리 제작된 스프라이트 에셋을 사용하는 방식입니다.

  • 샘플 프로젝트 Sprites > Props 폴더에 Sprite Light 2D에 사용될 SpotLight 스프라이트가 포함되어 있습니다.

2) Sprite Light 2D 추가 및 설정

  1. Sprite Light 2D 추가
    • Hierachy 창 > + 버튼 > Light > Sprite Light 2D 선택.
  2. Sprite 변경
    • Sprite 속성 SpotLight 스프라이트로 설정.
    • 객체를 Mineral과 겹치도록 배치.
    • 색상은 Mineral의 분위기에 맞춰 푸른색으로 변경.

 

 

3) Sprite Light 2D의 한계와 장점

  • 장점: 개발자가 원하는 모양의 픽셀 아트 스타일의 조명 효과를 쉽게 얻을 수 있음.
  • 한계: 자유로운 형태로 변형이 어렵기 때문에 다양한 조명 모양이 필요하다면 추가적인 스프라이트 제작이 필요.

4) 비주얼 스크립트로 조명 효과 강화

Sprite Light에 주기적 크기변경효과를 추가하여 생동감을 부여

  1. Visual Script 추가
    • Sprite Light 객체 선택 > Add Component > Visual Scripting > Script Machine.
  2. 그래프 연결
    • Graph 속성 Scale Wave 그래프를 연결.
  3. 변수 설정
    • Variables 컴포넌트에서 Speed라는 이름의 Float 타입 변수를 추가하고 적절한 값을 설정.
      (비주얼 스크립트에 정해진 변수이름 Speed로 설정)

 

5) 플레이 모드에서 테스트

  • 설정을 마친 후 플레이 모드로 전환하면 부드럽게 스케일링되는 조명 효과를 확인할 수 있습니다.

그림자 표현하기

1. Shadow Caster 2D 소개

1) Shadow Caster 2D의 개요

2D 공간에서 사실적인 그림자를 표현하기 위해 Shadow Caster 2D 컴포넌트를 사용합니다.

Witch Block 객체는 이미 이 컴포넌트를 가지고 있으며, 인스펙터에서 설정을 확인할 수 있습니다.

 

2) 그림자 영역 생성 방식 (Casting Source)

그림자 영역은 Casting Source 속성을 통해 다음과 같은 방식으로 설정할 수 있습니다:

  1. Sprite Renderer:
    • 스프라이트 에셋의 Custom Outline을 기반으로 그림자 영역 생성.
  2. Collider 2D:
    • 객체에 설정된 Collider 2D 모양을 따라 그림자 생성.
  3. Shape Editor:
    • Scene에서 직접 모양을 편집하여 영역 생성.
  4. None:
    • 그림자 생성 비활성화.

세밀한 그림자 모양이 필요하다면 Sprite Renderer Shape Editor를 사용.

물리적 형태를 따라가려면 Collider 2D를 선택.

 

3) 그림자 옵션 (Casting Option)

그림자 생성 방식을 결정하는 Casting Option:

  1. Self Shadow:
    • 그림자 영역 및 스프라이트 내부에 그림자 생성.
  2. Cast Shadow:
    • 조명 방향에 따라 방사형 그림자 생성.
  3. Cast and Self Shadow:
    • 두 가지 방식을 혼합.
  • 사용 사례:
    • Cast Shadow: 움직이는 객체나 일반적인 그림자 표현에 적합.
    • Self Shadow: 빛이 차단되는 벽이나 사물에 사용.

 

4) 정렬 레이어와 그림자

Shadow Caster 2D는 Light 2D와 마찬가지로 대상 정렬 레이어(Target Sorting Layer)를 설정하여 특정 영역에만 그림자를 생성할 수 있습니다.

 

2. 2D 그림자 제작하기 : Sprite Renderer 방식

1) 그림자 추가하기

아직 Shadow Caster 2D가 없는 Mineral 객체에 그림자를 추가하려면 Add Component > Rendering > 2D > Shadow Caster 2D를 선택하여 컴포넌트를 추가합니다.

 

2) 기본 타입 확인

  • Sprite Renderer가 기본 타입으로 설정됩니다.
  • 하지만 Mineral 객체의 그림자 영역이 직사각형으로 보이는 이유는 스프라이트에 Custom Outline이 설정되어 있지 않기 때문입니다.

직사각형의 굵은 흰색선



3) Custom Outline 지정하기

  1. Mineral 스프라이트 선택
    • Inspector 창에서 Open Sprite Editor 버튼을 눌러 Sprite Editor 창을 엽니다.
  2. Custom Outline 변경
    • Sprite Editor 드롭박스에서 Custom Outline을 선택합니다.
  3. Outline 생성 및 편집
    • Outline Tool에서 Generate 버튼을 눌러 기본 Outline을 생성합니다.
    • 생성된 Outline은 자동으로 스프라이트를 따르지만, 픽셀 아트는 해상도가 낮아 세밀함이 부족할 수 있습니다.
    • 직접 마우스로 정점을 이동하거나 선 가운데를 클릭하여 정점을 추가해 스프라이트와 일치하도록 편집합니다.
  4. 적용
    • 편집이 완료되었다면 Apply 버튼을 눌러 저장합니다.



4) 결과 확인

  • Scene에서 Shadow Caster 2D의 모습이 Custom Outline과 동일하게 변경된 것을 확인할 수 있습니다.

 

3. 2D 그림자 제작하기 : Collider 2D 방식

1) Collider 2D를 활용한 그림자 제작

  • Mineral 객체는 캐릭터가 올라설수 있는 플랫폼 역할을 하며, 이를 위해 이미 Box Collider 2D를 가지고 있습니다.
  •  Box Collider 2D를 이용해 그림자 영역을 생성합니다.


2) Casting Source 변경

  1. Mineral 객체의 Shadow Caster 2D 컴포넌트 Casting Source Box Collider 2D로 설정합니다.


3) 결과 확인 및 조정

  • Box Collider 2D는 얇은 직사각형 형태로 되어 있으며, 그림자 영역이 거의 직선의 모습으로 생성됩니다.
  • 이는 Trim Edge 속성 값 때문입니다.
    • 기본 값: 0.09
    • 0에 가까운 값: Casting Source(Collider)의 모양과 더 비슷한 그림자를 만듭니다.
    • Offset처럼 동작하므로 개발중인 프로젝트에 맞게 값을 조정하십시오.


4. Light Render Scale 조절하기

1. Light Render Scale 기본 설정 확인

  • Universal 2D 프로젝트의 기본 설정에서 Renderer2D 에셋 Light Render Scale 값이 0.5로 되어 있습니다.
  • 이 설정으로 픽셀 아트 스타일의 2D 라이팅 작업을 진행하면 다음과 같은 문제가 발생할 수 있습니다.

 

2. 문제점 확인

  1. 빛 경계가 번져 보이는 현상
    • 모든 Light 2D의 경계가 부드럽지 않고 흐릿하게 표현됩니다.
  2. 그림자와 실제 영역 간 틈새 발생
    • 그림자가 객체 모양과 정확히 일치하지 않고, 어긋나는 모습이 나타납니다.
  3. 원인 분석
    • Light Render Scale 값이 0.5일 때, 내부적으로 생성되는 텍스처 크기가 화면 크기의 절반입니다.
    • 작은 텍스처를 늘려서 사용하면서 발생하는 품질 저하와 불일치 문제입니다.
    • 이를 Frame Debugger를 통해 확인할 수 있습니다.
      • Game 창의 버그 아이콘 버튼 클릭 또는 Window > Analysis > Frame Debugger 실행.

Light Render Scale = 0.5, 경계선이 흐릿해보인다.

 

3. Light Render Scale 값 변경 후 결과

  • Render Scale 값을 1로 설정하면 다음과 같은 변화를 볼 수 있습니다.
    1. 텍스처 크기가 원래 화면 크기와 동일하게 증가합니다.
    2. 더 정교한 Light 2D 그래픽을 얻을 수 있습니다.
    3. 그림자 영역과 실제 객체의 일치도가 개선됩니다.
  • 성능 고려
    • 픽셀 아트 스타일에서는 참조 화면 해상도가 작기 때문에 메모리 사용량 증가가 성능에 크게 영향을 미치지 않습니다.

Light Render Scale = 1, 경계선이 흐릿해보인다.

 

픽셀 아트 라이팅을 사용하는 경우, Light Render Scale을 1로 설정하는 것이 품질 향상에 중요합니다.

Renderer2D 에셋에서 해당 값을 꼭 확인하고 필요한 경우 설정하세요.


스스로 빛을 내는 스프라이트 제작하기 (Emission)

1. Emission 셰이더 준비하기

1) Emission 셰이더 개요

  • 지금까지 Light 2D Shadow Caster 2D로 2D 씬을 제작했지만,
    스스로 빛을 내는 그래픽(Emission)을 추가하여 더욱 사실적인 환경을 구현할 수 있습니다.
  • 기본 셰이더:
    • Universal 2D의 기본 셰이더는 Sprite-Lit-Default입니다.
    • 기본적으로 Light 2D와 다양한 그래픽 기능을 지원하지만, Emission 기능은 포함되어 있지 않습니다.

 

2) Emission 셰이더 제작 방법

  • Shader Graph 도구를 사용하면 보다 쉽게 Emission 셰이더를 제작할 수 있습니다.
    • Shader Graph Unity Package Manager에서 설치 가능합니다.
    • Universal RP 템플릿에서는 기본적으로 설치되어 있습니다.
  • 프로젝트 에셋 창에서 Shader Graph > URP > Sprite Lit Shader Graph를 선택하여 그래프 에셋을 생성할 수 있습니다.
  • 다만, 이 튜토리얼에서는 픽셀 아트 라이팅에 초점을 맞추고 있기 때문에 셰이더 작성 단계는 생략하고,
    미리 작성된 Emission 셰이더를 활용합니다.

 

3) Emission 셰이더 그래프 구조

  • Shaders 폴더에서 Sprite-Lit-Emission 셰이더 그래프 에셋을 확인하세요.
    • 더블클릭하여 셰이더 그래프 창을 열면 내부 구조를 확인할 수 있습니다.
  • Emission 셰이더 그래프 구성 요소:
    1. Main: 기본 텍스처 정보.
    2. Mask: 투명도나 영역을 제한하는 텍스처 정보.
    3. Normal: 표면의 질감을 나타내는 텍스처 정보.
    4. Emission: 빛을 내는 부분과 색상을 결정하는 주요 정보.

 

4) Emission 셰이더 주요 속성

  1. EmissionMap
    • 빛을 내는 부분을 지정하는 텍스처입니다.
    • 이 텍스처에서 밝은 부분은 빛을 내며, 어두운 부분은 빛을 내지 않습니다.
  2. EmissionColor
    • 빛의 색상과 밝기를 설정합니다.
    • RGB 값으로 색상을, Intensity 값으로 밝기를 조절할 수 있습니다.

 

2. Emission 적용하기

1) 머티리얼 생성 및 적용

Emission 셰이더를 2D Renderer에 적용하려면 머티리얼이 필요합니다. 이번 프로젝트에서는 이미 준비된 머티리얼을 사용합니다.

  1. 머티리얼 확인 및 적용 방법:
    • 에셋 폴더 > Materials 폴더에서 다음 머티리얼을 확인합니다.
      • Mineral-Glow: Mineral 객체의 발광을 담당.
      • Witch-Glow: Witch 객체의 발광을 담당.
    • 적용 방법: 해당 머티리얼을 원하는 객체에 드래그 앤 드롭하여 빠르게 적용합니다.
  2. 적용 결과:
    • Mineral 객체: 수정 외곽 부분이 발광.
    • Witch 객체: 마법 지팡이의 수정구가 발광.



2) 머티리얼 속성 분석

머티리얼의 주요 특징은 아래와 같습니다.

  1. 텍스처 속성:
    • Main, Mask, Normal, Emission 속성 모두 비어 있음.
  2. EmissionColor 속성:
    • HDR 색상 타입으로 설정되어 있으며, RGBA와 Intensity(밝기)가 포함됨.
    • Intensity는 수동 입력 또는 +1, +2 버튼으로 조절 가능.
    • 값을 높일수록 더 밝은 발광 효과를 얻을 수 있음.

 

3) EmissionMap의 역할

EmissionColor는 머티리얼 전역에 영향을 줄 수 있지만, 특정 부분만 발광하도록 설정된 이유는 EmissionMap 덕분입니다.

  • EmissionMap: 발광 영역을 지정하는 텍스처.
  • 텍스처의 밝은 영역은 발광, 어두운 영역은 비발광.

다음 내용인 Secondary Texture에서 이어서 설명합니다.

 

3. Secondary Texture 소개

유니티는 스프라이트에 추가 정보를 결합할 수 있도록 Secondary Texture 기능을 제공합니다. 이 기능은 위에서 언급한 EmissionMap역할을 수행합니다. 스프라이트의 원하는 부분만 발광 기능을 넣을 수 있습니다.


1) Secondary Texture의 역할

  • Secondary Texture는 스프라이트와 연결된 부가적인 텍스처 정보를 포함합니다.
  • EmissionMap Secondary Texture의 한 종류로, 특정 스프라이트 영역이 발광하도록 설정됩니다.

 

2) EmissionMap 설정 방법

  1. Sprite Editor에서 Secondary Texture 확인:
    • Mineral 스프라이트를 선택하고 Open Sprite Editor를 클릭합니다.
    • Sprite Editor 창 좌측 상단 드롭박스에서 Secondary Texture를 선택합니다.
  2. Secondary Texture 연결:
    • 이미 설정된 _EmissionMap 속성에서 Mineral_Emission 스프라이트가 추가된 것을 확인할 수 있습니다.
    • Name 속성은 2D Renderer에서 사용하는 셰이더의 Reference 이름과 반드시 일치해야 합니다.



3) Secondary Texture 자동 활용

  • 머티리얼에서 별도의 텍스처를 설정하지 않아도 2D Renderer가 Secondary Texture에 등록된 정보를 자동으로 사용합니다.

 

4) 스프라이트 아틀라스와의 연계

Secondary Texture는 스프라이트 아틀라스와도 통합 가능하며, 특히 셀 애니메이션에 효과적입니다.

  1. Witch 객체 예시:
    • Witch 객체는 EmissionMap, NormalMap, MaskTex 아틀라스를 함께 사용하여 더욱 세밀하고 역동적인 그래픽 효과를 구현합니다.
  2. 스프라이트 아틀라스 제작 팁:
    • 각 스프라이트의 위치 및 크기가 정확히 일치하도록 리소스를 제작해야 합니다.
    • 동일한 Slice 설정을 유지해 Secondary Texture 적용 시 오류를 방지합니다.

4. Emission 텍스쳐 제작 방법

1) Emission 텍스처의 기본 원칙

  • 빛나는 부분: 흰색으로 칠합니다.
  • 빛나지 않는 부분: 검은색으로 칠합니다.
  • 세밀한 빛 조정: 회색 계열을 활용하여 빛의 세기를 조절할 수 있습니다.
  1.  

2) 작업 팁

  • 투명도 활용: 원본을 보면서 작업하면 Emission 영역을 정확하게 정의할 수 있습니다.
  • 다양한 톤 사용: 단일 흰색이 아닌 다양한 톤의 회색을 사용하면 더 자연스러운 빛 효과를 만들 수 있습니다.
  • 테스트 주기적 진행: 유니티에 적용하여 EmissionMap이 의도대로 작동하는지 확인합니다.
  • 도트 그림 강좌로 유니티 유튜버이신 골드메탈님의 강좌 추천합니다.

https://www.youtube.com/watch?v=LqCvp3xMyxE&list=PLO-mt5Iu5TeYm9-OnDEz0BCpzhGD1qVdo&index=2

 


다음 내용은 새로운 글에 게시하겠습니다.

  1. 포스트 프로세싱으로 효과 강조하기
  2. 입체감을 표현하는 효과 넣기
  3. 원하지 않는 부분의 조명 처리하기

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

 

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

유니티 엔진에서 픽셀 아트 스타일의 게임 콘텐츠를 제작하기 위해 2D 라이트를 생성하고 편집하는 방법을 예제 프로젝트와 함께 실습하는 튜토리얼입니다.

learn.unity.com

 

728x90