언리얼 - HLSL 커스텀노드_소벨 외곽선 추출



언리얼 - HLSL 커스텀노드_소벨 외곽선 추출

금별 0 16 15:20

 

 

 

 

 



이 영상은 화면 내 오브젝트들의 경계선을 찾아내어 카툰 렌더링이나 스케치 효과처럼 외곽선을 그리는 알고리즘을 테스트합니다.

 

핵심 원리: 소벨 연산자(Sobel Operator)를 이용한 픽셀 기울기(Gradient) 측정

특정 픽셀 주변의 색상이나 깊이(Depth) 값이 급격하게 변하는 지점을 수학적으로 찾아내어 경계선으로 인식하는 이미지 처리 기법입니다.

 

구현 과정:

이 효과는 씬 전체에 적용되어야 하므로 포스트 프로세싱 머티리얼에서 진행됩니다.

`Custom` 노드 내에 $3 \times 3$ 크기의 소벨 행렬(Sobel Matrix)을 코드로 정의합니다.

`for` 문을 사용하여 현재 픽셀을 기준으로 주변 8개의 픽셀(총 $3 \times 3$ 영역)을 순회합니다.

화면 해상도 값(`View.ViewSizeAndInvSize`)을 이용해 주변 픽셀들의 정확한 UV 오프셋(위치 차이)을 계산합니다.

주변 픽셀의 색상 값을 가져와 소벨 행렬의 가중치와 곱하고 더하여 색상의 '변화량(Gradient)'을 구합니다. 색상 차이가 클수록(경계선일수록) 값이 커집니다.

오류 수정 (디버깅):

영상 중반(09:03 부근)에 효과를 적용했을 때 화면에 세로줄만 나타나는 오류가 발생합니다. 크리에이터는 코드를 다시 확인하여 소벨 행렬의 값을 잘못 입력했음을 깨닫고 이를 즉각적으로 수정하는 과정을 그대로 보여줍니다.

최종 합성:

외곽선이 추출된 결과물은 검은 바탕에 흰색 선으로 나타납니다.

머티리얼 노드 창으로 돌아와 `Lerp`(선형 보간) 노드를 사용하여, 원본 렌더링 이미지(`SceneTexture: PostProcessInput0`) 위에 추출된 외곽선 데이터를 마스크로 활용하여 원하는 색상의 선을 덧입힙니다.

 

 

 

 

float2 sobelMatrix[9] = {
float2(-1,-1), float2(0,-2), float2(1,-1),
float2(-1,0), float2(0,0), float2(1,0),
float2(-1,1), float2(0,2), float2(1,1)
};

float2 gradients = 0;
for(int i=0;i<9;i++)
{
    int row = i/3;
    int col = i%3;
    float offsetX = (col-1)/res.x;
    float offsetY = (row-1)/res.y;
    float2 offsetUV = float2(uv.x+offsetX,uv.y+offsetY);
    float sampleIntensity = SceneTextureLookup(offsetUV, 14, false);
    gradients += sobelMatrix[i] * sampleIntensity;
}
gradients *= intensity;

return length(gradients);

 

 

 

 

return GetSceneTextureUV(Parameters);

 

 

 

 



 

 

 

 

에반 언리얼5 이펙트 그룹과정[26년초 시작] : https://cafe.naver.com/unrealfx/20727

KUPAFX Stylized 유니티 이펙트 취업과정 : https://cafe.naver.com/unrealfx/21249

트리키 언리얼+후디니 활용 게임 VFX 연출과정 : https://cafe.naver.com/unrealfx/25629

 

max님의 쌩기초 메쉬활용 이펙트과정 1달특강 : https://cafe.naver.com/unrealfx/24469

eVan텍스쳐 단품과정 : https://cafe.naver.com/unrealfx/24468

rak 유니티 UI연출이펙트 : https://gamefx.co.kr/bbs/page.php?hid=Rak_intro

Comments


번호 포토 분류 제목 글쓴이 날짜 조회
열람중 언리얼4 언리얼 - HLSL 커스텀노드_소벨 외곽선 추출 금별 15:20 17
793 언리얼4 언리얼 - HLSL 커스텀노드_픽셀화 효과 제작과정 금별 15:18 11
792 언리얼4 AOE Slam FX in Unreal Engine 5 Niagara ashif 04.01 48
791 언리얼4 Illugen 활용 절차적 지면 크랙 효과 텍스처 생성(한글자막) 금별 04.01 54
790 언리얼4 언리얼 - 파티클 원형 궤도(Circular Orbit) 위에서 자동 정렬방법(한글자막) 금별 04.01 49
789 언리얼4 언리얼 - 간단한 머트리얼 디졸브를 구현하는 세 가지 방법(한글자막) 금별 03.22 183
788 언리얼4 언리얼/후디니 -VAT 이펙트 툴체인 40분 설정: Niagara 워크플로우를 구축 방법(한글자막) 금별 03.22 146
787 언리얼4 언리얼5 - 기본 스트라이프 렌더러 재질 효과 작성 방법(한글자막) 금별 03.22 127
786 언리얼4 언리얼5 - 나이아가라는 입자를 나선형으로 움직이며 타깃에게 공격방법(한글자막) 금별 03.22 138
785 언리얼4 언리얼5 - 나이아가라 입자의 원형 운동을 수동으로 조작 방법(한글자막) 금별 03.22 95
784 언리얼4 언리얼5 - 나이아가라 입자를 특정 순서로 발사하여 적을 공격 방법(한글자막) 금별 03.22 113
783 언리얼4 언리얼5 - 나이아가라 원형으로 입자를 발사해서 타깃에게 움직이기(한글자막) 금별 03.22 97
782 언리얼4 언리얼5 - 나이아가라 입자를 원형으로 움직이게 하는 방법(한글자막) 금별 03.22 122
781 언리얼4 Sci-Fi Hex Shield FX in Unreal Engine 5 Niagara ashif 03.22 110
780 언리얼4 Rock Spike Eruption FX in UE5 Niagara ashif 03.16 143
779 언리얼4 언리얼 - 흑백 플래시 포스트 프로세스 연출 제작팁 금별 02.11 416
778 언리얼4 Unreal Engine 5 Tutorial: Create a Cursed Mist VFX ashif 02.10 281
777 언리얼4 언리얼 - 나이아가라 Advanced Guide – 위치 기반 동역학 금별 01.09 611
776 언리얼4 Niagara로 생성된 Static Mesh에서 파티클 스폰하기 금별 01.09 588
775 언리얼4 언리얼 - 나이아가라로 스플라인을 따라 발사되는 파티클 제작 금별 01.09 464
774 언리얼4 언리얼5 - 어검술의 완성 : 검진(Sword Array) 심화 기동 및 고급 제어(한글자막) 금별 01.09 469
773 언리얼4 언리얼5 - 벡터 연산을 활용한 검진(Sword Array) 지정 방향 발사 로직(한글자막) 금별 01.09 403

 

Banner
 
Facebook Twitter GooglePlus KakaoStory NaverBand