live2d with unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)
TRANSCRIPT
![Page 1: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/1.jpg)
![Page 2: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/2.jpg)
with UNITY
그녀들을 움직이게 하는 기술
![Page 3: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/3.jpg)
알콜코더 박민근(@agebreak)게임 클라이언트 프로그래머
유니티 마스터
‘신입 게임 개발자의 서울 상경기’(http://agebreak.blog.me)
‘초중급 게임 개발자 스터디 (데브루키)’(cafe.naver.com/devrookie)
게임 개발자 랩소디 (팟캐스트)(http://www.podbbang.com/ch/3921)
![Page 4: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/4.jpg)
본 내용은 [Unite2015] 신동림_미소녀 게임 제작을 위한Live2D 사용기를 참고 자료로 제작 되었습니다.
유튜브의 동영상이 다수 포함 되어 있습니다.
![Page 5: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/5.jpg)
• Live2D란?
• Live2D를 적용한 게임들 (국내/국외)
• Live2D Workflow
• Live2D를 Unity에서 사용하기
• Live2D 장단점
![Page 6: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/6.jpg)
Live2D
![Page 7: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/7.jpg)
![Page 8: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/8.jpg)
![Page 9: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/9.jpg)
Live2D
2D 일러스트를 있는 그대로, 입체적으로 움직일 수 있게 만드는 기술
CEDEC 2012에 Cybernoids가 발표
![Page 10: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/10.jpg)
![Page 11: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/11.jpg)
![Page 12: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/12.jpg)
![Page 13: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/13.jpg)
![Page 14: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/14.jpg)
Live2D
2D 일러스트 -> Vertex Animation을 제작할 수 있는 라이브러리와 툴
Modeler, Animator, Viewer, SDK
![Page 15: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/15.jpg)
Live2D 기능
2D 일러스트를 있는 그대로 3D 평면 Mesh로 변환
변환된 Mesh의 Vertex Animation
터치 위치등에 반응하는 Reactive Animation 제작 가능
미리 정의된 파라미터(눈, 입, etc…)로 표정 애니메이션 제작
Auto – LipSync
멀티 플랫폼 지원
![Page 16: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/16.jpg)
![Page 17: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/17.jpg)
![Page 18: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/18.jpg)
사용 사례Showcase
![Page 19: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/19.jpg)
![Page 20: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/20.jpg)
![Page 21: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/21.jpg)
![Page 22: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/22.jpg)
http://www.live2d.com/en/showcase
![Page 23: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/23.jpg)
Live2D 채용사례
![Page 24: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/24.jpg)
Live2D 라이센스
인디 게임, 학생에게는 무료
1억 이하 매출에서는 무료
Unity3D Pro 라이선스가 필요하지 않음
![Page 26: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/26.jpg)
Live2D SDK
![Page 27: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/27.jpg)
대응 플랫폼
![Page 28: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/28.jpg)
vs
2D -> 3D Mesh 변환하여 애니메이션 한다는 개념은 같다
Spine은 Bone Animation, Live2D는 Vertex Animation
본 애니메이션으로 미세한 2D 느낌의 애니메이션은 어려움
성능은 Live2D가 더 비싸다
![Page 29: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/29.jpg)
Spine vs Live2D
VS
공식 홈피의 소개 페이지에 있는 이미지들이라능…개인 취향 때문에 악의적 폅집 아니라능…
![Page 30: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/30.jpg)
Live2D Euclid
현재 개발 중인 기술
2D를 3D 월드에서 360도 각도에서 볼 수 있는 기술
하지만…360도에서 보이는 이미지들을 전부 미리 만들어둬야 한다.
이걸로 만들바에 그냥 3D 모델로 만드는게 차라리 나을지도
![Page 31: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/31.jpg)
![Page 32: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/32.jpg)
사례 : E-Book에 Live2D 활용이노우에 다케히코가 그린 E-Book(슬램덩크, 베가본드)
![Page 33: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/33.jpg)
Live2D Workflow
![Page 34: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/34.jpg)
Live2D == Cubism
Cubism
Modeler
•2D 일러스트를
Polygon Model
로 제작
•*.moc
Cubism
Animator
•파라미터 조정
•애니메이션 제작
•*.mtn
Cubism
Viewer
•Model view
•Anim 설정
•*.json
Cubism
SDK
•Unity
•IOS/Android
•Etc
![Page 35: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/35.jpg)
Live2D 데이터 제작
![Page 36: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/36.jpg)
![Page 37: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/37.jpg)
![Page 38: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/38.jpg)
![Page 39: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/39.jpg)
![Page 40: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/40.jpg)
![Page 41: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/41.jpg)
*.mtn : Animator Motion Data
![Page 42: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/42.jpg)
![Page 43: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/43.jpg)
*.json : 표정 표현, 애니메이션 세팅
![Page 44: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/44.jpg)
![Page 45: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/45.jpg)
Live2D in Unity3D참고로 저희는 자체 엔진이라 C++로 DirectX, OpenGLES로 씁니다. ㅠ.ㅠ
![Page 46: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/46.jpg)
![Page 47: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/47.jpg)
![Page 48: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/48.jpg)
![Page 49: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/49.jpg)
자세한 내용은 이 PT로 대체
http://www.slideshare.net/dongrimshin/live2d-48240587?qid=d62c83a7-d8ba-46d8-9e51-c2fac9956728&v=default&b=&from_search=1
![Page 50: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/50.jpg)
반투명 렌더링 문제
![Page 51: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/51.jpg)
해결법 – RenderTexture 사용
![Page 52: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/52.jpg)
![Page 53: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/53.jpg)
![Page 54: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/54.jpg)
![Page 55: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/55.jpg)
Live2D in AfterEffect
![Page 56: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/56.jpg)
![Page 57: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/57.jpg)
퍼포먼스
![Page 58: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/58.jpg)
![Page 59: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/59.jpg)
![Page 60: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/60.jpg)
데스티니 차일드의 경우
폴리곤 평균 2000개 이상, 버텍스 평균 1500개 이상모두 초고고퀄리티의 캐릭터들
![Page 61: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/61.jpg)
최적화 이전
•1캐릭터
60FPS
•5캐릭터
40FPS
이하
최적화 이후
•1캐릭터
60FPS
•5캐릭터
60FPS
유지
C++, OpenGLES 1.0, 갤럭시 S3
배치 렌더링 구현
Vertex 렌더링 부분 연산 최적화
Vertex Buffer 복사 부분 최적화
RenderState 최적화
![Page 62: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/62.jpg)
Live2D장단점
![Page 63: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/63.jpg)
Live2D 장점
무료로 사용해 볼 수 있다.
Unity3D용 플러그인과 라이브러리 제공
게임에 적용하기 쉽다.
참고자료 의외로 많음
![Page 64: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/64.jpg)
Live2D 단점
•단순한 애니메이션은 쉽게 가능한것처럼 보임
•고퀄의 애니메이션을 제작하기 위해서는 상당한 아트 노가다가 필요
•사례) 고퀄의 애니메이션 제작 1캐릭터/5일
제작 비용이 크다
•내부 라이브러리의 최적화가 미흡
•C++ 라이브러리의 경우 Batch Rendering이 없었음 -> 직접 구현하여 해결
•Vertex Animation을 CPU만의 연산으로 처리 (GPU 사용 안함)
성능 비용이 크다
![Page 65: Live2D with Unity - 그녀들을 움직이게 하는 기술 (알콜코더 박민근)](https://reader035.vdocuments.site/reader035/viewer/2022082201/5a66f1ee7f8b9a91298b4d9f/html5/thumbnails/65.jpg)
참고자료
• Live2D 홈페이지 : http://www.live2d.com/en(일본어/영어)
• 미소녀 게임 제작을 위한 Live2D 사용기(신동림) http://www.slideshare.net/dongrimshin/live2d-48240587
• Live2D 유튜브 채널 https://www.youtube.com/channel/UC5VA_JhIYLw4d-pd-XZ5gnw