2013 1 kgit x-programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... ·...

36
2013학년도 1학기 KGIT X-Program 실적보고서 VVVV활용한 프로젝션 맵핑 어플리케이션 미디어 아트 작품 제작/전시 task1 * 프로젝션맵핑 관련 작품 사례 연구 * VVVV 개발 환경 파악 프로그래밍 (영상 제어 중심) * VVVV대한 공개 세미나 *프로젝션맵핑 작품 제작 기획 전시 한독미디어대학원대학교 뉴미디어학부

Upload: hoangdung

Post on 13-Feb-2018

231 views

Category:

Documents


10 download

TRANSCRIPT

Page 1: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

2013학년도 1학기

KGIT X-Program 실적보고서

VVVV를 활용한 프로젝션 맵핑 어플리케이션 및 미디어 아트 작품

제작/전시

task1

* 프로젝션맵핑 관련 작품 사례 연구

* VVVV 개발 환경 파악 및 프로그래밍 (영상 제어 중심)

* VVVV에 대한 공개 세미나

*프로젝션맵핑 작품 제작 기획 및 전시

한독미디어대학원대학교

뉴미디어학부

양 연 희

Page 2: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

백 지 간 지

Page 3: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

VVVV를 활용한 프로젝션 맵핑 어플리케이션 및 미디어 아트 작품

제작/전시

task1

* 프로젝션맵핑 관련 작품 사례 연구

* VVVV 개발 환경 파악 및 프로그래밍 (영상 제어 중심)

* VVVV에 대한 공개 세미나

*프로젝션맵핑 작품 제작 기획 및 전시

지도교수 김 현 주

2013년 6월

한독미디어대학원대학교

뉴미디어학부

양 연 희

Page 4: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

목 차

제 1 장 개 요

1.1 연구 배경 및 목적

1.2 연구 배내용 및 범위

제 2 장 VVVV 프로젝션 맵핑 사례연구

2.1 프로젝션 맵핑의 정의

2.2 프로젝션 맵핑 사례연구

제 3 장 프로젝션맵핑의 도구로서의 VVVV

3.1 프로젝션을 위한 방법론과 도구

3.2 VVVV 소프트웨어 소개 및 차별성

제 4 장 작품 제작 기획 및 전시

4.1. 작품 의도 및 목표

4. 2 작품 타이틀 및 컨셉

4.3 작품 구성

제 5 장 VVVV 공개 세미나

5.1 주제 선정 및 진행과정

5.2 성과 및 향후 방안

5.3 진행과정

5.4 오픈 VVVV 스터디 참가

제 6 장 결론 및 향후 연구

6.1 활용 분야 및 방안

6.2 결론

별첨

Page 5: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

국문초록

VVVV를 활용한 프로젝션 맵핑 어플리케이션 및 미디어 아트 작품 제작/전시

뉴미디어학부 양연희

지 도 교 수 김현주

Page 6: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

제 1 장 개 요

1.1 연구 배경 및 목적

본 연구를 통해 오늘날 미디어아트의 전시와 상업적 활용에 많이 등장하는

프로젝션맵핑을 통한 미디어아트 작품의 제작과 전시를 진행하였다. 이를 위해서

국내에는 보편화되어 있지 않은 다기능 멀티미디어 툴이자 visual programming 기반의

프로그랭 언어인 VVVV 프로그램을 활용하였다. 이러한 결과물을 바탕으로 vvvv

프로그램의 대중화 및 새로운 프로그램에 관한 연구 기반을 마련하며, 본 연구의

결과물로써 프로젝션 맵핑 작품 및 도큐멘테이션 제작, vvvv의 맵핑 시스템의 체계를

익히도록 한다.

향후 맵핑에 대한 개발 VVVV 프로토타입 마련 및 사례구축으로 향후의 미디어아트

연구와 교육의 차별화된 KGIT의 기반 마련을 목적으로 한다.

1.2 연구 내용 및 범위

VVVV는 국내에는 아직 알려져 있지 않은 프로그램으로써, 정보 공유를 위해 연구할

필요성이 있다. 이 프로그램의 다양한 기능 중에서도 프로젝트 진행을 위한 프로젝션

맵핑 관련 프로그래밍 습득과 좀 더 심화하여 키넥트와 아두이노를 활용한 센서

연동까지 포함하도록 한다. 또한 세미나를 진행함으로써 습득한 기술을 공유하는 시간을

가지도록 한다.

제 2 장 프로젝션 맵핑 사례연구

2.1 프로젝션 맵핑의 정의

건물이나 벽과 같은 공간이나, 실내에 전시될 수 있는 오브제 등 투영가능한 재질로

이루어진 물리적인 사물에 빔을 활용하여 가상적인 환영을 드러내는 작업을 프로젝션

맵핑이라 정의할 수 있다. 또한 실제 환경이 보이는 상태에서 가상의 객체가 혼합된

