chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf ·...

30
제2장 멀티미디어 저작물과 툴 2.1 멀티미디어 저작물 ~ 2.3 VRML 고급 컴퓨터그래픽스 08. 9. 10 발표자 : 김경석 1 발표자 김경석 2.1 멀티미디어 저작물..……………………………………………3 22 몇몇의 유용한 편집기와 저작 2 2.2 몇몇의 유용한 편집기와 저작 ………………………………27 2.3 VRML......................................................................48 2.3 VRML......................................................................48 2

Upload: others

Post on 07-Feb-2020

0 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

제2장 멀티미디어 저작물과 툴

2.1 멀티미디어 저작물 ~ 2.3 VRML

고급 컴퓨터그래픽스08. 9. 10발표자 : 김경석

1

발표자 김경석

목 차

2.1 멀티미디어 저작물..……………………………………………3

2 2 몇몇의 유용한 편집기와 저작 툴 22.2 몇몇의 유용한 편집기와 저작 툴………………………………27

2.3 VRML......................................................................482.3 VRML......................................................................48

2

Page 2: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.1 멀티미디어 저작물 메타퍼

저작은 멀티미디어 응용을 창조하는 과정

몇 가지 저작 메타퍼(authoring methaphors)중의 하( g p )나를 이용하고 이것은 저작 패러다임(authoring paradigms)이라 불림

3

2.1.1 멀티미디어 저작물 메타퍼

스크립트 언어 메타퍼상호 작용(버튼, 마우스 등) 가능

조건, 점프, 루프, 함수/매크로가 허락하는 특별한 언어 이용

예) 오픈스크립트(OpenScript) 언어

⇒ 표준 객체 지향과 이벤트 유도 프로그래밍 언어와 유사⇒ 표준 객체 지향과 이벤트 유도 프로그래밍 언어와 유사

4

Page 3: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.1 멀티미디어 저작물 메타퍼

슬라이드 쇼 메타퍼기본적으로 연속적인 여러 장의 슬라이드로 구성

예) 파워포인트 이미지 큐 등예) 파워포인트, 이미지 큐 등.

계층적인 메타퍼사용자와 제어할 수 있는 요소들은 트리 구조로 구성사용자와 제어할 수 있는 요소들은 트리 구조로 구성

메뉴를 도출하는 응용에서 사용

아이콘/ 플로우 컨트롤 메타퍼그래픽 아이콘은 툴박스에서 유용,

저작은 아이콘이 있는 흐름도를

만듦으로써 계속만듦으로써 계속

IF문과 CASE문 등도 MAP(서브루틴)

아이콘을 이용하여 사용

5

2.1.1 멀티미디어 저작물 메타퍼

프레임 메타퍼아이콘 “프레임”의 디자인들은

아이콘/ 플로우 컨트롤 메타퍼아이콘/ 플로우 컨트롤 메타퍼

에서보다 더욱 추상적인 표현

예) 알렌 통신사의 퀘스트“프레임”으로 구성된- 프레임 으로 구성된

“모듈”로 이루어짐

프레임은 이벤트에 응답할 수

있는 모든 것인 텍스트와 그래픽과있는 모든 것인 텍스트와 그래픽과

오디오, 애니메이션, 비디오 같은

객체로부터 구성

실제적인 장점은 널리 사용하는

C 언어로 작성한 스크립팅 언어

6

Page 4: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.1 멀티미디어 저작물 메타퍼

카드/ 스크립팅 메타퍼간단한 인덱스-카드 구조를 사용

링크들을 이용할 수 있기 때문에 하이퍼텍스트나 하이퍼미디어를 사용하는 응용물 제작에 쉬운 방법

애플사의 하이퍼카드 : 이 메타퍼의 기원애플사의 하이퍼카드 : 이 메타퍼의 기원

날리지 애드벤처사의 하이퍼 스튜디오 : 현재 많이 사용

7

2.1.1 멀티미디어 저작물 메타퍼

캐스트/ 스코어/ 스크립팅 메타퍼시간은 스프레드시트 형태로 수평적으로 표현됨

문자의 “캐스트”와 “스크립트”로부터 돌출되는 멀티미디어요소들은 타이머 이벤트에 의해서 일어나는 이벤트 프로세서혹은 프로세서혹은 프로세서

