「스퀘어 에닉스 오픈 컨퍼런스 2012」「agni's philosophy」비하인드 스토리

72
스퀘어 에닉스 오픈 컨퍼런스 2012Agni's Philosophy비하인드 스토리 Hair Rendering, Eye Shader, AO, AA, SSS 이민웅 Shader Study

Upload: -

Post on 03-Jul-2015

1.181 views

Category:

Documents


3 download

DESCRIPTION

「스퀘어 에닉스 오픈 컨퍼런스 2012」 「Agni's Philosophy」비하인드 스토리 Hair Rendering, Eye Shader, AO, AA, SSS

TRANSCRIPT

Page 1: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Hair Rendering, Eye Shader, AO, AA, SSS

이민웅

Shader Study

Page 2: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

풍부하고 다양한 표현을 현명하게

적용시킨 스킨 셰이딩

• 인물피부표현의 기초가 되는 것이 표면하산란 (SSS)

– 반투명 층이 겹쳐진 구조로되어있는것에 착안해서 만들어진 기법

• 빛을 받는 가운데 6%가 스펙큘러

• 나머지 94%는 피부안에서확산하여 각질층의 색을 기반으로하여 컬러 시프트를일으킨 후 외부로 확산

Page 3: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

인간의 몸이 가지는 투명감의 표현에 도전

Page 4: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

SSS

Page 5: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Poisson disk sampling

• 피하확산 시뮬레이션에

사용하는 텍셀의 샘플링을

포아송 분포의 특수 테이

블을 참조

• 무거운 피하확산 시뮬레이

션에 대한 계산량의 부족

함을 보충

Page 6: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

구현된 SSS의 파이프라인 개념도

Page 7: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

스크린 스페이스에서 처리하기 때문에

거리에 따라 부하가 크게 변화

Page 8: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

SSS없음과 있음의 차이。SSS가 적용되게 되면 일부가 붉은빛이 발생하여 표면이 매끄럽게 된다

SSS없음。SSS가 적용되게 되면 일부가 붉은빛이 발생하여 표면이 매끄럽게 된다

Page 9: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

SSS있음。SSS가 적용되게 되면 일부가 붉은빛이 발생하여 표면이 매끄럽게 된다

Page 10: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

스펙큘러의 표현

• 인물용 스펙큘러에는 단순한 Phong 스펙큘러가지고는 부족함

• Kelemen SzirmayーKalos구현을 기반으로한 스펙큘러(BRDF、쌍방향반사율분포함수)의 기법을 사용

• 반사지점 마다 반사방향・강도가 다른 스펙큘러 처리로 피부의 세밀한 요철에 의해생기는 영향을 가미한 스펙큘러 효과를 얻을수 있음

Page 12: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

스펙큘러의 표현

• SH Irradiance Volume(GI 환경광)으로부터의 영향을 메인으로 하고 큐브맵의 영향을 약하게 블렌딩한 스펙큘러

– 건조한 피부질감을 얻을 수 있다。

• 큐브맵을 기반으로 한 강한 스펙큘러로 이것은 지성에 가까운 피부질감을 얻을 수 있음

– 적절히 조합함으로써, 건성,지성 피부, 흐른 땀등의 다채로운 피부질감을 표현할수 있음

Page 16: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

젖어있는 스펙큘러를 마스킹해서 일부만을 적용함으로써 땀이나 눈물등의 표현을 낼 수 있다

Page 17: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

젖어있는 스펙큘러를 마스킹해서 일부만을 적용함으로써 땀이나 눈물등의 표현을 낼 수 있다

Page 19: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

확산반사에(Diffuse) 화면좌표계

(Screen Space Coordinate) 블러

를 적용하여 의사표면하 산란을 적

용한 결과

Page 21: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

SSS Off。(확산반사(Diffuse)+스펙큘러)

Page 22: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

SSS On。(확산반사(Diffuse) X SSS + 스펙큘러)。최종영상