형태를 띔으로써, 증강현실로 분류되기도 한다.

Page 7: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

즉, 현실에 부재하는 속성을 가상 현실을 통해서 현실 사물에 내재시킴으로써

비현실적인 가상의 공간을 보여준다.

완전한 가상세계를 전제로 하는 가상현실과는 달리 현실세계의 환경 위에 가상의

대상을 결합하면 현실의 효과는 더욱 증가한다. 물리적 공간의 성격 자체가 변화하게

된다.

이러한 특징 때문에 단순히 게임과 같은 분야에만 적용 가능한 기존 가상 현실과

달리 현실 환경에 응용이 가능하다. 유비쿼터스 환경에 적합한 미래의 광고나 대규모

프로젝트, 페스티벌에서도 자주 활용되곤 한다. 1

2.2 프로젝션 맵핑 사례 연구

3월 한달간 프로젝트 진행을 위하여 YOUTUBE 및, VIMEO, 맵핑 페스티벌 사이트등을

조사하여 사례 분석 및 체계화하였다. 분류기준은 실외 작품과 실내 작품으로 하였다.

*OUTDOOR 사례 모음

표 1 프로젝션 맵핑 OUTDOOR 사례모음

제목 사이트 링크

도 장소 활용

간/

Mikser Design Expo 2010

http://www.youtube.com/watch?v=C

KAlgMalBl8&feature=youtu.be

20

10

유고슬라비아

/베오그라드

맵핑

프로젝

합 1

Projection Mapping Fashion Show http://www.youtube.com/watch?v=Jn

c8c1dbPws&feature=youtu.be

20

11

인도/Seacon

Bangkae 패션쇼

합 2

3D Projection Mapping "Spaskya Bashnya"

2010 full version

http://www.youtube.com/watch?v=Uc

2RLqbtd0c&feature=youtu.be

20

10 인도?

맵핑

프로젝

3D 3

3D projection mapping in Sydney http://www.youtube.com/watch?v=6

GcighIL9w0&feature=youtu.be

20

11 미국/시드니

맵핑

프로젝

3D 4

DUNLOP 3D PROJECTION MAPPING [TOKYO

AUTO SALON 2013]

http://www.youtube.com/watch?v=dy

I0suoRRrk&feature=youtu.be

20

13 일본/도쿄 광고

합 5

Projection Mapping http://www.youtube.com/watch?v=8g

DYAT0zHDA&feature=youtu.be

20

12

MAAC JM

Road

students

맵핑

프로젝

2D 6

덕수궁 프로젝트 http://www.youtube.com/watch?v=T

WxF1HJG9sA&feature=youtu.be

20

12 한국/서울

맵핑

프로젝

3D 7

* Castle Tsurugajo Projection mapping

"Haruka"

http://www.youtube.com/watch?v=U

E0mAOZT1Ts&feature=youtu.be

20

13

일본/아이즈

와카마츠

맵핑

프로젝

합 8

0.22

9167

1 위키피디아 증강 현실 부문을 참조하여 작성.

Page 8: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

MSU Mapping http://vimeo.com/8221862

20

10

크로아티아/

자그래브 미술관 3D 9

* Apparati Effimeri Dunhill Parhelic 3d

architectural mapping

http://www.youtube.com/watch?v=KK

HIUc1queA&feature=youtu.be

20

10

중국/홍콩

프린스 빌딩 광고 3D 10

Hugo Boss McLaren 3D Projection Mapping

Roberto Fazio

http://www.youtube.com/watch?v=e8

tbwEFQmR4

20

11

이탈리아/밀

라노 광고 3D 11

QUADRATURE http://vimeo.com/5756657

20

10

터키/이스탄

불 미술관 3D 12

* Adidas Pharo Extrait - Superbien - WIZZprod° http://www.youtube.com/watch?v=Ql

bnxug4kVE

20

11 프랑스 광고

합 13

* 3D-Projektion-Tanzperformance-Eventprodu

ktion

http://www.youtube.com/watch?v=p

DBh4hF6p1A&feature=share

20

11 독일 연극

합 14

ntel 3D Projection Mapping Show Live in

Munich 20-07-12---

http://www.youtube.com/watch?v=SK

Al26WVjgQ&feature=share

20

12 독일/뮌헨

맵핑

프로젝

합 15

BMW 3 Series Launch Projection Mapping .:.

Experiential Design Lab

http://www.youtube.com/watch?v=du

Qc9VQI324&feature=share

20

12 인도/뭄바이 광고

합 16

CGI VFX Projection Mapping HD: "El masnou'

by AndVFX

http://www.youtube.com/watch?v=H

6A3_zDyGig&feature=share

20

12 스페인?

맵핑

프로젝

3D 17

Hyundai Genesis Launch Show http://www.youtube.com/watch?v=Xu