이 메타퍼의 예로 매크로미디어사의 디렉터가 있음

디렉터는 링고 스크립팅 언어와 객체 지향 그리고 이벤트 유도 언어를 사용

8

Page 5: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.2 멀티미디어 제작

멀티미디어 제작멀티미디어 제작은 각 디자이너에서 프로그래머까지 포함

알파 버젼 : 모든 계획된 특징들을 포함하지 않은 초기 버전

저작물 타임라인의 65~70% 완성될때

40% 정도 완성되었을 때 프로그램을 포함하는 것이 가능40% 정도 완성되었을 때 프로그램을 포함하는 것이 가능

디자인 단계

스토리보딩, 플로우챠팅, 포토타이핑, 사용자 테스트와 미디, , ,어의 병렬 생산 등으로 구성

프로그래밍과 디버깅 단계

마케팅과 상담하여 수행마케팅과 상담하여 수행

분배 단계

9

2.1.2 멀티미디어 제작

스토리보드멀티미디어 개념의 초기 아이디어 내영에 일련의 스케치로묘사 ⇔ 비디오의 “키프레임”과 같음묘사 ⇔ 비디오의 키프레임 과 같음

흐름도는 검색 정보(멀티미디어 개념의 구조와 사용자 상호작용)를 입력에 의한 스토리보드들로 구성

검색 계획의 확실한 접근은 데이터 구조를 집어내는 것검색 계획의 확실한 접근은 데이터 구조를 집어내는 것계층적인 시스템이 가장 단순한 구조적인 단계 중 하나

흐름도 단계상세한 함수의 설명서의 전개에 의해서 이어짐상세한 함수의 설명서의 전개에 의해서 이어짐

프레젠테이션의 각각의 시나리오와, 모든 스크린 움직임을포함하는 프레임별, 사용자 상호 작용의 단계로 이루어짐

예) 문자에 마우스를 올려 놓을 때 문자 반응, 문자 클릭에 대한 반응

10

Page 6: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.2 멀티미디어 제작

표준화와 테스트 : 디자인 단계의 마지막 단계

표준화하기 전에 저작 툴을 사용하기도 함

테 마지막 전개 단계 전에 지 히테스트는 마지막 전개 단계 전에 지극히 중요

11

2.1.3 멀티미디어 프레젠테이션

그래픽 스타일신중한 생각은 컬러 도표의 조합과 어떤 문자화 방식이 프레젠테이션에서 인지되는지로 이어진다.

그림 2.4 참조

컬러 원리와 지침컬러 원리와 지침몇몇의 컬러 도표(color schemes)와 미술 스타일(art style)들은 어떤 주제 혹은 스타일에 최적으로 결합

컬러 도표 : 실외 풍경에 대해 자연적이고 꽃무늬가 됨

미술 스타일 : 유성 페인트, 그림 물감, 색연필, 파스텔

너무 많은 컬러는 사용하지 않는게 좋음

컬러는 주제에서 신호의 변환에 사용될 수 있음

12

Page 7: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.3 멀티미디어 프레젠테이션

글자체효과적이며 시각적인 통신을 위해 한 스크린에서 6~8줄 이상일때 큰 글자체(18~36포인트)가 최적

그림 2.4의 센 세리프 글자체(상단 그림)은 세리프 글자체(하단 그림)보다 더 효과적단 그림)보다 더 효과적

상단 그림 : 일관적인 컬러 도표를 가지며 크고 작은 os 세리프(에어리얼) 글자체 사용

하단 그림 : 너무 많은 컬러 사용으로 일관성 부족 컬러 부조합으로 인간 시각으로 초점 맞추기 어려움, 세리프(타임 뉴 로만) 글자체는 어둡고 프로젝션 셋팅에서 읽혀지기 어려움

13

2.1.3 멀티미디어 프레젠테이션

컬러 대비 프로그램스크린에서 판독 가능한 컬러를 만드는 가장 간단한 방법은텍스트에 대해 배경에 주요한 보색을 사용하는 것

0에서 1까지 범위를 가지는 컬러값에서 텍스트의 삼자극치(R, G B)값을 빼면 배경에 대해 읽기 쉬은 컬러가 주어짐G, B)값을 빼면 배경에 대해 읽기 쉬은 컬러가 주어짐

