에버플래닛의 글로브뷰 렌더링 ndc2011

90
에버플래닛의 글로브뷰 렌더링 김이선 (veblush at neople | gmail) 네오플 던파개발실

Upload: esun-kim

Post on 23-Jun-2015

1.505 views

Category:

Technology


4 download

TRANSCRIPT

Page 1: 에버플래닛의 글로브뷰 렌더링 NDC2011

에버플래닛의

글로브뷰 렌더링

김이선 (veblush at neople | gmail)

네오플 던파개발실

Page 2: 에버플래닛의 글로브뷰 렌더링 NDC2011

BNB 프로그래머

카트라이더 리드 프로그래머

버블파이터 프로토타입

리드 프로그래머

에버플래닛 리드 프로그래머

던전엔파이터 테크니컬 디렉터

게임 프로그래밍 10년차

Page 3: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 4: 에버플래닛의 글로브뷰 렌더링 NDC2011

1. 글로브뷰 소개 2. 지형 3. 카메라, 하늘

Page 5: 에버플래닛의 글로브뷰 렌더링 NDC2011

Marineblues

Page 6: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 7: 에버플래닛의 글로브뷰 렌더링 NDC2011

VS

Page 8: 에버플래닛의 글로브뷰 렌더링 NDC2011

“평면 지형 + 왜곡 효과”

Page 9: 에버플래닛의 글로브뷰 렌더링 NDC2011

기존 맵 편집 방법 사용 가능

Page 10: 에버플래닛의 글로브뷰 렌더링 NDC2011

물리 처리, 게임 로직 처리 간단

Page 11: 에버플래닛의 글로브뷰 렌더링 NDC2011

물리 처리, 게임 로직 처리 간단

Page 12: 에버플래닛의 글로브뷰 렌더링 NDC2011

자연스럽지 않은 각도가 존재함

Page 13: 에버플래닛의 글로브뷰 렌더링 NDC2011

왜곡 효과를 어떻게?

Page 14: 에버플래닛의 글로브뷰 렌더링 NDC2011

Globe Transform 직교좌표계에서 평면을 구면으로 변환

Page 16: 에버플래닛의 글로브뷰 렌더링 NDC2011

1. 글로브뷰 소개 2. 지형 3. 카메라, 하늘

Page 17: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 18: 에버플래닛의 글로브뷰 렌더링 NDC2011

극점에서 멀어질 수록 z축 방향으로 내림

Page 19: 에버플래닛의 글로브뷰 렌더링 NDC2011

Quadratic Transform

d

e

Page 20: 에버플래닛의 글로브뷰 렌더링 NDC2011

http://www.youtube.com/watch?v=_XKJ86c8z_k

Page 21: 에버플래닛의 글로브뷰 렌더링 NDC2011

근거리에서 그럴듯함

Page 22: 에버플래닛의 글로브뷰 렌더링 NDC2011

원거리에서는 …

Page 23: 에버플래닛의 글로브뷰 렌더링 NDC2011

http://www.youtube.com/watch?v=Ov14izoWUPs

Page 24: 에버플래닛의 글로브뷰 렌더링 NDC2011

정말 구에 매핑해보자!

Page 25: 에버플래닛의 글로브뷰 렌더링 NDC2011

Spherical Transform

d

e

Page 26: 에버플래닛의 글로브뷰 렌더링 NDC2011

http://www.youtube.com/watch?v=PbMHT8phiq0

Page 27: 에버플래닛의 글로브뷰 렌더링 NDC2011

Spherical 은 멀리서 잡아도 이쁨

Page 29: 에버플래닛의 글로브뷰 렌더링 NDC2011

둘 을 비교해 보면?

Page 30: 에버플래닛의 글로브뷰 렌더링 NDC2011

VS

Page 31: 에버플래닛의 글로브뷰 렌더링 NDC2011

VS 9 slots

63 slots

Page 32: 에버플래닛의 글로브뷰 렌더링 NDC2011

게임 화면은 Quadratic!

Spherical 은 선택적으로만 사용 (마이플래닛 등)

Page 33: 에버플래닛의 글로브뷰 렌더링 NDC2011

Globe Transform 을 어디서?

Page 34: 에버플래닛의 글로브뷰 렌더링 NDC2011

Local Space

World Space

View Space

Projection Space

World Transform

View Transform

Perspective Transform

Page 35: 에버플래닛의 글로브뷰 렌더링 NDC2011

Local Space

World Space

View Space

Projection Space

World Transform

View Transform

Perspective Transform

Globe Space

Globe Transform

극점의 위치

Page 36: 에버플래닛의 글로브뷰 렌더링 NDC2011

VertexShader 사용 Globe Transform 은 Matrix 로 표현할 수 없음

Page 37: 에버플래닛의 글로브뷰 렌더링 NDC2011

최저사양!

T&L > Vertex Shader