feg89I5e0&feature=share

20

08 미국/LA 광고 2D 18

* projection mapping (nike airmax) http://www.youtube.com/watch?v=0L

h4OaaYu9E&feature=share

20

11 한국/부산 광고 2D 19

Ferrari FF 3D Projection Car Mapping http://www.youtube.com/watch?v=i6

RuQbOGz-Q&feature=share

20

11 미국? 광고 3D 20

* 3D Projection Mapping promoting The

Tourist in Dallas

http://www.youtube.com/watch?v=XS

R0Xady02o&feature=share

20

10 미국/델러스 광고

합 21

3D Projection Mapping - TheTaekwon V http://www.youtube.com/watch?v=I1

p_c3S1VNM&feature=share

20

12 한국/서울

맵핑

프로젝

3D 22

China-top 3d Projection Mapping,3d outdoor

stereographic projection,4d tra

http://www.youtube.com/watch?v=Fg

V2Sllft6Q&feature=share

20

11 중국

맵핑

프로젝

합 23

TOKYO STATION VISION - 3D PROJECTION

MAPPING

http://www.youtube.com/watch?v=m

_BtfRHmL58&feature=share

20

12 일본/도쿄

맵핑

프로젝

합 24

* TOKYO STATION VISION

東京駅プロジェクションマッピング

http://www.youtube.com/watch?v=x

Hsbdq8GtKc&feature=share

20

12 일본/도쿄

맵핑

프로젝

합 25

Ralph Lauren London 4D http://www.youtube.com/watch?v=H

4JYpF5DpFo&feature=share

20

10 영국/런던 광고

합 26

3D mapping Presentacion de producto -

Nokia Lumia Live ft deadmau5 ligh

http://www.youtube.com/watch?v=vV

3wyhLoGvg&feature=share

20

11 영국/런던 광고

합 27

* PROJECTION MAPPING BY DO HO SUH AT

LEEUM MUSEUM IN SEOUL

http://www.youtube.com/watch?v=bu

GtL9GJc74

20

12 한국/서울 작품 2D 28

0.04

1667

The 64th Sapporo Snow Festival, Anime by

Projection mapping

http://www.youtube.com/watch?v=co

Cm2XybA6I

20

13 일본/삿포로

맵핑

프로젝

합 29

* Projection Mapping from CHION-IN / KYOTO http://www.youtube.com/watch?v=j9i

crvhqISg

20

12 일본/치온인

맵핑

프로젝

합 30 0.5

Page 9: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

*OUTDOOR 사례 세부 모음

*Tiffany & Co. 글로벌쇼 (2010, Beijing)

제작 : D'STRICT / 제작년도 : 2010년 / 전시장소 : 중국_베이징

http://www.youtube.com/watch?feature=player_embedded&v=sAl8UpCpeuw

*Sheikh Zayed Grand Mosque Projections

제작 : Obscura / 제작년도 : 2012년 / 전시장소 :Sheikh Zayed Grand Mosque, Abu Dhabi,

United Arab Emirate

http://www.obscuradigital.com/work/detail/uae-national-day-celebration/

*600 YEARS OF PRAGUE CLOCK TOWER

제작 : The Tomato Production / 제작년도 : 2010년 / 전시장소 : Prague

http://www.tomatoproduction.cz/600-years-of-prague-clock-tower/

*TOFIDI #1

제작 : nyx visual / 제작년도 : 2012년

http://www.nyxvisual.com/PORTFOLIO/Tofidi/Tofidi.html

*The Hunter (Theatrical Installation)

제작 : Fred Penelle & Legoman / 제작년도 : 2012 / 전시장소 :The Oxford Samuel Beckett

Theatre Trust Award

http://vimeo.com/52230740

*Human Face Video Mapping by Oskar & Gaspar. Making of.

제작 : Excentric / 전시장소 : backstage from the video " Explore your dual world"

http://vimeo.com/39697056

*spider projection

제작 : / 제작년도 : 2012년 / 전시장소 : Saarbruecken, Germany

http://www.youtube.com/watch?v=zMemPwDotu4

Page 10: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

*INDOOR 사례 모음

표 2 프로젝션 맵핑 INDOOR 사례 모음

제목 링크 특이점

1 A Golden Clock http://vimeo.com/35320241

2 Sinaia Casino http://vimeo.com/58059563

3 O (Omicron) http://vimeo.com/41486619

4 Demo 2012 - Mapping 3d

_ Motion & Vjing http://www.youtube.com/watch?v=m0G5z25PUeg

5

Making Of Explore Your

Dual World - Human Face

Video Mapping

Oskar & Gaspar

http://www.youtube.com/watch?v=9nK9fKFee0w 인체 맵핑

6 360° 3D Mapping

Projection with Rabarama http://www.youtube.com/watch?v=OZfTKSmPxxA 인체 맵핑

