2.1 멀티미디어 저작물 2.2 몇몇 유용한 편집기와 저작 툴 2.3 VRML

Presentation on theme: "2.1 멀티미디어 저작물 2.2 몇몇 유용한 편집기와 저작 툴 2.3 VRML"— Presentation transcript:

1 2.1 멀티미디어 저작물 2.2 몇몇 유용한 편집기와 저작 툴 2.3 VRML
제 2 장. 멀티미디어 저작물과 툴 2.1 멀티미디어 저작물 2.2 몇몇 유용한 편집기와 저작 툴 2.3 VRML 2011-2학기 멀티미디어시스템

2 2.1 멀티미디어 저작화 멀티미디어 저작화. 2장 주요 내용 때때로 영화 혹은 발표라고 불리는 멀티미디어 제작의 산물
우리는 쌍방향적인 적용에 관심이 있다. 아도비 포토샵과 같은 정지영상의 편집기들과 아도비 프리미어와 같은 간단한 비디오 편집기에 관심이 있다. 2장 주요 내용 멀티미디어 저작물 메타퍼 멀티미디어 제작 멀티미디어프리젠테이션 자동화 저작물 2011-2학기 멀티미디어시스템

3 멀티미디어 저작물 메타퍼 스크립트언어 메타퍼
상호작용(버튼,마우스,등등)이 가능하고 조건,점프,루프,함수/매크로가 허락하는 특별한 언어를 이용한다. 예를 들면,아래와 같은 작은 툴 박스 프로그램이다. -- load an MPEG file extFileMame of MEdiaPlaer "theMpegPath" =         "c:＼windows＼media＼home33.mpg"; -- play extPlayCount of MediaPlayer "theMpegPath" = 1; -- put the MediaPlayer in frames mode (not time mode) extDisplayMode of MediaPlayer "theMpegPath" = 1; -- if want to start and end at specific frames: extSelectionStart of MediaPlayer "theMpegPath" =103; extSelectionEnd of Mediaplayer "theMpegPath" = 1997; -- start playback get extPlay() of MediaPlayer "theMpegPath"; 2011-2학기 멀티미디어시스템

4 슬라이드 쇼 메타퍼 계층적인 메타퍼 아이코닉/플로우 컨트롤 메타퍼
비록 슬라이드 쇼에서 건너뛰기를 수행할 수 있지만, 기본적으로 일련의 발표로 이루어진다. 계층적인 메타퍼 사용자가 제어 가능한 요소들은 트리 구조로 구성된다. 가끔 메뉴를 도출하는 응용에 사용된다. 아이코닉/플로우 컨트롤 메타퍼 그래픽 아이콘은 툴 박스에서 유용하고 저작은 아이콘이 있는 흐름도를 만듦으로써 계속된다.(그림 2.1) 2011-2학기 멀티미디어시스템

5 그림 2.1 : 저작물의 흐름도 2011-2학기 멀티미디어시스템

6 프레임 메타퍼 아이콘/플로우 컨트롤 메타퍼와 같은 것. 프로그램의 사실적인 흐름을 나타내는 것 보다 아이콘들 사이의 연결이 더욱 개념적이다.(그림 2.2) 그림 2.2 : 퀘스트 프레임 2011-2학기 멀티미디어시스템

7 하이퍼텍스트나 하이퍼 미디어를 사용하는 응용물을 제작하는데 쉬운 방법으로 학교에서 사용된다.
카드/스크립팅 메타퍼 간단한 인덱스 카드 구조를 사용한다. 하이퍼텍스트나 하이퍼 미디어를 사용하는 응용물을 제작하는데 쉬운 방법으로 학교에서 사용된다. 그림 2.3 : 하이퍼스튜디오 스택에서 두 카드 2011-2학기 멀티미디어시스템

8 캐스트/스코어/스크립팅 메타퍼 멀티미디어 제작에서 문자들의 인스턴트화를 나타내는 열 혹은 트랙에서 시간은 스프레드시트의 형태로 수평적으로 보여진다. 문자의 “캐스트”와 “스크립트”에서 도출되는 멀티미디어 요소들은 기본적으로 타이머 이벤트에 의해서 일어나는 이벤트 프로세서 혹은 프로세서이다. 매크로미디어의 디렉터는 이 메터퍼의 중요한 예로써 링고 스크립팅 언어와 객체 지향 그리고 이벤트 유도 언어를 사용한다. 2011-2학기 멀티미디어시스템