(R, G, B) ⇒ (1-R, 1-G, 1-B)

“반대”의 컬러는 아니지만 텍스트가 밝으면 배경은 어두움

그림 2.6 컬러 휠 참조

14

Page 8: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.3 멀티미디어 프레젠테이션

스프라이트 애니메이션스프라이트는

애니메이션에서

자주 사용

디렉터에서 스프라이트의디렉터에서 스프라이트의

표기는 어떤 재료를 인스턴트

화하기 위해 확장하는 것화하기 위해 확장하는 것

15

2.1.3 멀티미디어 프레젠테이션

비디오 천이형태 : 자르기(cuts), 와이프(wipes), 분해하기(dissolves), 페이드 인(fade ins) 페이드 아웃(fade outs) 등이드 인(fade-ins), 페이드 아웃(fade-outs) 등

자르기 : 각각의 클립으로부터 두 개의 연속적인 비디오 프레

임에서 돌연적인 변화를 수행(단순 & 많이 사용)

와이프 : 다른 비디오로부터 시야점 부분의 화소들을 교체. 두

비디오의 경계선이 스크린을 따라서 천천히 천이한다

면 두 번째 비디오는 서서히 첫 번째 비디오로 교체면, 두 번째 비디오는 서서히 첫 번째 비디오로 교체

분해 : 두 개의 비디오 시간이 혼합되어 모든 화소들이 교체되

어서 서서히 첫 번째와 두 번째가 바뀜

페이드 아웃 : 검은색(또는 흰색)에 의해서 비디오가 교체

페이드 인 : 페이드 아웃의 반대

16

Page 9: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.3 멀티미디어 프레젠테이션

어도비 프리미어 비디오 편집 소프트웨어에서 분해타입 Ⅰ : 십자 분해(cross dissolve)

모든 화소는 서서히 작용

D = (1-a(t))ㆍA + a(t) ㆍB

A와 B는 디비동 A와 B에 대해서 3 벡터 컬러값A와 B는 디비동 A와 B에 대해서 3-벡터 컬러값

a(t)는 천이 함수이고 종종 시간 t에 선형적

a(t) = kt, with ktmax = 1

페이드 인, 페이드 아웃이 이 타입의 특별한 형태

17

2.1.3 멀티미디어 프레젠테이션

타입 Ⅱ : 떨림 분해(dither dissolve)

비디오 A에서 a(t)에 의해 결정된 많은 화소들이 갑자기 비디오 B로 천이오 B로 천이

화소들의 위치는 무작위로 혹은 때때로 특정한 패턴을 가지고 변하는 경향이 있음

와이프는 특정한 기하학적인 패턴을 따라서 화소가 변화는이 타입 분해의 특별한 형태

18

Page 10: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.3 멀티미디어 프레젠테이션

타입 Ⅱ : 떨림 분해(dither dissolve)

슬라이드 비디오 천이를 위한 가상 코드슬라이드 비디오 천이를 위한 가상 코드

19

2.1.3 멀티미디어 프레젠테이션

몇 가지 기술적인 디자인 이슈

컴퓨터 플랫폼

유닉스 박스(S 과 같은) 다른 PC 메킨토시와 같은 형태유닉스 박스(Sun과 같은), 다른 PC, 메킨토시와 같은 형태

교차 플랫폼 소프트웨어들은 시스템 간의 상호 작동이 잘 안되는 모듈이 실행 시간으로 응답한다.

비디 형태와 해상비디오 형태와 해상도

가장 인기있는 형태는 NTSC, PAL, SECAM

이들은 상호 보완적이지 않고 비디오 작동을 위해서는 다른 형태로변환이 필요

비디오에서 아날로그 신호를 디지털 신호로 변화시키기 위해 “프레임 그래이빙”을 수행 => 비디오 캡쳐 카드

카드 성능의 옛 기준 : S-VGA 1280 x 1024

16비트 : 65,536컬러, 24비트 : 16,700,000컬러

요즘은 1600 x 1200 고해상도에 32비트 혹은 그 이상이 보편화

20

Page 11: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.3 멀티미디어 프레젠테이션

메모리와 디스크 공간 요구

멀티미디어 소프트웨어는 일반적으로 많은 메모리 및 디스크공간을 요구공간을 요구