7 Illuminated Apparel http://vimeo.com/20874821

8 Nosaj-Thing Eclipse Blue http://www.youtube.com/watch?v=_woNBiIyOKI

9 IDOMENEO - operatic

staging http://vimeo.com/26424213

오페라 공연

: 설치물에 3d

프로젝션맵핑을

하여

공간의 확장을

시도

10

多媒体京剧表演-大闹天宫

http://vimeo.com/43467406

이야기와 움직임,

배경을 구성하는

요소로 적극 활용

11 Nike Hyper Elite Platinum

http://tomorrowawards.com/showcase/816/

12

Zentrale - Projection

Mapping By Johannes

LDC Guerreiro

http://videomapping.tumblr.com/post/4178228959/

01-zentrale-projection-mappingby-johannes-ldc

13

SEAT IBIZA

http://vimeo.com/17766541

Page 11: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

14

PORCELANA

INNOVADORA

http://vimeo.com/51044525

조형물+패턴형태의

결합

15 Mecaniques Discursives at

Scopitone Festival 2012 http://vimeo.com/49067021

피지컬한 조형과

프로젝션맵핑의

결합

16 김치앤칩슨_

Lit Tree

http://vimeo.com/24049819

관객과의

상호작용을 통한

프로젝션맵핑

17

Mr.Beam - Living Room

Projection

http://vimeo.com/18460233

18

Psycho - Homage to

Hitchcock

http://vimeo.com/52109559

미리 촬영한

그림자영상을

종이로 만들어진

무대에 쏘아

현실과 가상의

경계가

모호해짐으로

독특한 분위기

형성

Page 12: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

제 3 장 프로젝션맵핑의 도구로서의 VVVV

3.1 프로젝션을 위한 방법론과 도구

프로젝션 맵핑을 하기 위한 소프트 웨어와 하드웨어의 종류는 다음과 같다.

표 3 프로젝션 맵핑을 위한 소프트 웨어 및 하드 웨어의 종류2

소프트웨어 Arkaos VJ, Cell, CoGe, ISADORA, Jitter, LiviUnion, Modul8, Motion

Dive, Tokyo(MD4), openTZT(근래에 들어 개발 중단), ProVIdeo

Player, Resolume, Touch Designer, VDMX5

하드웨어 Source players, video switchers, scan converters, 캠코더, Midi

controllers, EFFECT Hardwares

위의 프로그램들 중에서는 리서치를 통해서는 어떤 기반인지 확인조차 안되는

프로그램들이 있고 개발이 중단되거나 사용되지 않는 소프트웨어도 있다. PC기반의

Resolume과 연동되는 몇 가지를 제외하면 대부분은 맥 OS 기반의 프로그램이다.

3.2 VVVV 소프트웨어 소개 및 차별성

2 박규황_과학기술과 현대사조 10조내 강의 참조. http://cafe.naver.com/rgrtrgetg/80

그림 1 vvvv

Page 13: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

그림 2 simulink 그림 3 max msp

vvvv 프로그램은 그래픽 프로그래밍언어로 제공된다. 즉 코드를 그래픽화시킨 것이라

볼 수 있다. Max msp나 simulink와 같은 프로그램과 상이하다. 즉, 인풋과 아웃풋으로

나누어져 있고, 어떠한 값을 받으면 이것을 처리한 결과 값을 아웃풋으로 내보내는

시스템을 가지고 있다.

(그림 2, 3 참조)

vvvv는 다이렉트 x 기반의 윈도우즈용 소프트웨어이며, 개별동작 및 기능은 노드

(nodes)로 표시한다. 노드와 노드는 각각의 핀을 선으로 연결할 수 있는데 이 선이

데이터가 움직이는 경로이다. 그리고 각 노드의 성격에 따라 연결할 수 있는 핀이

나누어져있다. 특정 노드의 아웃풋 핀을 다른 노드의 인 풋에 끌어왔을 때 핀이

도드라지면 연결이 가능하다는 의미이다.

vvvv는 타 소프트웨어에 비해 두드러지는 장점이 몇 가지가 있다. 첫 번째, 조작

화면이 미니멀하다. 두 번째, 마우스로 모든 것을 제어할 수 있다. 실시간 랜더링이

가능하다. 특히 키넥트와 아두이노 등 여타의 다른 센서와의 연결이 용이하여

인터랙티브 미디어 작업에 유리하는 것을 들 수 있다.3

다만, vvvv는 프로젝션 맵핑에 특화된 프로그램이라기보다는 다양한 미디어 작업이

가능한 다기능 멀티미디어 툴 킷이라고 볼 수 있다. VVVV는 특히 곡선 맵핑에 있어서

취약한 면이 있는데 곡선 맵핑을 보다 효율적으로 처리하기 위해 Resolme 으로