9 멀티미디어 프리젠테이션 그래픽 스타일 인간 시각적인 능력은 어떻게 프리젠테이션이 구성되어야 하는가에 영향을 준다.
(a) 컬러 원리와 지침 몇몇의 컬러 도표와 미술 스타일들은 어떤 주제와 스타일에 최적으로 결합된다. 일반적인 힌트는 정신을 혼란하게 할 수 있는 많은 색을 사용하지 않는다. (b) 글자체 효과적이며 시각적인 통신을 위해 프리젠테이션에서 한 스크린(이 스크린보다 작을 경우)에 여섯 줄에서 여덟 줄 이상일 때 큰 글자체(18에서 36포인트)가 최적이다. 그림 2.4는 두 개의 스크린 프로젝션을 비교하고 있다. 2011-2학기 멀티미디어시스템

10 그림 2.4 : 색과 글자체(Ron Vetter 제공)
2011-2학기 멀티미디어시스템

11 (R,G,B) => (1-R, 1-B, 1-G) (2.1)
(c) 컬러 대비 프로그램 만약 텍스트가 삼자극치 (R,G,B)값이라면, 배경에 대해서 읽기 쉬운 컬러는 최대값으로부터 빼지는 컬러에 의해서 주어질 것이다. 어떤 칼라 조합이 다른 것보다 더 만족할만한 것임을 알 수 있다. 예를 들면, 분홍색 배경과 숲의 녹색 전경 혹은 녹색 배경과 연한 자주빛의 전경이다. 그림 2.5는 작업 중에서 한 VB 프로그램(textcolor.exe)을 나타낸다. (R,G,B) => (1-R, 1-B, 1-G)                   (2.1) 2011-2학기 멀티미디어시스템

12 그림 2.5 : 색과 판독성을 조사하기 위한 프로그램 2011-2학기 멀티미디어시스템

13 그림 2.6은 (1-R, 1-G, 1-B)와 동등한 보색을 가진 컬러 휠을 나타낸다.
그림 2.6 : 컬러 휠 2011-2학기 멀티미디어시스템

14 스프라이트 애니메이션 기본적인 아이디어 그림 2.7(a)와 같은 애니메이션 그림을 제작할 때, 그림 2.7(b)와 같이 흰색 바탕에 검은색의 1비트 마스크를 만들고, 그림 2.7(c) 와 같이 스프라이트 S를 수행한다. 그림 2.7 : 스프라이트 제작: 원본, 마스크 이미지 M, 스프라이트 S “Duke” 그림은 선 마이크로 시스템즈에서 제공 2011-2학기 멀티미디어시스템

15 이제 그림 2. 8(a)와 같은 색이 있는 배경에서 스프라이트를 씌울 수 있다
이제 그림 2.8(a)와 같은 색이 있는 배경에서 스프라이트를 씌울 수 있다. 먼저 B와 M을 AND하고 그 결과를 S와 OR하여 그림 2.8(e)의 결과를 얻는다. 그림 2.8 : 스프라이트 애니메이션: (a) 배경 B, (b) 마스크 M, (c) B AND M, (d) Sprite S, (e) B AND M OR S. 2011-2학기 멀티미디어시스템

16 비디오 천이 비디오 천이는 비디오 변화의 신호 많은 다른 형태의 천이 자르기
연속적인 두 개의 비디오 프레임이 경계에서 돌연적인 변화를 수행한다. 이것은 가장 단순하고 많이 사용되는 비디오 천이이다. 2011-2학기 멀티미디어시스템

17 와이프 다른 비디오로부터 시야점 부분의 화소들을 교체한다. 와이프가 왼쪽에서 오른쪽으로, 오른쪽에서 왼쪽으로, 수평, 수직, 홍채가 열리듯이, 시계의 손처럼 쓸리듯이 될 수 있다. 분해 두개의 비디오 시간에 대해서 혼합되어 모든 화소들이 교체되어서 서서히 첫 번째와 두 번째가 바뀌어 진다. 대부분의 분해는 다음과 같이 분류된다: 십자 분해와 떨림 분해 2011-2학기 멀티미디어시스템