원활한 성능을 위해서 적어도 128 메가 램과 20 기가바이트하드 디스크의 공간을 요구

전달 방법들

DVD 드라이브(기준이 아님)

CD ROM(저장 능력 부족 접속 시간이 하드에 비해 느림)CD-ROM(저장 능력 부족, 접속 시간이 하드에 비해 느림)

전자 전달(네트워크 대역폭에 의존)

스트리밍 옵션

현재 완벽한 메커니즘은 존재하지 않음

21

2.1.4 자동화 저장

하이퍼미디어 문서일반적인 문서 작성은 비선형적 :

정보 생성 및 캡처, 저작과 출판

첫 번째 단계인 멀티미디어 캡처는 문장이나 혹은 오디오 디지타이저를 사용하거나 비디오 프레임 그래이버를 사용하는지타이저를 사용하거나 비디오 프레임 그래이버를 사용하는것으로 발달되었고 자동화되어 있음

마지막 단계인 프레젠테이션은 우리가 고려하고 있는 멀티미디어 의 적디어 툴의 목적

중간 단계(저작)은 대부분 고려중

단일 시야 기능이나 정지된 시야보다는 다양한 시야 기능을단일 시야 기능이나 정지된 시야보다는 다양한 시야 기능을지원하는 데이터를 가장 잘 구성할 수 있도록 원함

22

Page 12: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.4 자동화 저장

구체화 대 선형화

23

2.1.4 자동화 저장

하이퍼텍스트의 반자동화 이동“노드”는 의미론적인 정보와 링크를 위한 앵커로 나타난다.

문장에 대해서 하이퍼텍스트에 종이 기반 정보를 이동하기문장에 대해서 하이퍼텍스트에 종이 기반 정보를 이동하기1. HTML을 사용해서 형태를 변환

2. 데이터베이스에서 단락과 장으로 나눔데이터 마이닝 기술의 간단한 버전은 키워드로 제목과 머리말을분석하는데 쉽게 사용

프로그램의 반자동화 버전은 수락, 거절, 수동적인 추가를 사용하여 제안을 만드는 것이 가장 성공하기 쉬움

데이터베이스 관리 시스템은 새로운 노드가 추가되었을 때 링크의 보전을 유지할 수 있음있

출판 단계에서 기초가 되는 정보 구조의 재생산이 불가능할때최후까지 데이터에서 시야점을 부과하는 것을 지연시키는 것이 최선의 방법

24

이 최선의 방법

Page 13: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.1.4 자동화 저장

하이퍼텍스트의 반자동화 이동

25

2.1.4 자동화 저장

하이퍼이미지이미지 영역을 구획화함으로써 구문론적인 이미지 요소들을수동적으로 윤곽을 그리는 것은 가능

문장에 꼬리표를 달 수 있고, 이전의 문장 기반 방법들을 작업하는 데 가져올 수 있음하는 데 가져올 수 있음

이러한 방법들은 확실히 초기 방법이지만, 자동화를 저작하는데에 매력적인 보기를 제공

26

Page 14: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.1 어도비 프리미어

프리미어 베이직멀티미디어 성분들을 조립과 병합으로써 간단한 디지털 비디오를 빠르게 제작하는 아주 간단한 비디오 편집 프로그램

27

2.2.1 어도비 프리미어

28

Page 15: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.1 어도비 프리미어

29

2.2.1 어도비 프리미어

프리미어 천이변환을 짜 맞추는 것이 아주 잘 되지는 않음

시간에 대해 선형적으로 지우는 목적의 실험에서 그것이 시작되는 동안에 비선형적으로 기울어짐이 판명

비디오 천이 라인은 아주 일정한 스피드로 움직이지 않음비디오 천이 라인은 아주 일정한 스피드로 움직이지 않음

프리미어 변환 팩토리는 변환을 구성하기 위한 많은 좋은 함수들을 제공

Int(정수) 체계에 있는 동안에 sin(사인), cos(코사인) 함수들은 float(실수)보다 int(정수)에서 영역과 범위를 가짐

30

Page 16: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.2 매크로미디어 디렉터

디렉터 윈도우상호 작용하는 “영화”를 제작하기 위한 완전한 환경

영화 메타퍼는 디렉터를 통해서 이룽지고, 프로그램에 사용된윈도우는 이것들을 반영