불러들여서 작업하는 다음과 같은 방법이 있다.

3 vvvv공식 홈페이지 http:// vvvv.org 와 본인의 연구 결과를 참조하여 작성

Page 14: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

DirectX-Freeframe GL Bridge(vvvv to resolume4)4

dx9ex 모드로 vvvv를 시동

dx9ex 모드로 vvvv를 시동해야 한다. 명령 프롬포트에서 위와 같이 입력한다.

또는 dx9ex instance.bat를 vvvv의 폴더에 넣고 실행하는 방법이 있다.

C\vvvv_45beta29.2_x86\Contributions\modules 에 넣어둔

ShareTextureInfo (OpenGl, Interop) help.v4p 를 실행한다.

* 주의할점: Dx9Texture를 Inspektor에서 확인하면, 현재는 A8R8G8B8 포맷으로만 가능.

dx9ex 텍스쳐를 레졸름에서 불러들인다.

4 Open vvvv 카페 참조 http://cafe.naver.com/vvvvon

그림 4 vvvv를 dx9ex 모드에서 사용하기 위한 설정 변경

그림 5 VVVVV를 시동함 그림 6 Resolme 에서 불러들임

Page 15: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

제 4 장 작품 제작 기획 및 전시

4.1. 작품 의도 및 목표

본 프로젝트는 VVVV 활용한 포로젝션 맵핑에 중점을 둔 작품 및 영상 제작을 위해

구상하였다.

프로젝션 맵핑을 활용한 작품은 그 특징인 실제성과 가상성의 결합을 통해

현실속에서 환상을 경험하게 한다. 주로 미디어 파사드로써, 건축물의 내외벽이나

실제하는 사물에 프로젝션 맵핑하는 것부터 설치물을 만들거나 사람의 몸에

맵핑하는 등 여러가지 형식 실험이 시도되고 있으며, 센서나 다른 미디어와의 연동을

통해 인터랙티브한 작업도 가능하다 .

이번 맵핑 프로젝트는 여러 특징들 가운데 본래의 확대와 축소를 통한 가상성을

표현하는 것에 집중했으며 실내라는 전시 환경을 살려 인도어 작품으로 구상하였다.

더불어 키넥트등 인터랙티브를 포함할 수 있는 미디어도 같이 염두에 두었다.

4. 2 작품 타이틀 및 컨셉

타이틀- 그녀들 이야기

평소라며 지나쳤을 우리들의 일상 생활 곳곳에 ‘작은 사람들’이 살 것을 가정하여

무빙이미지로 만든다. 그리고 실루엣 제작을 위해 각각 필요한 움직임들을 촬영해

크로마키 작업을 진행하는 한 편. 또한 “작은 사람”의 이야기를 표현할 모션그래픽을

기획했다.

4.3 작품 구성도

작품 실루엣 촬영 후 애프터 이펙트를 통해 alpha 값을 가진 영상을 랜더링 하여

추출한다. 약 16개의 영상이 아웃풋으로 마련되었고, vvvv 프로젝션 패치를 만들어

프로그래밍을 완료하였다. 프로젝터와 컴퓨터를 연결하여 랜더링 창을 책장에

맵핑시킨다.

Page 16: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

4.4 작품 진행 과정

작품은 아래와 같은 과정을 통해 진행되었다.

가. 기획서 초안 작성

그림 9 기획서 초안 작성 진행 임지

폐쇄된 어두운 공간 안을 활용하며 관객과의 소통을 위한 인터랙티비한 작업등

다양한 방면에서 의논했다. 본인은 특히 왜 이러한 작품을 만드는지에 대한 개념이

중요하다고 여겼다. 처음에는 센서를 활용한 <관계>에 대해 이어갔지만 몇 번의 수정을

거쳐, 일상의 오브제를 채택하고 작은 사람들의 이야기로 주제를 잡았다.

VVVV 노드 프로그래밍

작품을 위한 실루엣 영상 16개

빔 프로젝터

컴퓨터

책장 및 오브젝트

그림 7 작품 구성도

작품기획 영상 촬영 VVVV 노드 작성

키네틱 패치 설

치& 테스트

그림 8 Work flow

Page 17: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

나. 작품 제작 과정들

일상의 시간들에서 작품 컨셉에 맞추어 주변에서 흔히 볼 수 있는 오브제들을

채택했다. 맵핑이 가능하도록 책장과 오브제들에 흰색 페인트칠을 했다.

그림 10 오브제 페인트 칠 진행

그림 11 완성된 모습

그림 12 크로마키를 위한 설치 작업

Page 18: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

다. 맵핑용 영상제작

기획 이후 소스 제작을 위해 촬영 준비에 들어갔다. 303호 확장미디어 랩실에 초록색

천을 벽에 붙인 뒤, 각 상태에 따른 사람들의 움직임을 촬영했다. 이후, 애프터 이펙트를

