SlideShare a Scribd company logo
1 of 80
이펙트 쉐이더 2강
Alpha / Blending
오지후 / CatDarkGame
캐쥬얼이펙트 스터디
2019_12_14
https://darkcatgame.tistory.com/
Cat DarkGame
오늘 강의 목표
Alpha와 Blending의 원리 이해와 각종 이슈 해결
렌더링 파이프라인
Screen
Alpha Test
Blending
Render Backend
Z Test
Stencil Test
Fog
AA(Anti-Aliasing)
Filtering
출력 유무 결정 출력 방법 결정
렌더링 파이프라인
Screen
Alpha Test
Blending
Z Test
Stencil Test
Fog
AA(Anti-Aliasing)
Filtering
출력 유무 결정 출력 방법 결정
Render Backend
1. Alpha Test
2. Blending
3. 알파 블랜딩 이슈
Alpha Test
알파 값(데이터)를 확인(테스트)하여 출력 유무 결정
Alpha Test
Tag 구문
Clip 함수
Alpha Test
코드 분석
Alpha Test
Tags
“Queue” = “Transparent”
Alpha Test
렌더링 순서 정하는 명령어
Alpha Test
Background 1000
Geometry 2000
AlphaTest 2450
GeometryLast Geometry중 마지막
Transparent 3000
Overlay 4000
내부적으로 정해진 값을 사용함
Alpha Test
가변적으로 사용가능
Alpha Test
Tags
“IgnoreProjector” = “True”
Alpha Test
Projector를 무시(Ignore)하다.
Alpha Test
Projector란?
카메라와 같은 절두체(Frustum)에 투영 되는 오브젝트에 마테리얼을 출력시키는 컴포넌트
Alpha Test
http://www.aitimes.com/news/articleView.html?idxno=110732
Projector란?
빔프로젝터와 비슷한 개념
프로젝터가 조준한 곳에 내용물(Material)을 입힌다.
Alpha Test
https://koreagame.info/430https://docs.unity3d.com/kr/530/Manual/class-Projector.html
사용 사례
가짜그림자 & 페인트 기능의 사용 사례
Alpha Test
간단한 조명 효과처럼 보이는 Projector
Alpha Test
“IgnoreProjector” = “False”
Alpha Test
“IgnoreProjector” = “True”
Alpha Test
RenderType
Alpha Test
“RenderType” = “Opaque”
“RenderType” = “Transparent”
“RenderType” = “TransparentCutOut”
“RenderType” = “아무 이름이나 된다”
해당 쉐이더의 태그(구분)를 작성하는 것
이 Tag 명령어는?
Alpha Test
용도?
외부 프로그래밍 명령어로 RenderType 이름 기반으로 쉐이더 일괄 교체할 때 사용
다양한 용도 중에서,
Alpha Test
용도?
외부 프로그래밍 명령어로 RenderType 이름 기반으로 쉐이더 일괄 교체할 때 사용
3인칭 게임의 캐릭터 가리는 오브젝트 쉐이더 변경 사례
Alpha Test
코드 분석
Alpha Test
0보다 x가 작으면 출력 하지 않음
Alpha Test
Alpha Test
털, 나무, 풀, 머리카락 등에 사용됨
Alpha Test
이펙트에 사용 사례
Alpha Test
Blending
혼합, 융합, 조합
픽셀을 혼합(Blending)
Blending
투명도 : 뒤에 있는 픽셀과 혼합되는 양
Blending
ZWrite Off
Blend 옵션
Blending
ZWrite Off
Blend 옵션
Blending
다음 파트에서 설명
=
Blending
Additive Alpha Blending Multiply
Blending
분석해봅시다.
Blending
Dst
(Destination)
Src
(Source)
Blending
Blend : 혼합하다 SrcAlpha OneMinusSrcAlpha
1 - SrcAlpha
Blend SrcAlpha OneMinusSrcAlpha
Blending
Blend SrcAlpha OneMinusSrcAlpha
Blend SrcAlpha * Src + OneMinusSrcAlpha * Dst
* *+
SrcAlpha Src OneMinusSrcArpha Dst
Blending
Blend SrcAlpha OneMinusSrcAlpha
Blend SrcAlpha * Src + OneMinusSrcAlpha * Dst
* *+
+ =
SrcAlpha * Src 1-SrcAlpha * Dst 최종 결과
Blending
Blend SrcAlpha OneMinusSrcAlpha
Blend SrcAlpha * Src + OneMinusSrcAlpha * Dst
* *+
+ =
SrcAlpha * Src 1-SrcAlpha * Dst 최종 결과
Blend SrcAlpha OneMinusSrcAlpha
Alpha Blend
Blend One One
Blending
Blend One * Src + One * Dst
Blend One One
+ =
Blending
Blend One * Src + One * Dst
Blend One One
+ =
Blend One One
Additive
Blending
이펙트에 사용 사례
알파 블랜딩 이슈
현재 블랜딩 쉐이더에 문제가 있습니다.
무슨 문제일까요?
이 문제를 조사하기 전에
Z Buffer라는 것을 알아야합니다.
화면에 보이는 깊이 값
Z Buffer = 카메라로부터의 픽셀의 깊이 값
Z Buffer의 용도?
뒤에 가려진 픽셀을 그리지 않기 위해
만약 앞 물체가 반투명이면?
뒤 픽셀과 블랜딩되지 않음
반투명이 형성이 안됨
해결방법?
1. Alpha Sorting
2. ZWrite Off
3. Alpha Test
Alpha Sorting
기본적으로 반투명 오브젝트는 카메라로부터 멀리 떨어져 있는 순서 대로 출력
이 기법을 Alpha Sorting이라고 함
그런데 Mesh의 Pivot기준이라 위와 같은 문제가 발생
ZWrite Off
Z Buffer를 사용하지 않는다는 명령어
Z Buffer를 사용하지 않아 픽셀을 중복해서 출력
일단은 문제는 해결했지만
OverDraw라는 새로운 이슈 발생
(한 픽셀에 중복해서 출력하면 퍼포먼스 문제 발생)
Alpha Test
Alpha Test는 블랜딩이 아니라서 Z Buffer사용해도 문제 없음
알파가 0과 1로 되어 있어 퀄리티의 한계가 있음
텍스처 해상도가 높으면 어느 정도 커버 가능
털, 나무, 풀, 머리카락 등에 사용됨
알파 블랜딩 이슈 2
일반적인 반투명 쉐이더 깔끔한 반투명 쉐이더
문제 원인
ZWrite Off로 ZBuffer를 사용하지 않음으로 서 뒷면까지 렌더링한 것이 문제
Zwrite On 하면 해당 문제는 해결되지만,,,,,
Zwrite On 하면 해당 문제는 해결되지만,,,,,
1 Pass
ZWrite On
2 Pass
ZWrite Off
1 Pass에서 Zwrite On으로 카메라에 보이는 면을 렌더링,
이후 반투명 2Pass을 렌더링
해결 방법
끝