18 타입 I : 십자 분해 모든 화소는 서서히 작용한다. 그것은 다음과 같이 정의될 수 있다.
여기서 A와 B는 비디오 A와 B에 대해서 3벡터 컬러 값이다. 또한 는 천이 함수이고, 시간에 선형적이다. (2.2) (2.3) 2011-2학기 멀티미디어시스템

19 타입 II : 떨림 분해 비디오 A에서 에 의해 결정된 많은 화소들이 갑자기(타입 I 에서와 같이 서서히가 아니라) 비디오 B로 천이하는 것이다. 2011-2학기 멀티미디어시스템

20 페이드 인과 페이드 아웃은 비디오 A혹은 B가 검정색(혹은 흰색)에서 타입 I 분해의 특별한 형태이다.
자신만의 천이 형태 구성 다른 비디오 슬라이드가 미끄러지면서 교체되는 사이에 하나의 비디오가 미끄러지는 특별한 형태의 와이프를 구성하길 원한다고 가정한다. 와이프와 달리 우리는 그 자리에서 유효하지 않는 각 비디오 프레임을 원하지만, 대신에 시야점 안으로(밖으로) 멀리서 전진하여 움직이기를 원한다. 비디오L이 왼쪽으로부터 미끄러지고 오른쪽으로 비디오R이 밀려내길 원한다. 그림 2.9는 이 과정을 보여준다. 그림 2.9 : (a) 비디오L, (b) 비디오R, (c) 비디오L이 위치가 미끄러지면서 비디오R을 밀어낸다. 2011-2학기 멀티미디어시스템

21 슬라이드 천이(계속) 시간이 지남에 따라 천이 경계에 대해서 수평적 위치인 는 에서부터 에 선형적이다. 그래서 천이에 대해서 시간 에 선형적이다. 어떤 시간 t에 대해서 그림 2.10(a)는 그 상황을 보여주고 있다. 우리가 사용하는 비디오 신호에서와 같이 y를 사용하면서 y에 의존적이라고 가정하자.그리고 나서 적색 채널에 대해서(그리고 녹색과 푸른색 채널에 대해서 동일하게) 2011-2학기 멀티미디어시스템

22 화소들이 비디오 L로부터 와야 한다는 것을 결정한다고 가정하자. 그러면 움직임이 없는 비디오에서 위치 은 이 되어야 한다
그림 2.10(b)로부터 우리는 비디오L의 좌표계 시스템에서 거리 의 합으로서 시야점에서 을 계산할 수 있고 또한 차 를 계산할 수 있다. 2011-2학기 멀티미디어시스템

23 그림 2.10 : (a) 비디오L이 비디오R을 밀어내는 기하학; (b) 시야점에 복사되는 화소들로부터 비디오L에서 위치를 계산하는 것
2011-2학기 멀티미디어시스템

24 슬라이드 천이(계속) 천이는 시간 를 가지고 선형적으로 움직인다는 사실을 대신한다. 그림 2.11은 가상 코드를 보여준다.
천이는 시간 를 가지고 선형적으로 움직인다는 사실을 대신한다. 그림 2.11은 가상 코드를 보여준다. 그림 2.11: 슬라이드 비디오 천이를 위한 가상 코드 2011-2학기 멀티미디어시스템

25 몇 가지 기술적인 디자인 이슈 컴퓨터 플랫폼 비디오 형태와 해상도 메모리와 디스크 형태 공간 요구
대량의 소프트웨어는 표면상으로는 이식 가능하지만, 많은 교차 플랫폼 소프트웨어들은 시스템 간의 상호 작동이 잘 안 되는 모듈이 실행 시간에 응답한다. 비디오 형태와 해상도 가장 인기 있는 비디오 형태는 NTSC, PAL, SECAM이다. 그들은 상호 보완적이지 않고, 비디오 작동을 위해서는 다른 형태로 변환이 필요하다. 메모리와 디스크 형태 공간 요구 성능을 수행과 멀티미디어 저장을 위해서 적어도 128메가 램과 20 기가바이트 하드 디스크의 공간을 필요로 한다. 2011-2학기 멀티미디어시스템

