SlideShare a Scribd company logo
Chapter 15. Blueprint Rendering and “Sketchy Drawings”GPU Gems 2http://cafe.naver.com/shader임용균 (guardin@naver.com)
Introductionimage-space non-photorealistic renderingBlueprint renderingSketchy drawing
Basic PrinciplesTo preserve images of intermediate renderings of the scene’s geometryTo implement an edge enhancement techniqueTo apply depth sprite rendering
Intermediate Rendering Results3D Geometry를 texture들에 렌더링하여2D 데이터로 나타내는 것을 Intermediate Rendering Results 라고 한다. (G-Buffer)scene buffer, normal buffer, z-bufferIntermediate Rendering Results를 한번 생성하고 뒤이은 렌더링 패스들에서 그것들을 이용한다.
Edge Enhancementimage-space edge enhancement techniquesiluette, border, crease edgenormal buffer와 depth buffer의 불연속성으로 edge들을 검출한다. 주위 텍셀을샘플링하여 불연속성을 검사할 수 있다.검출된 edge들을 텍스쳐에렌더링 하여 edge map을 생성한다.
Edge Enhancement
Depth Sprite Renderingdepth testing을 위한 추가적인 z-value를 제공하는 2D이미지를 depth sprite라 한다.z-value를 포함하고 있는 고해상도 텍스쳐에렌더링 한다.fragment z-value를 변경하는 특수화된 fragment shader를 적용한다.일반적인 depth-test 과정 후에 렌더링 한다.depth sprite rendering은 image-based rendering의 가시성을 올바르게 해결한다.
Blueprint Rendering3D geometry의 visible/non-visible edge들을 추출한다.visible edge는 카메라에 직접적으로 보이는 edge이다.non-visible edge는 3D geometry에 가려지는 edge이다.edge들을 추출하기 위해서 depth-peeling technique과 depth enhancement technique을 합쳐서 사용했다.visible/non-visible edge들을 frame buffer에서 합친다.
Sketchy Renderingvisually important edges and surface colors3D geometry non-uniformly using uncertainty
Sketchy Renderingintermediate rendering results를 이용하여 edge와 surface color를 표현한다.sketch에 image-space의무작위 값을 적용(uncertainty value)하여 이 텍스쳐들이 일정하지 않도록(non-uniformly) 한다.
Edges and Color Patchesedge enhancement technique을 이용하여 edge map을 생성한다. 3D geometry의 surface color를 강조되는 색으로 텍스쳐에 평면적으로 렌더링한다. (cartoon-like style)이 텍스쳐를shade map이라고 부른다.
Applying Uncertainty프레임과 프레임 사이의 일치성(coherence)을 위하여 uncertainty value를 나타내는 추가적인 텍스쳐가 필요하다.  (perlin noise)noise texture는 offset texture로 사용되며 edge, shade map을 교란(perturbation)시킨다.uncertainty value값의 정도를 결정하기 위해 2x2 행렬을 사용한다.
Applying Uncertaintysketchiness effect의 효과를 향상시키기 위해서 edge map과 shade map의 perturbation 정도를 다르게 적용한다.offs = turbulence(s, t); offt = turbulence(1 - s, 1 - t);
Adjusting Depth특히 uncertainty가 적용되었을때 original geometry의 z-values는 안쪽 지역에 존재 하지 않을 수 있다. 외부 지역의 original geometry에z-values가 존재하지 않을 수 있다.장면의 다른 오브젝트들과 올바르게 상호작용하지 못 한다.edge map perturbation과 shade map perturbation을 적용한 값중 작은 depth값 depth map에 적용한다.
Variations of Sketchy RenderingRoughened Profiles and Color Transitions (a) (b)Repeated Edges (c)
Controlling Uncertaintyimage-space에서 “swim” 문제가 나타난다.(shower-door effect)이 문제를 극복하기 위해서는? uncertainty value를 조절할 필요가 있다.uncertainty value를 측정하기 위해 geometric properties를 유지한다.외부 지역의 uncertainty value를 적어도 3D geometry에 가깝게 유지한다.
Preserving Geometric Propertiesuncertainty value를 계산하기 위해 surface position, normals, curvature(뒤틀림) 정보를 보존해 놓는다.G-Buffer에 추가로 geometric properties를 렌더링 한다.화면에 정렬된 quad texture에 기록되며 텍스쳐 좌표 (s, t)로 geometric properties에 접근 가능하다.uncertainty value를 계산할 때 parameters로 이용한다.f: (s, t) <- (s', t')f (s, t) = p(s, t, g(s, t)),
Enlarging the Geometrymesh의 각각의 vertex들을 object space에서 normal 방향으로 약간 이동(shifting)하면 된다.단 surface들이 모두 연결되어 있어야 하고 공유되는 vertex들은 interpolated normal값을 가져야 한다.3D geometry를 확장함으로써 안쪽 지역뿐 아니라 바깥쪽 지역도(원본 이미지의 근처) geometric properties를 렌더링 할 수 있다.안쪽 지역은 3d geometry의 경계를 넘어서 스케치 될 수 있고 바깥쪽 지역은 안쪽 지역을 뚫을수 있다.
Reducing the Shower-door Effecttexture에 확장된 3D geometry의 object-space position을 렌더링 한다. -> g(s, t)g(s, t)를 기반으로 p()를 이용하여 왜곡된 텍스쳐 좌표인 f(s, t)를 계산할 수 있다. f(s, t) = p(s, t, g(s, t)) (perturbation)Fedge(s, t)와 Fshade(s, t)를 다른 행렬들을 이용하여 계산한다.
Sketchy Rendering
Conclusion

