19.09.07 6시간 작업 22프레임
한 평생동안 도트랑 엮일 일은 없을 줄 알았는데... 인생 처음으로 도트를 그것도 이펙트를 만들게 될 줄은 몰랐습니다.
어떻게 하면 최대한 노가다를 줄일 수 있을까? 를 고민하다가 그러려면 사전에 빈틈없이 계획된 파이프라인을 짜서 작업에 들어가야 한다고 생각했습니다. 머리를 굴리며 폭발 이펙트를 구성하는 요소를 제 나름대로 분류했습니다.
읽기 전에 같이보면 좋을 유튜브 영상
(특히 0:14의 화산 폭발 장면을 주목하세요)
소닉붐
매질(대기)의 밀도가 급격하게 압축되면 이와 같은 불안정한 상태에서 안정한 상태로 가기 위해 공기가 서로 밀어내게 되어 기화 되어있는 대기중의 물이 응결되어 수증기의 띠가 발생
지상 충격파
폭발로 인해 지상에 흙먼지 또는 주변 환경 요소가 방사형으로 퍼지는 부분
공중 충격파
폭발로 인해 대기가 구형으로 밀려나는 부분
비교적 빠른 파편
비교적 느린 파편
불완전 연소 구름
물질이 연소할 때 산소의 공급이 불충분하거나 온도가 낮으면 그을음이나 일산화탄소가 생성되고 이 현상 때문에 까만색 연기가 난다 (반대로 완전연소면 이산화탄소 등의 기체만 생성되서 흰색 연기가 남)
<폭발 이펙트에 영향을 주는 환경요소들>
폭발원인(원인이 되는 물질의 운동량이나 화학반응식 등등)
폭심지의 위치(고도, 지하, 수중)
매질
중력
온도
대기 밀도(기압과 산소 농도 포함)
습도
색온도
불꽃색
생성되는 빛과 열
우리는 게임에 쓰일 스프라이트를 만드는게 목적이니 여기에 적용되는건 사실 몇개 없습니다. 밑에서 천천히 설명하도록 하겠습니다.
<이펙트 이론>
타이밍
카메라 노출 보정
카메라 쉐이크
적절히 프레임 끊기
선딜/후딜(애니메이션 그래프 에디터)
배경과의 조화
<도트 폭발 이펙트 파이프라인>
포토샵 타임라인
1프레임
가장 먼저 노출 보정부터 시작했습니다. 블랙 프레임 하나 넣는게 제일 쉽잖아요? ㅎㅎ
다들 아는 사실이지만 아무것도 없는 맨 땅에서 폭발이 일어나진 않습니다. 이유없는 폭발은 없고 화학반응을 일으킬 물질과 형태가 있어야 하는데(화학반응이 아닌 압력 차이로 인한 폭발도 있긴 하지만) 그런 설정이 있는 과제가 아니었기 때문에 넘어 가도록 합시다.
2프레임
화이트 프레임 + 섬광효과입니다. '이시국에?'
그저 화이트 프레임 하나 때려박는 것 보다는 수업시간에 배운 폭발 직전에 수축하는 선딜레이 타이밍과 결합시켜서 한 프레임 안에 표현 해볼수 없을까? 고민하다가 섬광을 집중선 처럼 그려서 수축을 표현 하는걸 시도해 봤는데 생각보다 잘 어울려서 그대로 사용 했습니다.
안티앨리어싱을 손으로 직접 그려서 먹일까 고민했는데 비교 해보니 큰 차이 없어서 그대로 하기로 했습니다.
3~22프레임
그레이스케일로 실루엣을 잡으면서 전체 이미지의 균형을 잡습니다. 무게중심이 좌측으로 쏠리게 의도 했습니다. 폭발은 대칭이 아닙니다. (심지어 우주의 시작인 빅뱅까지도 대칭이 아니었습니다) 프로그램은 이지툰을 사용했습니다. 앞 뒤 프레임 변화를 체크하기 좋고 타이밍 잡기 쉽습니다. 사실 미취학아동 시절에 만져봤었던 추억이 있는 툴이기도 하고 Aseprite를 쓰고 싶었지만 돈이 없었거든요. 돈 있으면 Aseprite 쓰세요.
작업 순서를 크게 세가지 레이어로 나눴습니다. 충격파 - 구름 - 파편
화산 폭발이나 운석 충돌처럼 거대하고 장엄한 폭발이 아닌 20프레임 짜리 소규모 폭발이기 때문에 소닉붐과 충격파를 하나로 합쳐서 생각했습니다. 이부분은 앞으로 충격파라고 부르겠습니다.
충격파를 먼저 그린 이유는 이펙트에서 차지하는 면적과 보이는 순서 때문인데 화면상에서 구름과 겹치는 부분이 많고 제일 아래에 있으며 가장 먼저 사라지기 때문입니다. 원래는 소닉붐이 가장 먼저 사라지고 지상 충격파는 흙먼지와 함께 방사형으로 퍼지면서 길게 남아야 하지만 상술한 이유로 둘을 하나로 묶었습니다.
구름은 발산하는 순간이 가장 빠르고 시간이 흐를 수록 느려지다가 종국에는 가지고 있는 벡터가 대기와 바람의 영향을 받아 랜덤하게 퍼지거나 말리는 운동을 하고 밀도가 낮아져서 점차 눈에서 사라지게 됩니다. 폭심지에서 가까운 구름이 멀리 있는 구름보다 늦게 사라지는 경향이 있습니다.
파편은 빠른 파편과 느린파편으로 분류되고 이펙트를 보시면 아예 화면 밖으로 날아갈 정도로 빠르게 표현 된 파편도 있습니다.
3프레임
이제 포토샵으로 gif를 가져와서 색을 칠합시다. 폭발 직후의 상황을 표현한 프레임 입니다.
화학 반응으로 인한 빛과 열 때문에 구름과 파편이 높은 온도로 가열된 상태이기 때문에 노란색 불꽃도 보이게 그립니다. 섭씨 6천도 이상 뜨거우면 흰색과 파란색 불꽃이 나기도 하지만 자연적인 폭발의 경우에는 거의 못본다고 생각하면 됩니다. 주변환경이 전부 영향을 받기 때문에 수증기로 생긴 소닉붐-충격파도 일부로 빨갛게 칠했습니다.
컬러를 많이 쓰면 저의 색조 감각으로는 걷잡을수 없이 표현하기 어려울 것이라 생각해서 한 프레임에 들어갈 수 있는 색을 2~3컬러로 스스로 제한을 걸었습니다. 또한 이 부분은 <HP Sword>에서 많은 영감을 받았습니다.
4프레임
카메라가 아직 노출에 적응이 안된 부분을 표현하기 위해 고심한 끝에 불꽃과 불완전 연소 구름의 애매한 중간의 단색으로 칠하고 충격파 부분을 흰색으로 분리합니다. 여기서도 충격파에 안티앨리어싱을 손으로 그릴까 고민했지만 섬광 표현과 동일한 이유로 생략했습니다.
5프레임
아직 폭심지에 남아 있을 잔열과 빛을 표현합니다. 구름에서 그림자가 드리울 부분에만 반사된 빛을 표현한다는 느낌으로 그렸습니다.
6프레임
빠른 속도로 채도를 감소시킵니다. 물리적으로 빛의 속도가 제일 빠른 만큼 빛은 사라지고 잔열이 구름에 감돌고 있습니다.
7~9프레임
퍼져나간 구름의 랜덤한 벡터로의 운동과 구름이 말리는 현상과 폭심지에서 멀어질 수록 느려지는 움직임에 집중했습니다.
10~22프레임
폭심지에서 가까운 구름이 멀리 있는 구름보다 늦게 사라지는 경향이 있다는 걸 생각해서 빠르게 사라지고 느리게 사라지는데 차이를 둡니다.
타이밍 조절
1~7프레임은 인터벌을 50ms로 설정하고 구름이 퍼지는 8프레임 부터 22프레임은 80ms로 설정 했습니다. 이 단계까지 완료 한 후 카메라 쉐이크도 옵션으로 추가할 수 있습니다.
완성.