26 전달 방법들 DVD CD-ROM 멀티미디어 프리젠테이션을 저장하기에 충분하지는 않다. 또한 시디롬 드라이버 접속 시간이 하드 디스크 드라이브보다 더 오래 걸린다. 전자 전달은 추가 선택이다. 이것은 사용자의(그리고 서버의) 입장에서 네트워크 대역폭에 의존한다. 스트리밍 옵션은 이용 가능할 것이고 프리젠테이션에 의존한다. 2011-2학기 멀티미디어시스템

27 자동화 저작화 하이퍼미디어 문서: 일반적으로 세 단계 멀티미디어 캡쳐 저작화 출판
문장이나 혹은 오디오 디지타이저를 사용하거나 비디오 프레임 그레이버를 사용하는 것으로 고도로 발달되었고 자동화되어 있다. 저작화 사용 가능한 멀티미디어 접근과 조작을 지원하기 위해서 정보를 구성하기를 원한다. 출판 예를 들어 프리젠테이션은 우리가 고려해 온 멀티미디어 툴의 목적이다. 2011-2학기 멀티미디어시스템

28 구체화 대 선형화 그림 2.12는 하이퍼미디어 메커니즘을 사용하지 않고 아이디어를 통신하는 것을 포함하는 본질적인 문제를 보여준다. 반대로 하이퍼 링크는 저자의 생각 과정을 부분적으로 모방하는 자유를 우리에게 허용한다.(즉, 구체화) 예를 들면, 마이크로 소프트 워드는 장과 제목 등에서 이미 설정된 레이아웃을 단순히 따른다. 그러나, 우리가 의미론상의 문맥을 추출하고 링크와 최종 목표를 찾고 심지어 그림이 아닌 단순한 문장을 고려하고자 할 때 문제가 발생한다. 그림 2.13은 그 문제를 나타낸다. 2011-2학기 멀티미디어시스템

29 그림 2.12 : 하이퍼링크를 이용한 통신. (David Lowe 제공)
2011-2학기 멀티미디어시스템

30 그림 2.13 : 복잡한 정보 공간(David Lowe 제공)
일단 데이터 집합이 커지면 데이터베이스 방법을 찾아야 한다. 그 문제는 축소성(큰 데이터 집합에 대해), 지속성, 물질적 부가와 재사용에 초점이 맞추어진다. 그림 2.13 : 복잡한 정보 공간(David Lowe 제공) 2011-2학기 멀티미디어시스템

31 그림 2.14 : 하이퍼텍스트에서 노드와 앵커(David Lowe 제공)
하이퍼텍스트의 반자동화 이동 텍스트 정보에 대해서 하이퍼링크의 구조는 단순하다. “노드”는 의미론적인 정보와 다른 페이지들에 링크를 위한 앵커로 나타난다. 그림 2.14 : 하이퍼텍스트에서 노드와 앵커(David Lowe 제공) 2011-2학기 멀티미디어시스템

32 하이퍼이미지 우리는 진정한 하이퍼 미디어를 생산하는데 도움을 주는 자동화된 방법을 필요로 한다.
그림 2.15 : 하이퍼미디어의 구조 (David Lowe 제공) 2011-2학기 멀티미디어시스템

33 그림 2.16 : 하이퍼이미지 (David Lowe 제공)
하이퍼이미지는 이미지 영역을 구획화함으로써 구문론적인 이미지 요소들을 수동적으로 윤곽을 그릴 수 있다. 그림 2.16은 동일화된 이미지 영역과 자동적으로 문서의 다른 부분들을 연결한 “하이퍼이미지”를 나타낸다. 그림 2.16 : 하이퍼이미지 (David Lowe 제공) 2011-2학기 멀티미디어시스템

34 2.2 몇몇의 유용한 편집기와 저작툴 우리는 지탱하는 원리를 보이고 멀티미디어 제작을 위한 수단이 필요하다. 그리고 C++ 혹은 자바에서 올바른 프로그래밍이 항상 지식을 보여주는 가장 최선의 방법은 아니다. 몇 가지 인기 있는 저작 툴은 다음과 같다. 아도비 프리미어 6 매크로미디어 디렉터 8과 MX 플래쉬 5 MX 드림위버 MX 2011-2학기 멀티미디어시스템

