1 / 42

5 장 애니메이션

5 장 애니메이션. 5.1 애니메이션의 개요 5.2 전통적인 애니메이션 5.3 컴퓨터 애니메이션 5.4 웹 애니메이션 5.5 애니메이션의 활용 5.6 애니메이션 저작도구. 5.1 애니메이션의 개요. 애니메이션의 원리 일련의 정지 이미지 (still image) 나 그래픽으로부터 생성 잔상 효과 (persistence of vision) 이용 이미지가 이미 사라져도 사람의 눈이나 뇌에 계속 남아 있으려는 경향 일반적으로 초당 15~20 장 이상의 그림이면 자연스러운 움직임

onofre
Download Presentation

5 장 애니메이션

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. 5장 애니메이션 5.1 애니메이션의 개요 5.2 전통적인 애니메이션 5.3 컴퓨터 애니메이션 5.4 웹 애니메이션 5.5 애니메이션의 활용 5.6 애니메이션 저작도구

  2. 5.1 애니메이션의 개요 • 애니메이션의 원리 • 일련의 정지 이미지(still image)나 그래픽으로부터 생성 • 잔상 효과(persistence of vision) 이용 • 이미지가 이미 사라져도 사람의 눈이나 뇌에 계속 남아 있으려는 경향 • 일반적으로 초당 15~20장 이상의 그림이면 자연스러운 움직임 • 텔레비젼, 영사기, 비디오 플레이어는 모두 잔상효과를 이용.             원본 애니메이션(상)과 각 프레임(하)

  3. 5.1 애니메이션의 개요 • 애니메이션을 구성하는 프레임들

  4. 5.1 애니메이션의 개요 • 애니메이션의 구분 • 2차원 기반의 전통적인 애니메이션 • 플립북 애니메이션, 셀 애니메이션 • 컴퓨터 애니메이션 • 스프라이트 애니메이션, 벡터 애니메이션, 키프레임과 트위닝 • 3차원 컴퓨터 애니메이션 • 운동학과 역운동학, 모션 캡쳐 • 특수 효과 • 로토스코핑, 모핑, 절차적 방법, 입자시스템

  5. 5.1 애니메이션의 개요 애니메이션의 발전 • 애니메이션의 발전역사 • 1908, 프랑스 Emil Cohl 의 '판타즈마고리(Fantasmagorie)' • 1913, 미국 존 랜돌프가 셀 애니메이션 기법 개발 • 1937, 디즈니 '백설공주' : 최초의 장편 애니메이션

  6. 5.1 애니메이션의 개요 • 1961, 존 휘트니 ‘카탈로그’ : 최초의 CG 활용 애니메이션 • 1992, 디즈니 ‘미녀와 야수’ : 3D 활용

  7. 5.1 애니메이션의 개요 • 1995, 픽사 시스템 ‘토이스토리’: Full 3차원 CG 애니메이션 • 1998, 드림웍스 ‘개미’, 픽사 시스템 ‘벅스라이프’

  8. 5.1 애니메이션의 개요 • 2002, Disney/Pixar사의 ‘몬스터 주식회사’ • 2003, Disney/Pixar사의 ‘니모를 찾아서’

  9. 5.2 전통적인 애니메이션 • 전통적 애니메이션의 종류 • 전통적인 기법 • 효과적인 애니메이션을 위한 기법

  10. 5.2 전통적인 애니메이션 전통적인 애니메이션의 종류 (1) 플립북 애니메이션 (Flip-book Animation) • 가장 기본이 되는 애니메이션 • 프레임(Frame-based) 애니메이션이라고도 함. • 모든 프레임을 한장 한장 그려나가는 것 • 책의 가장 자리에 그림을 그려 빠르게 넘기면 나타나는 효과 • 파일의 크기가 크다 • 인터넷과 같이 제한된 데이터 전송 환경에서는 사용하기 힘들다

  11. 5.2 전통적인 애니메이션 (2) 셀 애니메이션 (Cel Animation) • 1913년 존 랜돌프가 개발 • 2차원 애니메이션 제작 시 사용 • 초기에는 수작업 • 1960년 Xerox 시스템을 사용하여 기계화 • 1990년 이후 컴퓨터를 활용하여 제작 기간 크게 단축 • "CEL" • 투명한 종이를 뜻하는 Celluloid의 "CEL"을 의미 • 기본적으로 하나의 배경 셀과 여러 장의 전경 셀이 필요 • 이러한 Cel들이 여러 개의 층을 이루어 하나의 프레임 구성 디즈니 애니메이션 ‘라이온 킹’

  12. 5.2 전통적인 애니메이션 전통적인 기법 • 양파껍질 효과 (Onion-skinning) • 셀 애니메이션에서 셀을 여러 장 겹쳐도 아래의 셀이 보임 • 양파 껍질은 투명해서 무언가를 덮어도 내용물이 보인다는 의미 • 프레임의 처음부터 끝까지 볼 수 있어, 프레임의 개요를 볼 수 있음 • 2차원 애니메이션 프로그램들이 Onion-skinning을 지원

  13. 5.2 전통적인 애니메이션 • 도려내기 효과 (Cut-out) • 셀 애니메이션에서 사용되었던 방법 • 캐릭터의 동작 일부만을 다시 그린다. • 가감속 (Ease-out/Ease-in) • 실세계에서 출발, 정지, 회전과 같은 동작은 같은 속도가 아니다 • 차가 출발할 때 서서히 가속, 커브를 돌 때는 속도가 줄어듬 • 반복 (Cycling) • 여러 개의 프레임을 하나의 Cycle이나 Loop로 만들 수 있음. • 많은 동작들은 반복적이며, 가장 기본적인 Cycle은 걷기 동작

  14. 5.2 전통적인 애니메이션 효과적인 애니메이션을 위한 기법 • 찌그러짐과 늘어남 (Squash and Stretch) • 물체의 유연성이나 탄성을 표현 • 물체가 멈추거나 방향을 바꿀 때 또는 딱딱한 물체에 부딪혔을 때 • 보조 액션과 중첩 액션 (Secondary /Overlapping Action) • 예) 수퍼맨의 동작은 주액션이고, 펄럭이는 망토는 보조액션 • 과장 (Exaggeration) • 애니메이션에 강한 인상을 주어 이용자의 눈에 띄도록 함.

  15. 5.3 컴퓨터 애니메이션 • 컴퓨터 애니메이션의 개념 • 특수효과 • 3차원 동작의 애니메이션

  16. 5.3 컴퓨터 애니메이션 컴퓨터 애니메이션 • 컴퓨터는 애니메이션에 혁명적인 변화를 가져왔음 • 기존의 수작업을 단순히 컴퓨터로 대신하는 것부터 3차원 애니메이션과 특수효과까지 제작 • 디지털화 된 애니메이션은 수정 및 편집, 전송과 저장이 용이 • 복제가 수월하여 수 백명의 군중 scene 제작에 용이

  17. 5.3 컴퓨터 애니메이션 (1) 스프라이트 애니메이션 (Sprite-based Animation) • 스프라이트(Sprite) • 애니메이션에서 독립적으로 움직이는 래스터 객체 • 아케이드 게임 속에 등장하는 캐릭터들의 애니메이션 • 스프라이트 애니메이션은 스프라이트 만을 다시 그려주면 된다 • 파일 크기나 데이터 전송 속도의 요구도 플립북 애니메이션보다 적음

  18. 5.3 컴퓨터 애니메이션 (2) 벡터 애니메이션 (Vector Animaton) • 인터넷에서 사용되는 플래쉬(Flash) 파일 포맷이 사용하는 방법 • 스프라이트가 비트맵이 아닌 수학적인 공식으로 표현 • 파일의 크기는 스프라이트 애니메이션 보다 작음 • 크기에 상관 없이 깨끗하게 보여짐

  19. 5.3 컴퓨터 애니메이션 (3) 키 프레임과 트위닝 (Key-frame and Tweening) • 기존의 애니메이션/만화영화 제작 시 • 키 프레임(Key frame) : 숙련된 애니메이터는 중요한 장면만 작성 • 가장 중요한 장면, 중요한 액션이 등장하는 장면, 시점이 변하는 곳 등 • 트위닝: 나머지 중간 부분은 트위닝 기법으로 완성 • 키 프레임 사이(Between)를 채운다는 의미의 IN-BETWEENING에서 유래 • 컴퓨터 환경에서도 유사 • 애니메이터는 키프레임만 완성 • 시간선(time-line) 중간 중간에 키 애니메이션 작성 • 중간 과정은 컴퓨터가 생성 • Frame Rate: 초당 프레임 수

  20. 5.3 컴퓨터 애니메이션 • 키프레임 애니메이션 (Key-frame animation) • 2차원 및 3차원 애니메이션에서 가장 널리 사용되는 기법 • 스토리보드의 작성, 물체의 표현, 키 프레임의 설정, 그리고 인비틴(In-between) 프레임의 생성 과정을 거침.

  21. 5.3 컴퓨터 애니메이션 특수효과 (1) 모핑 (Morphing) • 2개의 이미지나 3차원 모델 사이에 서서히 변화하는 과정을 표현 • 3차원 모핑 사용 예 : 마이클 잭슨의 뮤직 비디오 "Dangerous“, 영화 "터미네이터 2", 우리나라의 영화 "구미호", "은행나무 침대" 등 • 모핑의 원리 • 처음 프레임과 마지막 프레임을 지정 • 각 프레임 사이에 서로 매핑되는 점들을 지정 • 나머지는 컴퓨터가 생성, 이 과정을 보간(Interpolation)이라고 함

  22. 5.3 컴퓨터 애니메이션 (2) 로토스코핑 (Rotoscoping) • Betty Boop과 뽀빠이에게 생명을 불어넣기 위해서 1915년 경 Max Fleischer가 개발 • 로토스코핑은 크게 2가지 의미로 사용 • 영화의 한 장면에 애니메이션을 삽입하는 셀 애니메이션 • 액션 장면의 정지 프레임을 추적하여 움직임을 표현

  23. 5.3 컴퓨터 애니메이션 (3) 입자시스템 (Particle System) • 비, 불, 연기, 폭발 등의 자연 현상의 애니메이션을 제작 • 영화에서 폭발 등의 특수효과에 사용 • 영화 트위스터는 토네이도를 시뮬레이션 • 입자들에 대해 그 행동과 특성을 하나하나 부여

  24. 5.3 컴퓨터 애니메이션 (4) 절차적 애니메이션 (Procedural Animation) • 물체에 대한 알고리즘/물리공식을 만들어 움직임을 생성하는 기술 • 미립자 시스템(Particle system)이나 유동 표면(Flexible surface)과 같은 자연 현상이나 복잡한 시스템에 적용 • 물리기반 시뮬레이션 분야에서 연구 중

  25. 5.3 컴퓨터 애니메이션 3차원 동작의 애니메이션 • 역운동학 (Inverse Kinematics) • 인간이나 로보트와 같이 계층적으로 구성된 구조체의 동작을 표현 • 각 관절의 움직임을 말단 부분의 움직임에서부터 역으로 계산 • 역운동학을 사용하면 물체의 한 부분이 움직였을 때 연결된 부분들이 자연스럽게 그 부분을 따라가도록 할 수 있다. • 단점 : 관절을 하나씩 제어하는 것이 아니므로 팔이 뒤로 꺾이는 등의 부자연스러운 움직임이 연출 될 수 있음 운동학(좌)과 역운동학(우)

  26. 5.3 컴퓨터 애니메이션 • 모션 캡쳐 (Motion Capture) • 모션 캡쳐는 인간의 움직임을 만들어내는 가장 자연스러운 방법 • 3차원 컴퓨터 애니메이션의 생성을 위해 가장 많이 사용되는 기술 • 인간의 움직임을 직접 캡쳐(Capture)하여 움직임의 정보를 저장 • 마커(Marker) 또는 트랙커(Tracker)센서 사용

  27. 5.4 웹 애니메이션 • 기본적인 웹 애니메이션 • 애니메이션 파일의 Embed 방식

  28. 5.4 웹 애니메이션 기본적인 웹 애니메이션 • 애니메이션 GIF (AnimatedGIF) • GIF 포맷은미국 CompuServe 사에서 개발 • 연속적인 그림으로 구성된 GIF를 애니메이션 GIF라 함 • GIF에 포함된 각 그림의 순서를 정하고 각 그림의 지속 시간과 반복되는 횟수를 정의 • 가장 기본적인 웹 애니메이션으로 HTML 문서에 자주 사용

  29. 5.4 웹 애니메이션 • 자바 애플릿(Java Applet) • 인터넷 환경의 자바 프로그램 : 웹에서 다운로드 하여 실행 • GIF 애니메이션은 단순히 연속된 그림들의 나열인데 비해 Java는 프로그래밍 언어이기 때문에 여러 가지 효과를 만들어 낼 수 있음.

  30. 5.4 웹 애니메이션 • SVG(Scalable Vector Graphics) • 웹컨소시엄(W3C)에서 정한 2차원 벡터 그래픽스 표준 언어 • XML언어를 기반 • 다른 XML 언어와 결합하여 다양한 웹 애플리케이션으로 응용 가능 • 모바일 환경에서도 최적화 될 수 있는 특성을 제공

  31. 5.4 웹 애니메이션 애니메이션 파일의 Embed 방식 • <embed> 태그를 사용하여 웹이지에 삽입되는 애니메이션 • 적절한 플러그인이 설치되어야만 애니메이션이 가능 • Shockwave Flash • Macromedia 사에서 개발한 애니메이션 기술 • 웹에서 상호작용을 할 수 있고 텍스트, 이미지, 사운드, 비디오 등이 통합된 멀티미디어 콘텐츠를 포함 • QuickTime • 초기에는 매킨토시에서 동영상을 보이기 위한 Player에서 사용 • 현재는 거의 모든 운영체제에서 수행되는 동화상 재생기이자 웹에서 동화상이나 애니메이션을 재생하기 위한 플러그인으로 사용 • VRML(X3D): 웹환경에서 상호작용이 가능한 3D세계를 구축 AVI: Microsoft사에서 정의한 멀티미디어 파일교환의 일반적 포맷

  32. 5.4 웹 애니메이션 스트리밍 기술을 이용한 애니메이션 (1) Shockwave • 일반적으로 애니메이션의 결과(영화같이)는 압축되지 않은 상태에서 사용되지만, 인테넷에서 데이터의 전송은 제약이 있으므로 압축된 데이터, 즉 압축되어 있는 애니메이션을 요구 • Shockwave는 압축된 애니메이션임과 동시에 데이터의 일부만이 도착하여도 애니메이션을 가능케하는 기술 • Shockwave를 제작하기 위한 도구로는 Macromedia의 Flash(.swf)와 Director(.dcr)

  33. 5.4 웹 애니메이션 (2) QuickTime • QuickTime은 초기에 매킨토시에서 동화상을 보이기 위한 재생기(Player)였으나, 현재는 거의 모든 운영체제에서 수행되는 동화상 재생기이자 웹에서 동화상이나 애니메이션을 재생하기 위한 플러그인

  34. 5.5 애니메이션의 활용 • 만화영화 • 영화 • 광고 • 게임

  35. 5.5 애니메이션의 활용 만화영화 • 세계 각국의 주요 애니메이션 만화영화 • 백설공주(1937, 디즈니): 최초의 장편 애니메이션 • 미녀와 야수(1992, 디즈니): 2차원 캐릭터, 3차원 애니메이션 기법 • 토이스토리(1995, 픽사): 세계 최초의 3차원 애니메이션 • 몬스터 주식회사(2001, 디즈니/픽사), 니모를 찾아서(2003, 디즈니/픽사), 슈렉(2001~2007, 드림웍스)

  36. 5.5 애니메이션의 활용 영화 • 컴퓨터 애니메이션이 사용된 영화 • 1982, 트론(디즈니): 최초로 3차원 애니메이션 도입 • 1993, 주라기공원

  37. 5.1 애니메이션의 개요 • 1997, 타이타닉( 20세기폭스): 모션캡쳐를 이용한 컴퓨터 애니메이션 • 2001~2003, 반지의 제왕(뉴라인 시네마): 장대한 규모의 전쟁장면, 기이한 형태의 다양한 생명체 - 3부작으로 대성공

  38. 5.5 애니메이션의 활용 광고 및 게임 • 광고 • 상업광고 : 강한 인상을 남겨야하는 광고의 속성상 컴퓨터 애니메이션은 유용한 수단, 불가능한 장면의 구현 가능 • 인터넷 광고 : GIF, VRML, Java 이용 • 게임 광고 게임

  39. 5.6 애니메이션 저작도구 • 2차원 애니메이션 저작도구 • 3차원 애니메이션 저작도구 • 웹 애니메이션 저작도구

  40. 5.6 애니메이션 저작도구 2차원 애니메이션 저작도구 • Animo • 만화영화 제작용 소프트웨어, 키프레임에 기반하여 제작 • 캐릭터 애니메이션은 벡터 포맷, 해상도 독립적인 포맷으로 작성 • TOONZ • SoftImage사 개발, 셀 애니메이션 제작을 위한 소프트웨어 Animo TOONZ

  41. 5.6 애니메이션 저작도구 3차원 애니메이션 저작도구 • SoftImage XSI • 애니메이션만을 비교해 볼 때 다른 제품에 비해 가장 우수한 성능을 지니며 모델링은 상대적으로 미흡 • MAYA • NURBS를 이용하여 모델링, 3차원 소프트웨어 중에서 가장 뛰어나다는 평가 • 3D Studio MAX • 비교적 낮은 가격에 높은 품질의 기능을 제공 SoftImage XSI 3D Studio MAX

  42. 5.6 애니메이션 저작도구 웹 애니메이션 저작도구 • Director • 셀 애니메이션과 트위닝 제작에 필요한 기능을 제공 • Lingo 라는 스크립트 언어를 제공하여 다른 미디어와의 연결 가능 • Flash • 웹에서 벡터 애니메이션을 제작하는 소프트웨어 • 인터랙티브한 홈페이지를 제작할 때 필수적, • 사용법이 간단하면서 출력물의 결과가 만족스러워 많은 인기 • 트위닝 기법을 사용하며, 간단한 형태에 대한 모핑을 제공 Director 작업화면 Flash로 만든 eCard

More Related