More Related Content

PPTX
투명화 처리로 살펴 본 한층 고급화된 모바일 UX
PPTX
정점 변환
PDF
노말 맵핑(Normal mapping)
PPT
Rendering realistic Ice objects
PPTX
Bump Mapping
PPTX
SGL : 소프트웨어 3D 렌더링 엔진
PPTX
2018.02.03 이미지 텍스처링
PPTX
Html5 canvas study week1n2
투명화 처리로 살펴 본 한층 고급화된 모바일 UX
정점 변환
노말 맵핑(Normal mapping)
Rendering realistic Ice objects
Bump Mapping
SGL : 소프트웨어 3D 렌더링 엔진
2018.02.03 이미지 텍스처링
Html5 canvas study week1n2

Similar to Gpu Gems 2 Chapter 15 Sketchy Rendering (20)

PPTX
아일렛 온라인에서 사용한 블럭 렌더링 소개
PDF
[GEG1] 3.volumetric representation of virtual environments
PDF
Reflective Shadow Maps
PPT
GameMath-Chapter 08 고급렌더링
PPTX
게임 개발을 위한 렌더링 기법 한성환
PPTX
Light in screen_space(Light Pre Pass)
PDF
09_Voxel rendering
PPTX
다해상도 지연 렌더링
PDF
언차티드4 테크아트 파트4 Special Case Materials - Moss & Wetness & Glass
PPTX
9강 camera advanced light2
PPTX
[14.10.21] Far Cry and DX9 번역(shaderstudy)
PDF
[Shader study] the rendering technology of lords of the fallen - 발표메모(14.06.23)
PDF
2017 12 09_데브루키_리얼타임 렌더링_입문편(3차원 그래픽스[저자 : 한정현] 참조)
PDF
Deferred Shading
PPTX
Fast skin shading
PPTX
실전프로젝트 정서경 양현찬
PPTX
[1023 박민수] 깊이_버퍼_그림자
PPTX
Depth buffershadow
PPTX
[1023 박민수] 깊이_버퍼_그림자_1
PDF
[shaderx6] 3.7 Robust Order-Independent Transparency via Reverse Depth Peelin...
아일렛 온라인에서 사용한 블럭 렌더링 소개
[GEG1] 3.volumetric representation of virtual environments
Reflective Shadow Maps
GameMath-Chapter 08 고급렌더링
게임 개발을 위한 렌더링 기법 한성환
Light in screen_space(Light Pre Pass)
09_Voxel rendering
다해상도 지연 렌더링
언차티드4 테크아트 파트4 Special Case Materials - Moss & Wetness & Glass
9강 camera advanced light2
[14.10.21] Far Cry and DX9 번역(shaderstudy)
[Shader study] the rendering technology of lords of the fallen - 발표메모(14.06.23)
2017 12 09_데브루키_리얼타임 렌더링_입문편(3차원 그래픽스[저자 : 한정현] 참조)
Deferred Shading
Fast skin shading
실전프로젝트 정서경 양현찬
[1023 박민수] 깊이_버퍼_그림자
Depth buffershadow
[1023 박민수] 깊이_버퍼_그림자_1
[shaderx6] 3.7 Robust Order-Independent Transparency via Reverse Depth Peelin...
Ad

More from yong gyun im (6)

PPT
Rendering realistic Ice objects
PPTX
Fur rendering
PPTX
Sumie rendering
PPTX
Inferred Lighting
PPTX
Gpu Gems 1 Chapter 6
PPTX
Shaderstudy Motion Blur
Rendering realistic Ice objects
Fur rendering
Sumie rendering
Inferred Lighting
Gpu Gems 1 Chapter 6
Shaderstudy Motion Blur
Ad