31

2.2.2 매크로미디어 디렉터

애니메이션전통적인 애니메이션(셀 애니메이션)은 시간이 지남에 따라다소 다른 이미지를 보여줌으로써 제작

디렉터는 다른 프레임에서 다른 캐스트 멤버들을 사용함으로써 가능써 가능

32

Page 17: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.2 매크로미디어 디렉터

33

2.2.2 매크로미디어 디렉터

제어어떤 프레임에서 지명된 표시자를 놓을 수 있다

Go To Frame, Go To Marker, 또는 Hold on Current Frame

프레임에 대한 움직임들은 스코어 윈도우에서 스크립트 채널에서 나타난다에서 나타난다

링고 스크립트네 가지 형태의 스크립트를 사용네 가지 형태의 스크립트를 사용

움직임, 캐스트 멤버가 붙은 스크립트, 영화 스크립트, 부모스크립트

4갸지 모두 캐스트 윈도우에서 캐스트 멤버로 나타남4갸지 모두 캐스트 윈도우에서 캐스트 멤버로 나타남

기본적인 데이터 형태는 물론 기본적인 데이터 구조 목록

목록은 선형과 특성 두 가지 형태로 있음

34

목록은 선형과 특성, 두 가지 형태로 있음

Page 18: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.2 매크로미디어 디렉터

윈도우 내의 링고 영화

3D 스크립트스테이지에서 3D 객체를 제작하고 불러오고 조작하는 기능

디렉터에서 3D 객체는 3D 텍스트이다

방법은 정규 텍스트를 선택하고 특성에서 3D에 디스플레이모드를 배치한다.

성질과 변수성질과 변수움직임 파라미터들을 상세화함으로써 더욱 유연하게 제작할수 있다.

35

2.2.2 매크로미디어 디렉터

디렉터 객체두 개의 주요한 객체 형태를 가짐

링고에서 제작된 객체링고에서 제작된 객체

스코어에서 만들어진 객체

부모 스크립트는 링고에서 새로운 객체를 제작하는 데 사용성질 인스펙터에서 스크립트 형태로 변화시킴으로써 부모 스크립트도 변형

그 변수는 링고 스크립트에서 만들어질 때 객체로 변함그 변수는 링고 스크립트에서 만들어질 때 객체로 변함

대부분의 사용된 객체는 스코어에서 스프라이트이다스프라이트는 그것을 참고하는 링고처럼 오직 같은 시간 동안에 사용될 수 있다안에 사용될 수 있다

스프라이트의 위치는 상대적으로 수직과 수평 위치를 변화시키기 위한 locv와 loch 성질에 의해서 변화될 수 있다

36

Page 19: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.3 매크로미디어 플래시

플래쉬는 상호 작용 영화의 제작을 시설화하는 간단한저작 툴이다.

윈도우영화는 각각의 독특한 부분인 하나 혹은 그 이상의 장면으로구성구성

플레시에서 영화를 구성하는 이미지와 음향과 같은 성분들은기호(symbol)로 불림( y )

라이브러리 윈도우장면에서 모든 현재의 기호를 보여주고 명령어에 의해서 바꿀수 있음

기호는 라이브러리에서 편집 가능하고 스테이지에 나타남

37

2.2.3 매크로미디어 플래시

타임라인 윈도우장면의 계층과 타임라인을 관리

왼쪽 일부는 스테이지의 내용을 쉽게 구성할 수 있는 계층

오른쪽 일부는 시간의 경과를 나타내주는 계층

계층을 잠그거나 숨기는 기능 있음계층을 잠그거나 숨기는 기능 있음

툴 윈도우이미지의 제작과 조작을 허락하는 부분이미지의 제작과 조작을 허락하는 부분

네 개의 주요한 부분으로 구성

툴(Tools) : 연필이나 페인트 통

시야(View) : 스테이지 검색하는 줌 툴, 손 툴

컬러(Color) : 전경과 배경색의 선택을 허락, 기호 컬러 조작

기능(option) : 툴이 선택되었을때 부가적인 기능을 허락

38

기능(option) : 툴이 선택되었을때 부가적인 기능을 허락

Page 20: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.3 매크로미디어 플래시

39

2.2.3 매크로미디어 플래시