35 2.2.1 아도비 프리미어 2.2.2 매크로미디어 디렉터 2.2.3 매크로미디어 플래쉬 2.2.4 드림위버 2011-2학기
멀티미디어시스템

36 2.3 VRML(가상 현실 모델링 언어) 요약 VRML은 인터넷에서 보여질 수 있도록 플랫폼 독립적인 언어로써 첫 세계적인 월드 와이드 웹의 학회에서 고안되었다. VRML의 목적은 3D 환경에서 물체에 대한 색을 줄 수 있는 능력을 가지는 것이다. VRML은 번역된 언어이다. 그러나 월드 와이드 웹에서 3D 세계를 표현 가능하게 하는 첫 번째 방법이기 때문에 아주 영향력이 있다. 2011-2학기 멀티미디어시스템

37 VRML의 역사 VRML 1.0은 1995년 5월에 제작되었다. 1996년 1월에는 VRML 1.0C라 불리는 해설 버전을 포함한다. VRML은 실리콘 그래픽이라는 회사에 의해서 만들어진 파일 개발 형태의 집합에 기반 한다. VRML 1.0은 입방체나 구 혹은 사용자 정의의 다면체 등의 많은 단순한 3D 물체를 제작할 수 있게 한다. 좀더 현실적인 물체를 만들기 위하여 재료나 질감은 물체에 따라 상세화 할 수 있다. 2011-2학기 멀티미디어시스템

38 VRML의 최근 버전은 VRML97로서 ISO에 표준화된 VRML 2.0이다.
새로운 물체는 가상 세계에서 더 쉽게 창조되는 것이 추가되었다. 자바와 자바 스크립트는 상호 작용하는 물체나 사용자 정의의 행동들을 허락하기 위해서 예전부터 VRML을 포함하고 있다. VRML2.0은 VRML1.0과 많은 변화를 가지고 있고 이 두 가지 버전은 서로 호환되지 않는다. 그러나 유틸리티들은 VRML1.0에서 VRML2.0으로 바꾸어서 사용할 수 있다. 2011-2학기 멀티미디어시스템

39 VRML 모양 VRML은 더 복잡한 물체를 만들기 위하여 조합될 수 있는 기본적인 기하학적 모양을 포함한다. 그림 2.28은 몇 개의 이들 모양들을 보여준다. 모양들은 VRML에서 모든 물체에 대하여 일반적인 노드들이다. 재료노드는 물체의 표면 성질을 상세화 한다. 이것은 물체에 빨강과 녹색과 파란색에 대한 값을 상세화 함으로서 물체를 어떤 색으로 조절할 수 있다. 그림 2.28 : 기본적인 VRML 모양들 2011-2학기 멀티미디어시스템

40 세 가지 종류의 질감 노드는 어떤 물체에 질감을 사상하는 데 사용될 수 있다.
이미지텍스쳐 가장 일반적인 방법으로 외형적인 JPEG와 PNG 이미지 파일을 가져와서 그 모양에 색을 사상하는 것이다. 무비텍스쳐 물체에 MPEG 영화를 사상하는 것을 허용한다. 화소텍스쳐 간단히 이미지텍스쳐 VRML 을 이용하여 이미지를 제작하는 것을 의미한다. 2011-2학기 멀티미디어시스템

41 VRML 세계 그림 2.29는 하나의 시야로부터 간단한 VRML 스크린을 나타낸다. 예제 Demo
시야점은 위치 노드로 상세화될 수 있고, 원점 노드를 기본 시야로부터 회전할 수 있다. 또한 시야의 영역에 대한 카메라의 각도는 시야 영역 노드로부터 기본값 0.78 라디안으로 변경될 수 있다. 시야 영역의 변화는 전송사진 효과로 제작할 수 있다. 예제 Demo 2011-2학기 멀티미디어시스템

42 그림 2.29 : 단순한 VRML 영상 2011-2학기 멀티미디어시스템