Gpu Gems 2 Chapter 15 Sketchy Rendering

  • 1. Chapter 15. Blueprint Rendering and “Sketchy Drawings”GPU Gems 2http://cafe.naver.com/shader임용균 (guardin@naver.com)
  • 3. Basic PrinciplesTo preserve images of intermediate renderings of the scene’s geometryTo implement an edge enhancement techniqueTo apply depth sprite rendering
  • 4. Intermediate Rendering Results3D Geometry를 texture들에 렌더링하여2D 데이터로 나타내는 것을 Intermediate Rendering Results 라고 한다. (G-Buffer)scene buffer, normal buffer, z-bufferIntermediate Rendering Results를 한번 생성하고 뒤이은 렌더링 패스들에서 그것들을 이용한다.
  • 5. Edge Enhancementimage-space edge enhancement techniquesiluette, border, crease edgenormal buffer와 depth buffer의 불연속성으로 edge들을 검출한다. 주위 텍셀을샘플링하여 불연속성을 검사할 수 있다.검출된 edge들을 텍스쳐에렌더링 하여 edge map을 생성한다.
  • 7. Depth Sprite Renderingdepth testing을 위한 추가적인 z-value를 제공하는 2D이미지를 depth sprite라 한다.z-value를 포함하고 있는 고해상도 텍스쳐에렌더링 한다.fragment z-value를 변경하는 특수화된 fragment shader를 적용한다.일반적인 depth-test 과정 후에 렌더링 한다.depth sprite rendering은 image-based rendering의 가시성을 올바르게 해결한다.
  • 8. Blueprint Rendering3D geometry의 visible/non-visible edge들을 추출한다.visible edge는 카메라에 직접적으로 보이는 edge이다.non-visible edge는 3D geometry에 가려지는 edge이다.edge들을 추출하기 위해서 depth-peeling technique과 depth enhancement technique을 합쳐서 사용했다.visible/non-visible edge들을 frame buffer에서 합친다.
  • 9. Sketchy Renderingvisually important edges and surface colors3D geometry non-uniformly using uncertainty
  • 10. Sketchy Renderingintermediate rendering results를 이용하여 edge와 surface color를 표현한다.sketch에 image-space의무작위 값을 적용(uncertainty value)하여 이 텍스쳐들이 일정하지 않도록(non-uniformly) 한다.
  • 11. Edges and Color Patchesedge enhancement technique을 이용하여 edge map을 생성한다. 3D geometry의 surface color를 강조되는 색으로 텍스쳐에 평면적으로 렌더링한다. (cartoon-like style)이 텍스쳐를shade map이라고 부른다.
  • 12. Applying Uncertainty프레임과 프레임 사이의 일치성(coherence)을 위하여 uncertainty value를 나타내는 추가적인 텍스쳐가 필요하다. (perlin noise)noise texture는 offset texture로 사용되며 edge, shade map을 교란(perturbation)시킨다.uncertainty value값의 정도를 결정하기 위해 2x2 행렬을 사용한다.
  • 13. Applying Uncertaintysketchiness effect의 효과를 향상시키기 위해서 edge map과 shade map의 perturbation 정도를 다르게 적용한다.offs = turbulence(s, t); offt = turbulence(1 - s, 1 - t);
  • 14. Adjusting Depth특히 uncertainty가 적용되었을때 original geometry의 z-values는 안쪽 지역에 존재 하지 않을 수 있다. 외부 지역의 original geometry에z-values가 존재하지 않을 수 있다.장면의 다른 오브젝트들과 올바르게 상호작용하지 못 한다.edge map perturbation과 shade map perturbation을 적용한 값중 작은 depth값 depth map에 적용한다.
  • 15. Variations of Sketchy RenderingRoughened Profiles and Color Transitions (a) (b)Repeated Edges (c)
  • 16. Controlling Uncertaintyimage-space에서 “swim” 문제가 나타난다.(shower-door effect)이 문제를 극복하기 위해서는? uncertainty value를 조절할 필요가 있다.uncertainty value를 측정하기 위해 geometric properties를 유지한다.외부 지역의 uncertainty value를 적어도 3D geometry에 가깝게 유지한다.
  • 17. Preserving Geometric Propertiesuncertainty value를 계산하기 위해 surface position, normals, curvature(뒤틀림) 정보를 보존해 놓는다.G-Buffer에 추가로 geometric properties를 렌더링 한다.화면에 정렬된 quad texture에 기록되며 텍스쳐 좌표 (s, t)로 geometric properties에 접근 가능하다.uncertainty value를 계산할 때 parameters로 이용한다.f: (s, t) <- (s', t')f (s, t) = p(s, t, g(s, t)),
  • 18. Enlarging the Geometrymesh의 각각의 vertex들을 object space에서 normal 방향으로 약간 이동(shifting)하면 된다.단 surface들이 모두 연결되어 있어야 하고 공유되는 vertex들은 interpolated normal값을 가져야 한다.3D geometry를 확장함으로써 안쪽 지역뿐 아니라 바깥쪽 지역도(원본 이미지의 근처) geometric properties를 렌더링 할 수 있다.안쪽 지역은 3d geometry의 경계를 넘어서 스케치 될 수 있고 바깥쪽 지역은 안쪽 지역을 뚫을수 있다.
  • 19. Reducing the Shower-door Effecttexture에 확장된 3D geometry의 object-space position을 렌더링 한다. -> g(s, t)g(s, t)를 기반으로 p()를 이용하여 왜곡된 텍스쳐 좌표인 f(s, t)를 계산할 수 있다. f(s, t) = p(s, t, g(s, t)) (perturbation)Fedge(s, t)와 Fshade(s, t)를 다른 행렬들을 이용하여 계산한다.