Page 23: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

AO

• 인물용의 AO도 따로 준비

• 미리 구워놓은 Baked-AO와 리얼타임에 추가하는 SSAO 양쪽을 적절히 필요에 따라 나누어 쓰고 있음

• 일반적인 AO와 다른것은 AO의 레벨에 따라컬러 시프트를 발생시켜 어두운 부분에 약간붉은빛을 띄게하는 것

• 어두운 부분에서 피하확산의 효과가 강조되어붉은빛을 띄게된다 라는 자연스러운 표현을줄 수 있는것

Page 25: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

AO 컬러 계산시 약간에 변화를 주는것으로 인해 어두운 부분에 붉은 빛을 약간 띄게 하고 있다

Page 26: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

AO 없음 요철부분의 강도가 훨씬 더 눈에 띄게 나타나고 있다

Page 27: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

AO의 있음 요철부분의 강도가 훨씬 더 눈에 띄게 나타나고 있다

Page 28: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Back Scattering

• 피부의 투명감을 표현하기 위해, 백 스캐터

링(배경확산)[Back Scattering의 효과가 구

• 손가락이나 귀 등의 얇은 부분에서 배경 빛

이 투과되어, 두꺼운 부분보다 붉은빛을 띄

고 있는 것처럼 보이는 것

• 해당 오브젝트의 두께정보를 추가하여 광

원색을 반영시키는 것으로 구현

Page 29: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

백 스캐터링 없음。자연스러운 투명감이 연출되고 있다

Page 30: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

백 스캐터링 있음。자연스러운 투명감이 연출되고 있다

Page 31: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Eye

• 눈은 단순한 구체가 아님

– 두께를 가진 렌즈가 있고, 그 안에 홍채가 있음

• 눈을 대각선에서 보면, 렌즈에 의한 일그러

짐으로 인해 홍채의 깊이가 다르게 보이는

– 범프 맵핑에서 홍채의 패임을 표현하고, 패럴

렉스 맵핑으로 굴절을 표현

Page 32: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Diffuse에는 범프맵핑으로 움푹 들어간곳

을 표현

환경맵 반사에는 역 범프맵을 사용하여 고

조감을 가지게한다

스펙큘러에는 두개의 범프맵을 둘다 적용 합성된 최종 출력은 이렇게 된다

패럴렉스 맵핑에 의한 굴절표현

어느쪽이 자연스럽게 보이는가

Page 33: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Hair

• 같은 폴리곤 베이스의 머리카락 표현、또 하나는 Nurbs 곡선으로 주어진 제어라인으로 머리카락 다발을 시뮬레이션하여테셀레이션으로 증가시키는 기법– NURBS : 주어진 복수의 제어점으로부터 산술적인 곡선(곡면)을

생성하는 기법

• 2개의 버텍스로부터 이루어지는 선분을 각 버텍스로부터 만들어지는 NURBS곡선으로 변환하는데 테셀레이션 스테이지를사용

• 테셀레이션 스테이지의 헐 셰이더로 주어진 NURBS용 제어점을 기반으로 표현하고 싶은 곡선 정밀도를 구해, 테셀레이터에서 실제로 그정밀도에 따라 선분을 분할

• 분할 정밀도는 시점과의 거리에 따라 값이 결정

• 도메인 셰이더에서 곡선으로써의 의미를 부여하는 작업을 수행

Page 34: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Hair

• 찰랑찰랑한 머리카락에서 서두에 등장하는

남성의 곱슬곱슬한 수염, 하이에나풍 몬스

터의 뻣뻣한 털까지 자연스럽고 다양한 털

의 표현을 할수 있다라는 것

Page 35: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

B-Hair

• B-Hair는 Maya상에서 일반 메쉬로써 만들

며, T-Hair는 Nurbs(Non-uniform rational B-

spline)곡선의 제어점 집합을 가지고 만들

고 있음

• 제어점은 용수철같은 역학오브젝트로써 시

뮬레이션을 수행

• 중력이나 기타 오브젝트, 혹은 바람등 벡터

필드의 영향을 받아 동작

Page 36: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

T-Hair(Tariq-Hair)

• T-Hair의 제어점은 DirectX 11의 Compute

Shader로 스무딩 된 상태에서 테셀레이터

로 증가 시킴

• 지오메트리가 증가할때는 테셀레이터에 주

는 파라미터로 곱슬정도, 왜곡정도, 회전등

을 더할수 있어서, 직선이 아닌 빌보드 텍스

처를 입히는 것으로 머리카락의 품질 표현

을 가능하게 함

Page 40: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

T-Hair는 소환사등 남성 캐릭터의 수염, 혹은 동물의 털에도 사용되고 있다

Page 41: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Maya에서의 데이터는 이와 같이 구성

Page 42: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Nurbs의 제어점은 물리제어된 후 스무딩, 테셀레이션으로

지오메트리 증가, 빌보드 텍스처를 만든다라는 흐름으로 최종 이미지가 된다

Page 43: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

테셀레이터에서의 지오메트리 증가시 변형 파라미터를 주어 다른 털의 품질을 유연하게 표현할수 있다

Page 44: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

테셀레이터에서의 지오메트리 증가시 변형 파라미터를 주어 다른 털의 품질을 유연하게 표현할수 있다

Page 48: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Hair Lighting

• 머리카락의 셰이딩에 대해서는 위의 B-Hair 와 T-Hair 양쪽이 알맞게 스며들어 보여야할 필요가 있어, 난이도가 높은 문제에 해당

• 「Agni's」에서는 머리카락의 색을 정하는하이라이트, 2차원 하이트같은 복잡한 요소를 근사화 하는 Steve Marschner씨에 의한기법을 적용하여 구현

– Light Scattering from Human Hair Fibers

Page 49: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Hair Lighting

• 빛이 머리카락에 닿으면 상당한 비율이 그 표면에서 정반사하여 표면에 하이라이트를 만듬– 1.이 하이라이트는 주로 광원색으로 강하게 나오

는 것

– 2. 머리카락에 투과한 빛은 감쇠하면서도 모발 자체의 색을 흡수하고 방출

– 방출하는 빛중에서 입사하는 쪽으로 돌아온 2차적인 하이라이트를 형성하는것

– 3. 머리카락을 투과하여 방출된 투과광

– 머리카락의 색으로부터 방출하는 빛의 색은 광원색보다도 머리카락의 색이 좀더 지배적

Page 53: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

2차하이라이트를 추가하고 페이즈 시프트를 더한다

Page 54: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

큐브맵에 의한 환경반사등의 라이트를 추가

Page 55: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Hair Shadow

• Hair Shadow– PCF(Percentage Closer Filtering、근접 비율 필터링) 변형

형태를 사용

• PostEffect– 언샵마스크를 사용

• 영상을 선명하게 만드는 기술중 하나

– 음영의 엣지(외곽선)을 두드러지게 하여 머리카락이나 체모(몸의 털)의 깊이 있는 인상표현을 구현

• AA– 엣지부분에 Jaggy가 생기게 되버리는 문제에 대해서는 멀

티샘플링에 의한 안티앨리어싱(MSAA)、포스트 프로세싱적으로 AA를 수행하는 FXAA、그리고 피사계심도(DoF)에 의한 보케를 조합함으로써 자연스러운 엣지감을 연출

Page 60: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

섀도우를 좀 더 적용한 모습

Page 62: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

언샵 마스크로 좀 더 진하게

Page 72: 「스퀘어 에닉스 오픈 컨퍼런스 2012」「Agni's Philosophy」비하인드 스토리

Q&A

참고자료: 퐁퐁퐁 님 블로그

http://blog.naver.com/sorkelf/40186066235

http://blog.naver.com/sorkelf/40175739262