43 VRML 세계의 배경은 배경 노드를 사용함으로써 상세화 할 수 있다.
방향성 광원 어떤 방향에서 전체 세계를 가로질러 빛을 비춘다. 점 광원 공간에 어떤 지점으로부터 모든 방향으로 빛을 비춘다. 조사등 한 지점으로부터 특정 방향으로 빛을 비춘다. VRML 세계의 배경은 배경 노드를 사용함으로써 상세화 할 수 있다. 파노라마 노드는 세계의 측면을 질감으로 사상할 수 있다. 파노라마는 VRML 세계를 둘러싸고 있는 큰 체적에 사상 될 수 있다. 2011-2학기 멀티미디어시스템

44 애니메이션과 상호작용 VRML에서 애니메이션의 한 가지 방법은 인터폴레이터 노드에서 상세화 된 물체를 천천히 변화시킴으로써 행해질 수 있는 트위닝이다. 이 노드는 6개의 인터폴레이터를 기반으로 하여 시간에 대해서 물체를 수정할 것이다: 색, 좌표, 법선, 원점, 위치, 스칼라 모든 인터폴레이터는 두개의 노드를 가지고 있고, 상세화 되어야 한다: 키와 키값. 모든 키는 0으로 시작해서 1로 끝나는 둘이나 그 이상의 수의 목록으로 구성되고 애니메이션의 거리를 정의한다. 모든 키 요소는 키값 요소로 보완되어져야 하고 어떤 값이 변화했는지 정의한다. 2011-2학기 멀티미디어시스템

45 애니메이션에 시간을 부여하기 위해서 타임 센서 노드가 사용된다.
타임센서는 VRML 세계에서 어떤 물리적인 형태가 아니고 단지 시간을 유지시키는 것이다. 시간 변화의 인터폴레이터를 알기 위해서 통로는 두 가지 노드를 연결하기 위해서 필요하다. 대부분의 애니메이션은 인터폴레이터 노드에 타임센서를 연결시키기 위한 방법을 통해 이루어질 수 있고 그리고 나서 물체에 인터폴레이터 노드는 애니메이션화 된다. 센서의 두 가지 부류는 VRML에서 사용자로부터 입력을 얻기 위해 사용될 수 있다. 환경센서 세 가지 종류의 환경 센서: 시각 센서, 근접 센서, 충돌 고안물을 가리키는 순서: 터치 센서, 드래그 센서 2011-2학기 멀티미디어시스템

46 VRML 명세 VRML 명세: VRML 파일은 .wrl 확장자를 가진 단순한 텍스트 파일이다.
VRML97은 파일의 첫 번째 라인에 #VRML V2.0 UTF8을 포함하고, VRML 파일의 첫 번째 라인은 VRML이 어떤 버전을 사용하는지 VRML 사용자에게 알려준다. VRML 노드는 상황에 민감하고 보통 계층적으로 이루어진다. 모든 노드는 “{”로 시작하고 “}”로 마치며, 대부분은 노드 내부에 노드를 포함할 수 있다. 그룹 노드라고 불리는 특별한 노드는 다양한 노드들로 군집을 이룰 수 있다. ,children 이라는 키워드는 “[”로 시작하고 “]”로 끝내는 children 노드의 목록에 의해서 이어진다. 2011-2학기 멀티미디어시스템

47 VRML에서 간단한 상자를 제작하기 위해 다음을 이용함으로써 수행할 수 있다.
노드는 DEF를 사용하여 명명될 수 있고 USE 키워드를 사용함으로써 후에 다시 사용될 수 있다. 이것은 많은 단순한 물체를 사용함으로써 복잡한 물체를 제작하는 것을 허용한다. VRML에서 간단한 상자를 제작하기 위해 다음을 이용함으로써 수행할 수 있다. Shape { Geometry Box{} } 상자는 스크린의 중심에서 2 미터 거리의 입방체가 기본이다. 변형 노드에 그것을 놓음으로써 스크린의 다른 부분으로 이 상자를 움직일 수 있다. 우리는 또한 다음과 같이 붉은색인 다른 색을 상자에 줄 수 있다. 2011-2학기 멀티미디어시스템

48 Transform { translation children [ Shape { Geometry Box{} appearance Appearance { material Material { diffuseColor } ]} 2011-2학기 멀티미디어시스템