4 SCREENS · 5:28 IN ALL · ONE HTML EACH
이미지 파일 0장,
음원 파일 0개.
그림도 움직임도 음악도 전부 코드로 만든 영화 네 편.
STARDUST
먼지 한 줌이 별이 되고, 별이 다시 우리가 되기까지 138억 년.
빅뱅의 한 점에서 은하와 초신성, 지구와 생명을 지나 그것을 바라보는 눈까지, 입자 26만 개(휴대폰에서는 13만 개)가 모양을 바꿔 가며 138억 년을 1분 44초에 건너갑니다. 입자의 움직임은 WebGL2 셰이더가 매 프레임 계산하고, 음악과 효과음은 코드로 합성했습니다. 바깥에서 가져온 자료는 지구 해안선 데이터 하나뿐입니다.
보기1분 45초
8시 21분에 눈을 뜬 직장인이 토스트를 물고 회사까지 달립니다. 9시 1분 전, 과연.
알람과 씨름하다 늦잠을 잔 직장인의 출근길을 담은 1분 6초짜리 코미디 애니메이션입니다. 사람과 방, 거리와 버스까지 모두 Canvas2D 도형으로 매 프레임 그리고, 모든 장면이 시간의 함수라 어느 순간으로 넘겨도 같은 그림이 나옵니다. 펑크와 보사노바, 효과음은 Web Audio로 합성해 빌드할 때 MP3로 구워 넣었습니다.
보기!1분 6초
먹 한 방울이 번져 산수화 한 폭이 되고, 산조 장단을 따라 사계절을 지나 다시 한 원으로 돌아갑니다.
한지 위에 붓질이 저절로 그려지는 1분 24초짜리 수묵 영상입니다. 붓이 지나가는 시각을 획마다 기록해 두고 번짐과 마름을 시간의 함수로 계산하기 때문에, 어느 장면으로 넘겨도 같은 그림이 나옵니다. 종이결, 먹의 농담, 낙관, 가야금과 대금과 장구 소리까지 모두 코드로 만들었습니다.
보기1분 24초
POINT · LINE · PLANE
점 하나가 선이 되고, 면이 되고, 마침내 한글이 됩니다.
칸딘스키의 『점과 선에서 면으로』와 훈민정음의 천·지·인에서 출발한 짧은 영상입니다. 점 하나에서 시작해 선과 면, 바우하우스풍 구성을 거쳐 같은 도형들로 '점·선·면' 세 글자를 조립합니다. 도형과 움직임은 Canvas2D로 매 프레임 그리고, 음악과 효과음은 Web Audio로 합성했습니다.
보기1분 13초
네 편 모두 HTML 파일 하나씩입니다. 미리 녹화한 영상이 아니라, 재생하는 순간 브라우저가 코드로 한 장면씩 그립니다. 그래서 휴대폰을 세우면 세로 구도로, 눕히면 가로 구도로 다시 짜이고, 아무 지점으로 넘겨도 같은 장면이 나옵니다.
음악과 효과음도 코드로 합성했습니다. 악기 소리 하나하나를 수식으로 만든 뒤, 휴대폰에서도 끊기지 않도록 MP3로 구워 같은 파일 안에 넣었습니다.
바깥에서 가져온 것은 둘뿐입니다. 글꼴은 Google Fonts에서 불러오고, 별의 먼지의 지구 해안선은 공개 지도 데이터를 썼습니다.