Page 38: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 39: 에버플래닛의 글로브뷰 렌더링 NDC2011

해결해야 했던 문제

Page 40: 에버플래닛의 글로브뷰 렌더링 NDC2011

변환을 염두한 모델링

Page 41: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 42: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 43: 에버플래닛의 글로브뷰 렌더링 NDC2011

직선이 유지 되지 않음

Page 44: 에버플래닛의 글로브뷰 렌더링 NDC2011

Translate

Rotate

Scale

Projection

Page 45: 에버플래닛의 글로브뷰 렌더링 NDC2011

Local Space

World Space

View Space

Projection Space

World Transform

View Transform

Perspective Transform

Page 46: 에버플래닛의 글로브뷰 렌더링 NDC2011

Globe

Page 47: 에버플래닛의 글로브뷰 렌더링 NDC2011

Local Space

World Space

View Space

Projection Space

World Transform

View Transform

Perspective Transform

Globe Space

Globe Transform

Page 48: 에버플래닛의 글로브뷰 렌더링 NDC2011

?

Page 49: 에버플래닛의 글로브뷰 렌더링 NDC2011

Bounding Box

Page 50: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 51: 에버플래닛의 글로브뷰 렌더링 NDC2011

극축!

Page 52: 에버플래닛의 글로브뷰 렌더링 NDC2011

극축!

Page 53: 에버플래닛의 글로브뷰 렌더링 NDC2011

Picking

Page 54: 에버플래닛의 글로브뷰 렌더링 NDC2011

World Space

Projection Space

View*Perspective Transform-1

Screen Space

Pos Picking Ray

Page 55: 에버플래닛의 글로브뷰 렌더링 NDC2011

View Space

Projection Space

Perspective Transform-1

Screen Space

Pos Picking Ray

Globe Space

Globe Transform-1

World Space

View Transform-1

Page 56: 에버플래닛의 글로브뷰 렌더링 NDC2011

View Space

Projection Space

Perspective Transform-1

Screen Space

Pos Picking Ray

Globe Space

Globe Transform-1

World Space

View Transform-1

Page 57: 에버플래닛의 글로브뷰 렌더링 NDC2011

Globe Space

Projection Space

View*Perspective Transform-1

Screen Space

Pos Picking Ray

Local Space

World Space

World Transform

Globe Transform

Globe Space

Page 58: 에버플래닛의 글로브뷰 렌더링 NDC2011

1. 글로브뷰 소개 2. 지형 3. 카메라, 하늘

Page 59: 에버플래닛의 글로브뷰 렌더링 NDC2011

극점 이동

Page 60: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 61: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 62: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 63: 에버플래닛의 글로브뷰 렌더링 NDC2011

계속 돌기

Page 64: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 65: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 66: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 67: 에버플래닛의 글로브뷰 렌더링 NDC2011

하늘!

Page 68: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 69: 에버플래닛의 글로브뷰 렌더링 NDC2011

보통의 경우

Page 70: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 71: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 72: 에버플래닛의 글로브뷰 렌더링 NDC2011

하늘 만들기

Page 73: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 74: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 75: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 76: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 77: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 78: 에버플래닛의 글로브뷰 렌더링 NDC2011

지평선 맞추기

Page 79: 에버플래닛의 글로브뷰 렌더링 NDC2011

일반적인 카메라

캐릭터의 고도에 맞춰 카메라의 고도 변경

Page 80: 에버플래닛의 글로브뷰 렌더링 NDC2011

http://www.youtube.com/watch?v=u8StAeWc6m8

Page 81: 에버플래닛의 글로브뷰 렌더링 NDC2011

지평선 유지 카메라

캐릭터의 고도에 맞춰 카메라의 고도/각도 변경

Page 82: 에버플래닛의 글로브뷰 렌더링 NDC2011

http://www.youtube.com/watch?v=A7gHQHAyhQg

Page 83: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 84: 에버플래닛의 글로브뷰 렌더링 NDC2011
Page 85: 에버플래닛의 글로브뷰 렌더링 NDC2011

-0.4

-0.3

-0.2

-0.1

0

0.1

0.2

0.3

0.4

-5 -4 -3 -2 -1 0 1 2 3 4 5 6 7 8 9 10 11 12 13 14

v-r

ad

z

Page 86: 에버플래닛의 글로브뷰 렌더링 NDC2011

지평선 유지 카메라+

각도 고정을 70%만

Page 87: 에버플래닛의 글로브뷰 렌더링 NDC2011

http://www.youtube.com/watch?v=LyGQmjWYTPk

Page 88: 에버플래닛의 글로브뷰 렌더링 NDC2011

결론

Page 89: 에버플래닛의 글로브뷰 렌더링 NDC2011

글로브뷰는

월드의 구조를 변경하지 않고

행성 위를 걷는 효과를 만듦

Page 90: 에버플래닛의 글로브뷰 렌더링 NDC2011

감사합니다!