기호다른 기호로부터 구성되거나, 플래시 안에서 가져올 수 있고그려질 수 있음

몇 개의 오디오, 이미지, 비디오 형태를 기호 라이브러리 내에서 가져올 수 있음서 가져올 수 있음

세 가지 움직임 중 하나를 가져올 수 있음

버튼(button)

그래픽(graphic)

영화(movie)

40

Page 21: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.3 매크로미디어 플래시

버튼타임라인 윈도우에 각 움직임에 맞는 키프레임을 만들고 기능을 구성(up, down, over, hit)

각 키프레임은 각각의 다른 버튼 이미지를 보여줌

오직 up 키프레임만이 요구되고 기본값을 가짐오직 up 키프레임만이 요구되고 기본값을 가짐

다른 모든 것은 부가 기능

41

2.2.3 매크로미디어 플래시

플래시 안에서 애니메이션애니메이션은 기호의 각 키프레임에서 미묘한 차이를 제작하기 위해 수반되어질 수 있음

트위닝은 자동적으로 제작되어진 키프레임 사이에서의 변화로 간단한 애니메이션을 제작할 수 있음로 간단한 애니메이션을 제작할 수 있음

트위닝(tweening)모양 트위닝(shape tweening)( p g)

시간이 지남에 따라 연속적으로 다른 모양이 변하는 모양을제작하도록 허락

움직임 트위닝(movement tweening)움직임 트위닝(movement tweening)

다른 키프레임 안에서 스테이지가 다른 위치에 기호를 위치시키도록 허락

42

Page 22: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.3 매크로미디어 플래시

마스크 애니메이션

계층 마스크(선택적으로 다른 계층의 일부분을 숨기는 계층)의 조작을 포함의 조작을 포함

예) 폭발 효과 제작시 사용

43

2.2.3 매크로미디어 플래시

액션 스크립트다른 키프레임을 움직이는 것 혹은 영화가 멈추기를 요구하는것과 같은 이벤트를 발생시키도록 허락것과 같은 이벤트를 발생시키도록 허락

키프레임 안에서 키프레임 혹은 기호에 붙여질 수 있음

6개의 종류로 나눌 수 있음기본적인 행동(Basic Action) : 영화에 많은 간단한 액션을 붙이는 것을 허락

Goto : 상세화된 키프레임에 영화를 움직이고 기능적으로 멈춤

Play : 멈춘 영화를 다시 시작

Stop : 플레이중인 영화를 멈춤

Tell target : 다른 기호와 키프레임에 메시지(액션 시작/ 멈춤)를보냄

행동(Action) : Loops와 Goto 문 같은 많은 프로그래밍 구문을 포함

44

Page 23: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.3 매크로미디어 플래시

연산자(Operators) : 변수에 대한 많은 비교와 연산자 할당을포함

함수(Functions) : 플래시 객체에 상세함 없이 플래시에 포함함수(Functions) : 플래시 객체에 상세함 없이 플래시에 포함되는 짜 맞추어진 함수를 포함

성질(Properties) : 플래시에서 미리 정의된 모든 전역 변수들을 함을 포함

물체(Objects) : 영화 클립 혹은 문자열과 그들과 관계있는함수와 같은 모든 객체를 목록화

버튼은 액션 스크립트 (이벤트 순서) 를 필요로 함

버튼을 누르는 것은 원인과 결과를 야기

45

2.2.3 매크로미디어 플래시

46

Page 24: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.2.4 드림위버

드림위버HTML, XML, 그 외에 다른 형태에서 인터넷 적용뿐만 아니라웹 사이트에서 사용 가능한 멀티미디어를 제작하는데 아주 인기 있는 제품

시각적인 레이아웃 툴 자바 스크립트 ASP PHP XML 같은시각적인 레이아웃 툴, 자바 스크립트, ASP, PHP, XML 같은파일 형태에 대한 코드 편집 능력을 제공

47

2.3 VRML

2.3.1 개략가상 현실 모델링 언어(Virtual Reality Modeling Language)

목적은 3 환경에서 물체에 색을 줄 수 있는 능력을 가짐목적은 3D 환경에서 물체에 색을 줄 수 있는 능력을 가짐

장점www 에서 3D 세계를 표현 가능하게 하는 첫 번째 방법

