모바일 그래픽 최적화
개발방식
조이시티
테크니컬 아트디렉터
김태근
-- 세션 요약:
이 세션에서는 Autodesk 3ds Max를 활용한 모바일 그래픽 최적화 개발 방식
을 여러 사례로 살펴 보고자 합니다.
발표가 다양한 경험과 다른 수준의 그래픽 제작 역량을 갖고 있는 인원을 대상
으로 하기 때문에, 이해를 돕기 위해 기초적인 이론 내용과 간단한 시연을 포함
하고 있습니다.
모바일 그래픽 최적화 개발방식
-- 세션 순서:
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
2. 모바일 저사양 기기에서 PBR 표현 텍스쳐링 방식
3. 맥스 스크립트로 작업 공정 최적화 방식
모바일 그래픽 최적화 개발방식
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
- 프로젝션 (영화나 광고 합성목적)
모바일 그래픽 최적화 개발방식
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
- 일반적인 모델링 과정
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
- 일반적인 모델링 방식
1> Spline
2> Box / Cylinder / Sphere (primitive)
3> Image based plane
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
- 일반적인 UV 방식
1> 1ch UV (non-tilable)
2> Tiled UV
3> multi ch UV (material ID)
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
- 모델링 데이터 제작 기준
1> 카메라 (distance/rotation / zoom)
2> 라이팅 (shading)
3> 폴리곤 사용 한도
4> 텍스쳐 사용 한도 (UV vs Rendering)
모바일 그래픽 최적화 개발방식
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
1) 이미지 선별 / 정리
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
2) 모델링 / 텍스쳐링 <시연>
- 작업 세팅
-- 컨셉 이미지 선 작업
-- 3ds Max 설정
모바일 그래픽 최적화 개발방식
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
2) 모델링 / 텍스쳐링 <시연>
- Perspective Match (이미지에 맞게 그리드를 재구성)
모바일 그래픽 최적화 개발방식
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
2) 모델링 / 텍스쳐링 <시연>
- Camera Mapping (고정된 카메라 기준으로 맵핑)
모바일 그래픽 최적화 개발방식
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
- 엔진 결과물 <시연>
모바일 그래픽 최적화 개발방식
1. 사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식
- 장점
1> 빠르고 간단한 모델링 (UV 프리)
2> 최적화를 고려한 방식 (은면 프리)
3> 텍스쳐 작업이 간소화 (컨셉 100%반영)
4> 빠른 리소스 수정 (마스크 텍스쳐)
- 단점
1> 카메라 조작 제약 조건 (근거리 사용불가)
2> 프로젝션 리소스의 퀄러티가 최종 퀄러티 (컨셉과 리소스 동시 작업)
3> 프로세스 적응 시간 (일반적인 모델링 방식 X)
모바일 그래픽 최적화 개발방식
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
2. 저사양에서 PBR 표현 텍스쳐링 방식
- PBR의 소개
1> 빛에 의한 재질의 표현 (빛의 반사 정도를 텍스쳐에 넣음)
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
2. 저사양에서 PBR 표현 텍스쳐링 방식
- PBR의 소개
1> Classic(Legacy) 텍스쳐 제작 방식
2> PBR 텍스쳐 제작 방식
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
2. 저사양에서 PBR 표현 텍스쳐링 방식
- PBR의 소개
2> Classic(Legacy) vs PBR 렌더 결과 차이 (specular vs
metallic+roughness)
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
2. 저사양에서 PBR 표현 텍스쳐링 방식
- PBR의 소개
모바일 그래픽 최적화 개발방식
모델링
텍스쳐
Albedo
Normal
1 - Roughness =
Smoothness
Roughness
Albedo + AO = Diffuse
Metallic
2. 저사양에서 PBR 표현 텍스쳐링 방식
- PBR 리소스 제작 2가지
1) 3D Mesh : 텍스쳐에 PBR 작업
2) 2D Mesh : PBR 작업
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- PBR 리소스 제작 툴, Substance Painter 소개
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- Substance Painter 에서 Export 하는 텍스쳐 종류 (엔진별 preset)
1> Albedo
2> Normal / World Space Normal
3> Metallic
4> Roughness / Smoothness
5> AO
6> ID map
7> Transparency
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- Substance Painter (시연)
2) 3D Mesh : 텍스쳐에 PBR 작업
-- Baked Lighting Environment (color)
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- Substance Painter Export 설정
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- 작업된 텍스쳐
-- Color + Reflection
-- Metallic
-- Roughness
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- 게임 엔진 확인 (유니티 시연)
1> 3D 모델
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- Iray+ (시연)
-- (Substance Painter Iray View) vs. (Max Iray+ Rendered
Image)
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- Iray 로 제작한 텍스쳐
1> Albedo
2> Normal / World Space Normal
3> Metallic
4> Roughness
5> Transparency
모바일 그래픽 최적화 개발방식
2. 저사양에서 PBR 표현 텍스쳐링 방식
- 게임 엔진 확인 (유니티 시연)
1> 2D 플랜
모바일 그래픽 최적화 개발방식
모바일 그래픽 최적화 개발방식
3. 맥스 스크립트로 작업 공정을 최적화 방식
모바일 그래픽 최적화 개발방식
3. 맥스 스크립트로 작업 공정을 최적화 방식
- 3DS Maxscript 소개
모바일 그래픽 최적화 개발방식
(사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
3. 맥스 스크립트로 작업 공정을 최적화 방식
- 작업 공정 파악하기
모바일 그래픽 최적화 개발방식
Texture
Camera
Material Slot
Rendering
Bake
Mesh
UV Channel
Vertex Color
Smoothing
Group
3. 맥스 스크립트로 작업 공정을 최적화 방식
- 3DS MAX 툴 (시연)
모바일 그래픽 최적화 개발방식
게임 엔진
3. 맥스 스크립트로 작업 공정을 최적화 방식
- 툴 구성
모바일 그래픽 최적화 개발방식
컨셉 모델링 텍스쳐링 export
import
카메라 설정 최적화 검수텍스쳐 설정
3. 맥스 스크립트로 작업 공정을 최적화 방식
- 장점
1> 반복과정의 단순화
2> 작업 시간 단축
3> 작업 실수/에러 최소화
4> 규칙적인 데이터 output
- 단점
1> 툴 개발 시간
2> 사용자 적응 시간
3> 전문 작업자 필요
모바일 그래픽 최적화 개발방식
Q & A
모바일 그래픽 최적화 개발방식
구인중
http://www.joycity.com/

Autodesk session 2017 - 김태근

  • 1.
  • 2.
    -- 세션 요약: 이세션에서는 Autodesk 3ds Max를 활용한 모바일 그래픽 최적화 개발 방식 을 여러 사례로 살펴 보고자 합니다. 발표가 다양한 경험과 다른 수준의 그래픽 제작 역량을 갖고 있는 인원을 대상 으로 하기 때문에, 이해를 돕기 위해 기초적인 이론 내용과 간단한 시연을 포함 하고 있습니다. 모바일 그래픽 최적화 개발방식
  • 3.
    -- 세션 순서: 1.사진이나 컨셉 이미지를 이용한 프로젝션 모델링 방식 2. 모바일 저사양 기기에서 PBR 표현 텍스쳐링 방식 3. 맥스 스크립트로 작업 공정 최적화 방식 모바일 그래픽 최적화 개발방식
  • 4.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 - 프로젝션 (영화나 광고 합성목적) 모바일 그래픽 최적화 개발방식
  • 5.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 - 일반적인 모델링 과정 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 6.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 - 일반적인 모델링 방식 1> Spline 2> Box / Cylinder / Sphere (primitive) 3> Image based plane 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 7.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 - 일반적인 UV 방식 1> 1ch UV (non-tilable) 2> Tiled UV 3> multi ch UV (material ID) 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 8.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 - 모델링 데이터 제작 기준 1> 카메라 (distance/rotation / zoom) 2> 라이팅 (shading) 3> 폴리곤 사용 한도 4> 텍스쳐 사용 한도 (UV vs Rendering) 모바일 그래픽 최적화 개발방식
  • 9.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 1) 이미지 선별 / 정리 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 10.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 2) 모델링 / 텍스쳐링 <시연> - 작업 세팅 -- 컨셉 이미지 선 작업 -- 3ds Max 설정 모바일 그래픽 최적화 개발방식
  • 11.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 2) 모델링 / 텍스쳐링 <시연> - Perspective Match (이미지에 맞게 그리드를 재구성) 모바일 그래픽 최적화 개발방식
  • 12.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 2) 모델링 / 텍스쳐링 <시연> - Camera Mapping (고정된 카메라 기준으로 맵핑) 모바일 그래픽 최적화 개발방식
  • 13.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 - 엔진 결과물 <시연> 모바일 그래픽 최적화 개발방식
  • 14.
    1. 사진이나 컨셉이미지를 이용한 프로젝션 모델링 방식 - 장점 1> 빠르고 간단한 모델링 (UV 프리) 2> 최적화를 고려한 방식 (은면 프리) 3> 텍스쳐 작업이 간소화 (컨셉 100%반영) 4> 빠른 리소스 수정 (마스크 텍스쳐) - 단점 1> 카메라 조작 제약 조건 (근거리 사용불가) 2> 프로젝션 리소스의 퀄러티가 최종 퀄러티 (컨셉과 리소스 동시 작업) 3> 프로세스 적응 시간 (일반적인 모델링 방식 X) 모바일 그래픽 최적화 개발방식
  • 15.
  • 16.
    2. 저사양에서 PBR표현 텍스쳐링 방식 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 17.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - PBR의 소개 1> 빛에 의한 재질의 표현 (빛의 반사 정도를 텍스쳐에 넣음) 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 18.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - PBR의 소개 1> Classic(Legacy) 텍스쳐 제작 방식 2> PBR 텍스쳐 제작 방식 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 19.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - PBR의 소개 2> Classic(Legacy) vs PBR 렌더 결과 차이 (specular vs metallic+roughness) 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 20.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - PBR의 소개 모바일 그래픽 최적화 개발방식 모델링 텍스쳐 Albedo Normal 1 - Roughness = Smoothness Roughness Albedo + AO = Diffuse Metallic
  • 21.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - PBR 리소스 제작 2가지 1) 3D Mesh : 텍스쳐에 PBR 작업 2) 2D Mesh : PBR 작업 모바일 그래픽 최적화 개발방식
  • 22.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - PBR 리소스 제작 툴, Substance Painter 소개 모바일 그래픽 최적화 개발방식
  • 23.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - Substance Painter 에서 Export 하는 텍스쳐 종류 (엔진별 preset) 1> Albedo 2> Normal / World Space Normal 3> Metallic 4> Roughness / Smoothness 5> AO 6> ID map 7> Transparency 모바일 그래픽 최적화 개발방식
  • 24.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - Substance Painter (시연) 2) 3D Mesh : 텍스쳐에 PBR 작업 -- Baked Lighting Environment (color) 모바일 그래픽 최적화 개발방식
  • 25.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - Substance Painter Export 설정 모바일 그래픽 최적화 개발방식
  • 26.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - 작업된 텍스쳐 -- Color + Reflection -- Metallic -- Roughness 모바일 그래픽 최적화 개발방식
  • 27.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - 게임 엔진 확인 (유니티 시연) 1> 3D 모델 모바일 그래픽 최적화 개발방식
  • 28.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - Iray+ (시연) -- (Substance Painter Iray View) vs. (Max Iray+ Rendered Image) 모바일 그래픽 최적화 개발방식
  • 29.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - Iray 로 제작한 텍스쳐 1> Albedo 2> Normal / World Space Normal 3> Metallic 4> Roughness 5> Transparency 모바일 그래픽 최적화 개발방식
  • 30.
    2. 저사양에서 PBR표현 텍스쳐링 방식 - 게임 엔진 확인 (유니티 시연) 1> 2D 플랜 모바일 그래픽 최적화 개발방식
  • 31.
  • 32.
    3. 맥스 스크립트로작업 공정을 최적화 방식 모바일 그래픽 최적화 개발방식
  • 33.
    3. 맥스 스크립트로작업 공정을 최적화 방식 - 3DS Maxscript 소개 모바일 그래픽 최적화 개발방식 (사용된 이미지는 임의적으로 인터넷에서 서치된 자료입니다.)
  • 34.
    3. 맥스 스크립트로작업 공정을 최적화 방식 - 작업 공정 파악하기 모바일 그래픽 최적화 개발방식 Texture Camera Material Slot Rendering Bake Mesh UV Channel Vertex Color Smoothing Group
  • 35.
    3. 맥스 스크립트로작업 공정을 최적화 방식 - 3DS MAX 툴 (시연) 모바일 그래픽 최적화 개발방식
  • 36.
    게임 엔진 3. 맥스스크립트로 작업 공정을 최적화 방식 - 툴 구성 모바일 그래픽 최적화 개발방식 컨셉 모델링 텍스쳐링 export import 카메라 설정 최적화 검수텍스쳐 설정
  • 37.
    3. 맥스 스크립트로작업 공정을 최적화 방식 - 장점 1> 반복과정의 단순화 2> 작업 시간 단축 3> 작업 실수/에러 최소화 4> 규칙적인 데이터 output - 단점 1> 툴 개발 시간 2> 사용자 적응 시간 3> 전문 작업자 필요 모바일 그래픽 최적화 개발방식
  • 38.
    Q & A 모바일그래픽 최적화 개발방식
  • 39.

Editor's Notes