[Unreal Engine] 물체의 테두리(Outline) 그리기 ②

물체의 테두리(Outline) 그리기 ② - 테두리 추출하기

<이전글: 물체의 테두리(Outline) 그리기 ① - 접근 방법

[Unreal Engine] 물체의 테두리(Outline) 그리기 ①

이전 글에 이어서 이번에는 물체의 테두리 출력하는 과정을 직접 구현해본다.

1단계. Custom Depth Buffer 출력하기

먼저 물체의 테두리를 그리기 위해서 Custom Depth Buffer를 먼저 출력해보자.

• post process material (PP_Highlight)생성
  • material 생성후 material의  이름설정(여기서는 PP_Highlight로 사용)
  • PP_Highlight material을 열어서 material domain 값을 post process로 변경

  

  

   
• post process volume 생성 및 설정
  • 레벨에 post process volume을 추가 (Place Actors > Volumes > Post process volume 을 레벨 편집기로 드래그)
  • infinite extent 속성 설정: post process volume에서만 post process material을 확인할 수 있는데, infinite extent 설정을 했기 때문에 전체 레벨에서 확인 가능하다.
  • post process materials 적용: rendering features의 post process materials 배열에 원소를 추가하고 (PP_Highlight)를 적용. 전체 레벨에 PP_Hightlight가 적용된 모습을 확인할 수 있다.

  

 

• Render custom buffer에 아웃라인을 적용할 오브젝트를 등록
  • 대상 Mesh에서 Custom Depth Pass를 true로 설정
• PP_Highlight에서 Custom Depth 설정
  • SceneTexture를 CustomDepth로 설정
  • CustomDepth에서 R값이 깊이 값이기 때문에 R값만 mask 함.
  • 출력 값이 꾀 크기 때문에 전체가 흰색으로 출력됨. 10000을 나눠주면 깊이 차이를 확인할 수 있음. Custom Depth Pass에 등록된 물체가 깊이에 따라 가까울수록(값이 낮을수록) 검은색을 보인다.

출력 결과

CustomDepth에 등록된 Weapon만 검은색으로 화면에 나타난다.

2단계. 주변 픽셀 깊이의 합 구하기.

1. 현재 픽셀의 주변(상, 하, 좌, 우, 좌상단, 좌하단, 우상단, 우하단) 8개 픽셀을 다음과 같이 계산한다. 
   • 현재 픽셀의 Right, Left, Top, Bottom 픽셀 좌표를 다음과 같이 계산한다.

     

   • 현재 픽셀의 Top Right, Top Left, Bottom Right, Bottom Left 픽셀 좌표를 다음과 같이 계산한다.

     

2. 계산된 픽셀 위치에서의 Custom Depth 중 깊에 해당하는 R값을 마스킹한 후 모두 더한다.
   • 좌우상하 픽셀의 Custom Depth 값의 R값을 마스킹한 후 모두 더 한다.

     

   • 나머지 Top Right, Top Left, Bottom Right, Bottom Left 픽셀의 Custom Depth값 까지 R값을 마스킹한 후 모두 더해서 주변 픽셀의 깊이 값의 합(Sum of th custom depth values of all surrounding texels)를 구한다.

     

3단계. Outline 추출하기

1. 주변 픽셀의 깊이 값의 합에 큰 수 (10,000,000)을 뺀 후 정규화한다.
   • mesh의 외부 픽셀과 mesh의 가장자리 픽셀에서 주변 픽셀 깊이의 합은 굉장히 큰 수가 된다.(아래의 보라색) 하지만 완전 내부 픽셀에서 주변 픽셀의 깊이 값의 합은 작은 수 이다(아래의 빨간색).

     

   • 주변 픽셀의 깊이 값의 합에 10,000,000과 같이 큰 값을 빼게 되면 mesh 내부의 픽셀은 음수가 되고, mesh 외부 픽셀과, mesh 경계에 있는 픽셀은 여전히 양수를 유지하게 된다. 이 값을 아래와 같이 정규화한다.

     

   • 정규화 결과 mesh 내부 픽셀은 0이 되고, mesh외부와 mesh의 경계선의 픽셀은 1이 된다.

     

   • 출력 결과 mesh의 내부 픽셀만 검은색으로 출력됨을 확인할 수 있다.

     

2. Outline만 추출하기
   • CustomDepth에서 mesh 외부 값은 0 내부 값은 1이 되도록 다음과 같이 정규화한다.

     

   • 정규화된 값은 다음과 같이 계산된다.

     

   • 계산된 두 값을 곱하면 아래와 같이 테두리만 1이고 mesh의 내부와 외부는 0인 결과를 얻을 수 있다.

     

 

출력 결과

 

이제 Custom Depth Buffer를 활용하여 물체의 아웃라인을 출력할 수 있게 되었다. 하지만 우리가 원하는 것은 검은 화면에 아웃라인만 출력하는 것이 아니라 게임 장면에 물체의 아웃라인을 다양한 색상과 두께로 출력하는 것이다. 이 부분은 다음 글에서 계속 다룬다.

다음글: 물체의 테두리(Outline) 그리기 ③ - 장면에 테두리 그리기 >

---