단점오늘날 많은 컴퓨터에서 느리게 동작

역사역사1995.5 : VRML 1.0

1996.1 : VRML 1.0C (파일 개발 형태의 집합에 기반)(파일 개발 형태의 에 기 )입방체나 구 혹은 사용자 정의의 다면체 등의 많은 단순한 3D 물체를 제작할 수 있게 함

좀더 현실적인 물체표현을 위해 재료나 질금은 상세화 가능

48

좀더 현실적인 물체표현을 위해 재료나 질금은 상세화 가능

Page 25: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.3 VRML

VRML의 최근 버전 : VRML 2.0

상호 작용하는 세계를 제작하는 능력이 추가

가상의 세계에서 애니메이션과 사 허락가상의 세계에서 애니메이션과 사운드를 허락

새로운 물체는 가상 세계에서 더 쉽게 창조하는 것이 추가

자바와 자바 스크립트는 예전부터 VRML을 포함자바와 자바 스크립트는 예전부터 VRML을 포함

VRML 1.0 은 2.0과 호환되지 않음

유틸리티들은 1.0에서 2.0으로 바꾸어서 사용할 수 있음

VRML 2.0은 세계 표준화 기구(ISO)에 제출되어 VRML97이상세화

VRML97은 가상적으로 VRML 2 0과 동일VRML97은 가상적으로 VRML 2.0과 동일

49

2.3 VRML

VRML 모양

하나 혹은 그 이상의 물체를 스크린에서 묘사하는 데 계층적으로 놓여진 노드들로 이루어짐여진 노드들로 이루어짐

더 복잡한 물체를 만들기 위하여 조합될 수 있는 기본적인 기하학적모양을 포함

양 노 들은 에서 물체에 대하여 일반적인 노 들임모양 노드들은 VRML에서 모든 물체에 대하여 일반적인 노드들임

박스, 실린더, 원뿔, 구 : 기하학적 노드들

인덱스화된 표면 집합(IndexedFaceSet)

인덱스가 있는 물체를 구성하는 면들의 집합

임의의 다수의 면을 가능하게 하여 복잡한 물체를 제작

돌출(Extrusion)돌출(Extrusion)

연결판을 따라 돌출된 2차원 교차 부분, 꽃잎과 같은 간단한 곡선을가진 표면을 제작하는데 유용

50

Page 26: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.3 VRML

외관 노드는 모양의 방향을 조절하고 재료 노드와 질감 노드를 포함

재료 노드재료 노드물체의 표면 성질을 상세화

색에 대한 값을 상세화하여 색조절 가능

전반사와 방사성의 색은 유사하게 정의전반사와 방사성의 색은 유사하게 정의

직간접적인 빛에 물체가 얼마나 반사되는지에 대한 것과 같은 성질 또한 조절

물체는 투명하거나 부분적으로 투명할 수 있음물체는 투명하거나 부분적으로 투명할 수 있음

세 가지 종류의 질감 노드이미지텍스처

무비텍스처

화소텍스처

51

2.3 VRML

이미지텍스처(ImageTexure)

외형적인 JPEG와 PNG 이미지 파일을 가져와서 그 모양에 색을 사상하는 것을 사상하는 것

무비텍스처(MovieTexture)

노드는 물체에 MPEG 영화를 사상하는 것을 허용

시작과 끝 또한 상세화 가능

화소텍스처(PixelTexture)

이미지텍스처 VRML을 사용하여 이미지를 제작하는 것을 의미

Text 노드를 사용하여 문장은 VRML 세계에 놓여질 수 있음

문자 표면은 양의 Y 방향에서 혹은 “up” 기본값

52

Page 27: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.3 VRML

형태를 정렬하기 위해서 변환 노드는 형태 노드 주위를 둘러싸야만 함

변환 노드는 변환과 스케일과 회전 노드를 포함변환 노드는 변환과 스케일과 회전 노드를 포함

변환은 현재의 위치로부터 기본값으로 세상의 중심에 있는물체를 특정한 거리만큼 움직임

스케일은 회전이 중심 주위에서 물체를 회전시키는 동안에물체의 크기를 크거나 작게 함

53

2.3 VRML

VRML 세계기본 카메라는 스크린의 중심으로부터 몇 미터를 두고 음의z-축으로 정렬