사용하여 사람만 딴 뒤에 실루엣 효과를 주었다.

그림 13 촬영 모습

그림 14 최종 영상 작업

처음에는 흰색 배경의 avi 비디오 포맷을 활용했는데, 이후 filestream 노드를 VLC

영상 재생 프로그램을 설치하여 업데이트 한 뒤 mov 파일로 재생 가능하게 만들었다.

흰색 배경 영상의 경우 맵핑시 실선이 생겨서, 알파값을 준 영상으로 문제를 해결했다.

Page 19: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

라. VVVV 패치 작성

그림 15 패치 테스트

맵핑을 위한 패치를 작성하면서, homography와 Screan space point( I.O BOX 수치를

X,Y 좌표로 표현한 노드)에서 몇 가지 에러가 있었다. 영상이 렌더러 창에서 영상들이

겹쳐지는 것이 문제였는데, 여러 시도를 해봤지만 결국 고칠 수 없었다. 처음

진행과정에서 조금 늦어졌지만, 다른 패치를 검토한 끝에 본 프로젝트에 맞는 노드

구성이 가능했다.

마. 작품 테스트 및 설치

그림 16 맵핑 테스트

전시 전에 맵핑 패치를 다시 한번 테스트 하는 했다. 본 프로젝트는 Quad의 흰색 면

위에 알파값을 가진 영상들을 특정 오브제에 놓는 작업을 했다.

Page 20: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

뱌. 전시

빛이 들어오지 않는 어두운 공간에 설를 했다. 처음 테스트를 했던 거리와 같도록

프로젝터의 위치를 조절했고 선반 위에 천을 두르고 포스터 작업과 리플릿을 함께 두어

최종적으로 마무리했다.

전시장소: 상암동 KGIT 7층 안쪽 공간

전시기간: 2013년 6월 21-22일 양일간

그림 17 최종 설치 모습.

전시 구조도

프로젝터&컴퓨터

오브제 키넥트&리플릿

Page 21: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

4.5 작품제작을 위한 VVVV 주요 패치& 노드

4.5.1 영상제어 및 맵핑용 노드 분석

맵핑을 위한 필수 노드는 다음과 같다. 필수 노드들 위주로 분석한 글을 첨부한다.

위쪽 핀은 인풋, 아래쪽 핀은 아웃풋을 의미한다.

homography 노드

Homograph는 4점의 두 집합사이를 행렬계산해주는 노드이다. 인풋 핀은 다음과 같이

되어있다. Transform 인풋은 transform이라는 보다 세밀하게 변형을 조정할 수 있는

노드를 연결하는 핀이다. 위치, 사이즈 ,변형,yaw등 다양한 변경이 가능하다. original

points XY핀은 xy의 포인트를 지정해주는 인풋 핀이다. Screen space point xy-스크린상의

xy좌표값을 잡아준다. 본 프로젝트에서는 vector와 연결한 다음 나타내는 형식을 취했다.

2d vector (join) 노드

vector 값을 하나로 합펴서 아웃풋에 보내는 노드이다. 가로 안에 씌여있는 Join은 각

값을 하나로 모아주는 것이고 spared는 나눠주는 역할을 말한다. homography의 screen

space point와 연결되어 있으며, 점이나 슬라이드 바로 변화시켜서 볼 수 있다. 본인은

맵핑시 각 위치 값을 점으로 조절하여서 보다 수월하게 할 수 있었다.

그림 18 homography 노드

그림 19 2d vector(join) 노드

Page 22: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

Quad 노드

쿼드는 파일이 텍스쳐 되기 위한 화판과 같은 것으로써, 사각형의 도형이다. 인풋에는

도형의 모양과 색깔 속성 크기 위치 등을 변경할 수 있는 설정이 포함되어 있다.

Filestream 노드(ex9,vlc)

영상파일을 불러오는 노드. 참고로, VLC 프로그램을 설치한다음 기본 영상 재생

플레이어로 변경해야 mov, mp4와 같은 확장자의 영상도 재생 가능하다. 설치를 안했을

경우 avi 확장자만 재생가능.

Group 노드(ex9)

아웃풋의 개수가 여러개일 때 랜더러 창에 동시에 불러들이는 기능을 한다.

레이어-인풋의 개수는 인스펙터 창에서 늘릴 수 있다.

Renderer(ex9) 노드

노드들의 모든 아웃풋을 실시간으로 보여준다. 말하자면 작업의 최종본이다.

Alt+1=축소화면 Alt+2패치에 삽입된 화면 Alt+3 새창에서 띄어진다.Alt+Enter를 치면

풀스크린 화면으로 보여준다. 화면의 색깔도 조정 가능하다.

그림 20 Quad 노드

그림 21 Filestream 노드

그림 22 Group 노드

그림 23 Renderer 노드

Page 23: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