More Related Content

What's hot

[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기
[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기
[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기Madumpa Park
 
Ndc2010 전형규 마비노기2 캐릭터 렌더링 기술
Ndc2010 전형규   마비노기2 캐릭터 렌더링 기술Ndc2010 전형규   마비노기2 캐릭터 렌더링 기술
Ndc2010 전형규 마비노기2 캐릭터 렌더링 기술henjeon
 
스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)
스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)
스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)포프 김
 
Stable SSAO in Battlefield 3 with Selective Temporal Filtering
Stable SSAO in Battlefield 3 with Selective Temporal FilteringStable SSAO in Battlefield 3 with Selective Temporal Filtering
Stable SSAO in Battlefield 3 with Selective Temporal FilteringElectronic Arts / DICE
 
Secrets of CryENGINE 3 Graphics Technology
Secrets of CryENGINE 3 Graphics TechnologySecrets of CryENGINE 3 Graphics Technology
Secrets of CryENGINE 3 Graphics TechnologyTiago Sousa
 
A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...
A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...
A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...Electronic Arts / DICE
 
[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shading[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shadingMinGeun Park
 
[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기
[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기
[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기강 민우
 
언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링TonyCms
 
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법YEONG-CHEON YOU
 
노말 맵핑(Normal mapping)
노말 맵핑(Normal mapping)노말 맵핑(Normal mapping)
노말 맵핑(Normal mapping)QooJuice
 
리플렉션과 가비지 컬렉션
리플렉션과 가비지 컬렉션리플렉션과 가비지 컬렉션
리플렉션과 가비지 컬렉션QooJuice
 
Siggraph2016 - The Devil is in the Details: idTech 666
Siggraph2016 - The Devil is in the Details: idTech 666Siggraph2016 - The Devil is in the Details: idTech 666
Siggraph2016 - The Devil is in the Details: idTech 666Tiago Sousa
 
Unreal animation system
Unreal animation systemUnreal animation system
Unreal animation systemTonyCms
 
Low-level Shader Optimization for Next-Gen and DX11 by Emil Persson
Low-level Shader Optimization for Next-Gen and DX11 by Emil PerssonLow-level Shader Optimization for Next-Gen and DX11 by Emil Persson
Low-level Shader Optimization for Next-Gen and DX11 by Emil PerssonAMD Developer Central
 
GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리
GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리
GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리YEONG-CHEON YOU
 
UE4 Garbage Collection
UE4 Garbage CollectionUE4 Garbage Collection
UE4 Garbage CollectionQooJuice
 
Brdf기반 사전정의 스킨 셰이더
Brdf기반 사전정의 스킨 셰이더Brdf기반 사전정의 스킨 셰이더
Brdf기반 사전정의 스킨 셰이더동석 김
 

What's hot (20)

[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기
[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기
[NDC19] 모바일에서 사용가능한 유니티 커스텀 섭스턴스 PBR 셰이더 만들기
 
Ndc2010 전형규 마비노기2 캐릭터 렌더링 기술
Ndc2010 전형규   마비노기2 캐릭터 렌더링 기술Ndc2010 전형규   마비노기2 캐릭터 렌더링 기술
Ndc2010 전형규 마비노기2 캐릭터 렌더링 기술
 
Bump Mapping
Bump MappingBump Mapping
Bump Mapping
 
스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)
스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)
스크린 스페이스 데칼에 대해 자세히 알아보자(워햄머 40,000: 스페이스 마린)
 
Stable SSAO in Battlefield 3 with Selective Temporal Filtering
Stable SSAO in Battlefield 3 with Selective Temporal FilteringStable SSAO in Battlefield 3 with Selective Temporal Filtering
Stable SSAO in Battlefield 3 with Selective Temporal Filtering
 
High dynamic range
High dynamic rangeHigh dynamic range
High dynamic range
 
Secrets of CryENGINE 3 Graphics Technology
Secrets of CryENGINE 3 Graphics TechnologySecrets of CryENGINE 3 Graphics Technology
Secrets of CryENGINE 3 Graphics Technology
 
A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...
A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...
A Certain Slant of Light - Past, Present and Future Challenges of Global Illu...
 
[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shading[Ndc11 박민근] deferred shading
[Ndc11 박민근] deferred shading
 
[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기
[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기
[IGC 2016] 넷게임즈 김영희 - Unreal4를 사용해 모바일 프로젝트 제작하기
 
언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링언리얼을 활용한 오브젝트 풀링
언리얼을 활용한 오브젝트 풀링
 
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
프레임레이트 향상을 위한 공간분할 및 오브젝트 컬링 기법
 
노말 맵핑(Normal mapping)
노말 맵핑(Normal mapping)노말 맵핑(Normal mapping)
노말 맵핑(Normal mapping)
 
리플렉션과 가비지 컬렉션
리플렉션과 가비지 컬렉션리플렉션과 가비지 컬렉션
리플렉션과 가비지 컬렉션
 
Siggraph2016 - The Devil is in the Details: idTech 666
Siggraph2016 - The Devil is in the Details: idTech 666Siggraph2016 - The Devil is in the Details: idTech 666
Siggraph2016 - The Devil is in the Details: idTech 666
 
Unreal animation system
Unreal animation systemUnreal animation system
Unreal animation system
 
Low-level Shader Optimization for Next-Gen and DX11 by Emil Persson
Low-level Shader Optimization for Next-Gen and DX11 by Emil PerssonLow-level Shader Optimization for Next-Gen and DX11 by Emil Persson
Low-level Shader Optimization for Next-Gen and DX11 by Emil Persson
 
GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리
GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리
GPGPU(CUDA)를 이용한 MMOG 캐릭터 충돌처리
 
UE4 Garbage Collection
UE4 Garbage CollectionUE4 Garbage Collection
UE4 Garbage Collection
 
Brdf기반 사전정의 스킨 셰이더
Brdf기반 사전정의 스킨 셰이더Brdf기반 사전정의 스킨 셰이더
Brdf기반 사전정의 스킨 셰이더
 

이펙트 쉐이더 2강 - 알파 / 블랜딩