시야점(Viewpoint) 노드를 사용하여 기본 카메라 위치는 변호될 수 있고 다른 카메라가 추가 될 수 있음될 수 있고 다른 카메라가 추가 될 수 있음

시야점은 위치(position) 노드로 상세화될 수 있고 원점(orientation) 노드를 기본 시야로부터 회전할 수 있음

54

Page 28: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.3 VRML

VRML 세계에서 빛을 비추는 세 가지 형태

방향성 광원(DirectionalLight) 노드

태양과 유사(영상에서 한 방향으로 비추고 모든 물체에 영향)태양과 유사(영상에서 한 방향으로 비추고 모든 물체에 영향)

점 광원(pointLight)

공간의 어떤 점으로부터 모든 방향에 빛을 비춘다

조사 등(Spotlight)

어떤 지점으로부터 어떤 방향으로 빛을 비춘다

색이나 빛의 강도와 같은 변수들은 빛 종류에 대해 상세화색이나 빛의 강도와 같은 변수들은 빛 종류에 대해 상세화

배경 노드 : VRML 세계으 배경을 상세화

파노라마 노드 : 세꼐의 측면을 질감으로 사상

안개 노드 : 색과 안개의 상세화

55

2.3 VRML

2.3.2 애니메이션과 상호 작용인터폴레이터(interpolator) 노드에서 상세화된 물체를 천천히변화시킴으로써 행해질 수 있는 트위닝

6개의 인터폴레이터

색 좌표 법선 원점 위치 스칼라색, 좌표, 법선, 원점, 위치, 스칼라

모든 인터폴레이터는 두 개의 노드를 가지고 있고 상세화 되어야만 함

키(key) : 0으로 시작해 1로 끝나는 둘이나 그 이상의 수의 목록으로 구성

애니메이션이 얼마나 멀리 있는지 정의애니메이션이 얼마나 멀리 있는지 정의

키값(keyValue) : 키 요소와 보완

무슨값이 변화했는지 정의

56

Page 29: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.3 VRML

타임 센서(TimeSensor) 노드애니메이션에 시간을 부여

VRML 센서에서 어떤 물리적인 형태가 아니라 단지 시간을 유VRML 센서에서 어떤 물리적인 형태가 아니라 단지 시간을 유지 시키는 것

시간 변화의 인터폴레이터를 알기 위해서 통로(ROUTE)는 두가지 노드를 연결하기 위하여 필요가지 노드를 연결하기 위하여 필요

하나는 타임센서 사이에 필요, 하나는 인터폴레이터와 물체를 움직이는데 필요

사용자로부터 입력을 얻기 위한 VRML에서 사용가능한 센서사용자로부터 입력을 얻기 위한 VRML에서 사용가능한 센서환경 센서

시각 센서 : 사용자의 시야 영역이 비가시 영역으로 들어갔을때행동화행동화

근접 센서 : 사용자가 그 영역을 들어가거나 나갔을 때 행동화

충돌 : 사용자가 노드를 쳤을 때 행동화

57

2.3 VRML

고안물을 가리키는 센서

창작센서는 터치 센서 : 물체가 마우스에 의해 클릭되었을 때 행동화동화

드래그 센서 : 마우스가 물체를 드래그할 때 센서는 구와 실린더와 평판의 회전을 허용

58

Page 30: chap02.ppt [호환 모드]graphics.hallym.ac.kr/teach/2008/mm/src/chap02.pdf · 스프라이트애니메이션 스프라이트는 애니메이션에서 자주사용 디렉터에서스프라이트의

2.3 VRML

2.3.3 VRML 상세화VRML 파일의 첫 번째 라인은 버전을 나타냄

모든 노드들은 “{“ 으로 시작하고 “}”로 마침

그룹 노드는 다양한 노드들로 군집을 이룰 수 있음

상자는 스크린의 중심에서 2미터 거리의 입방체가 기본

변형 노드를 사용하여 스크린의 다른 부분으로 상자를 움직일수 있음

59

2.3 VRML

위 VRML 조각은 Y 방향으로 +10 위치에 붉은 상자의 중앙을놓는다

그 상자는 만약 DEF b 가 변형 앞에 놓이면 재사용 가능그 상자는 만약 DEF mybox가 변형 앞에 놓이면 재사용 가능

60