최종 맵핑용 영상제어 노드 패치

그림 24 최종 맵핑용 영상제어 노드 패치

Page 24: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

프로젝션 맵핑을 위한 최종 노드. 위에서 설명한 필수 노드들을 조정하기 쉽게 Screen

space point로 만든 I.O 박스와 각종 숫치를 나타내는 I.O 박스를 활용하여 완성했다.

모든 움직임은 가운데 있는 토글 버튼으로 조절할 수 있다. Play와 loop버튼을 하나로

연결했다. –즉 토글 하나로 영상의 움직임을 조정 가능. 맵핑 관련 노드는 추후

ex-media 홈페이지에 업로드될 예정이다.

그림 25 노드 구성도

Page 25: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

4.5.2 키네틱을 위한 패치& 노드

키네틱의 설치 방법은 OpenNI 라이브러리와 SDK 라이브러리를 사용할 수 있다. 단,

두가지 방법을 동시에 사용할 수 없으며, OpenNI와 SDK라이브러리를 가운데 하나를

택해 드라이버를 설치해야 한다. VVVV와 연동해서 사용할 경우에는 윈도우를 제외한

나머지 프로그램은 32bit 버전으로 설치하는 것이 더욱 안정적이다.

키네틱을 구현하는 노드 자체는 복잡하지 않지만, 설치를 잘못했을 경우 작동하지

않는 경우도 있었다.

본 프로젝트에서 구현한 키네틱 노드는 위와 같다. 렌더러 창에서 구현되는 색상은

인스펙터 창이나 I.O BOX를 만들어 수정 가능하다. 키넥트 역시 프로젝션 맵핑 노드와

마찬가지로 Quad를 통해 받는다.

프로젝션 맵핑을 위한 노드에서

homography의 역할을 하는 runtime

kinect를 위한 노드이다. 실시간으로

모션을 감지하고 읽어내서 랜더러로

그것을 표현한다.

향후에는 gesture와 depth를 읽는 노드를 맵핑 노드와 연결해서 인터랙티브한 작업을

연구해볼 예정이다.

그림 26 (왼)키넥트 두개를 활용한 노드 (오)성공한 키넥트 노드 구성도

그림 27 World 노드

Page 26: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

제 5 장 VVVV공개 세미나 및 스터디 그룹 활동

본 연구팀은 프로젝션맵핑 사례 분석과 VVVV의 사용에 관련된 사전연구를 바탕으로

이에 관심있을 학생들을 대상으로한 공개 세미나도 함께 진행했다.

5.1 주제 선정 및 진행과정

처음에는 프로젝션 맵핑을 위한 vvvv 툴킷의 쓰임을 공개하려고 했으나, 세미나의

형식인 만큼 참여자가 직접 vvvv를 다뤄보며 익숙해지는 과정도 중요하다고 판단했다.

그래서 1시간은 프로젝션 맵핑 관련 예제와 연구에 대한 발표는 task2의 문정혜씨가

담당했고 이후 프로그램 설명과 기초적인 예시를 위한 강의는 본 연구자가 담당했다.

시간:2013년 5월 14일 저녁 6시-9시

장소: 등촌동 303호실

5.2 포스터 및 홍보 리플릿.

세미나 홍보를 위해, 페이스북 클럽에 공지하는 한편 포스터와 리플릿 제작을 하였다.

주제 선정과 가이드북의 vvvv 부분은 본인이 조사, 담당하였다.

가이드 북의 자세한 내용은 뒤에 별첨하였다.

그림 28 가이드 북 표지

Page 27: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

5.3 진행과정

그림 29 세미나 준비 풍경

303호에 붙여진 세미나 알림판과 한창 준비중인 모습. 포스터는 KGIT 등촌 건물

1-3층등에 붙였다.

그림 30 세미나 진행 중 풍경

프로젝션 맵핑과 프로그래밍 예제 순서에 따라 세미나는 진행되었다.

5.4 성과 및 향후 방안

참가자는 총 8명이었고, 다양한 방면에서 활약하는 사람들과 함께 집중하여 진행하였다.

연락처 리스트를 작성하였다. 추후 도큐멘테이션을 만들어 홈페이지에 업로드 하고

앞으로 세미나가 개최될 시 연락을 주기로 했다.

5.4.1 참가자들과의 인터뷰

세미나가 끝나고 며칠 뒤 각 참가자들과 개별적으로 인터뷰를 진행했다. 먼저, VJ

프리랜서 일로 이미 여러차례 미디어 파사드 작업을 했던 이진풍(뉴미디어 학부 미디어

Page 28: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

디자인과 재학중)씨는 매드매퍼와 사이펀, 브이제잉등 애플사의 멀티미디어 툴킷을

전문적으로 다룰 줄 안다. 그는 VVVV 세미나를 통해 기존의 애플 기반의 프로그램이

아닌 것을 익힐 수 있었고, 만약 잘 다루면 기존의 프로그램 보다 더욱 새로운 결과를

만들어 낼 수 있을 것 같다고 했다. 또한 세미나를 위해 열심히 준비한 것 같다고

말했다.

이강소(미디어 디자인과 재학중)씨 역시 새로운 프로그램을 알게 되었다고 한번

이것으로 작업을 진행해보고 싶고, 앞으로도 이러한 세미나가 종종 열렸으면 좋겠다고

했다. 이강소씨는 프로세싱과 아두이노등을 다루고 있다.

그밖에 직접적으로 툴을 써보지는 않았지만 국악방송쪽의 분들과 다른 회사원들 및

입체미디어 영상학부 학생들도 새로운 세계를 알게 되었다고 감상을 전했다.

5.4.2 향후 방안

이후 과정으로 가능하다면 한달에 1-2회 정도 3-4시간씩 세미나를 열어 더욱 많은

사람들에게 본 연구과정과 프로젝트가 공유될 수 있도록 한다. 한편으로,

도큐멘테이션을 작성하여 지속적인 업데이트를 올리고 그러한 기록또한 참가자들과

공유하기로 한다.

추후 참가자들의 수준이 높아지면 KGIT 내부나 외부 장소에서 VVVV 툴킷을 활용한

전시도 기획하고자 한다.

5.5. 오픈 VVVV 스터디 참가

본 연구원은 VVVV 공부를 위해 한국에 유일한 VVVV 카페에 가입하였고, 6월부터는

매주 일요일에 대학로 아르코 창작센터에서 열리는 오프라인 스터디에 참가하였다.

이후 온라인과 오프라인을 통한 교류를 이어오고 있으며, 현재 스터디 인원 15명 중

본인 포함 12명이 7월 23일부터 27일까지 아르코 창작센터 내에서 전시를 할 예정이다.

Page 29: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

그림 31 아르코 창작센터 오픈 VVVV 202호 작업실 공간

오픈 VVVV 프로젝션 맵핑 관련 전시 예정

2013년 7월23일 화-7월 27일 토요일

Page 30: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

제 6장 결론 및 향후 연구

결론이 제대로 안보임. 다시 쓰도록!!!! 한학기 동안 열심히 한 프로젝트인데 연구한

결과에 대한 느낌 소회 과정의 결과 등등 종합하길.

6.1 활용 분야 및 방안 연구

VVVV 멀티미디어 툴킷을 활용한 다양한 작업 및 전시를 활용한다. 또한, 보다 더

활용도를 높이기 위해 웹페이지를 통한 홍보도 충분히 검토한다.

VVVV를 활용한 분야로는 전시 디스플레이 및 VJ, 미디어 파사드 프로젝트 등이 있다.

추후에는 좀 더 장소성을 겸비하고 인터랙티브한 요소가 추가된 미디어 작업에

응용하는 한편 지속적인 세미나를 통해 아직 알려지지 않은 부분들을 사람들과 함께

공유하고자 한다.

6.2 결론

본 연구원은 프로젝트를 진행하면서 특히 프로그래밍에 관한 언어를 습득할 수 있게

되었다. 주로 영상 소프트웨어 위주로 작업을 했었기에, 프로그래밍 툴을 다루는 것이

처음이었다. 그래서 사실 어느 정도 작업이 궤도에 오르기까지 시간이 많이 걸렸다.

하지만 기본적인 인터페이스를 알고 나서는 노드를 연결하는 과정은 수월했다.

다만 기획에 있어서 작품과 프로그래밍에 관한 개념적인 부분을 심화해볼 시간이

충분하지 않았던 것과 관객과의 인터랙션이 추가되지 못한 것이 아쉬웟다. 하지만

세미나와 스터디를 통해서 VVVV 툴에 대해 많은 교류를 할 수 있었던 것은 의미가

있었다고 생각한다.

VVVV를 활용한 작품 제작에 있어서 본 연구원들을 포함해 다른 관심있는 사람들을

위해 좀 더 수월해지는 것이 가장 큰 성과일 것이다. 또한 앞으로도 단지 제작에 머무는

것이 아닌 세미나와 지속적인 스터디 활동을 통해 공유를 지속하며 앞으로도 유의미한

제작을 해나가고 싶다. 불완전한 현실을 테크놀로지로 표현하여 그것이 예술적으로

보완된 작업을 이어가고자 한다.

Page 31: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션

별첨. VVVV 가이드북과 세미나 배부

Page 32: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션
Page 33: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션
Page 34: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션
Page 35: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션
Page 36: 2013 1 KGIT X-Programlab.ex-media.org/wp-content/uploads/2013/04/02_9번과제양연희... · 2013학년도 1학기. KGIT X-Program 실적보고서. VVVV를 활용한 프로젝션