[움짤 제작스킬] 7.부드러운 화면넘김-오버랩(동영상)

이미지 클릭시 움짤 만들기 강좌 모음으로 이동(ctrl+클릭 새창)

---

클릭하면 해당 구간으로 이동됩니다.

1. 오버랩 기초 / 움짤에 사용되는 오버랩

2. 오버랩 만들기

3. 오버랩 주의점 / 응용과 페이드효과

---

1. 오버랩의 기초

사전적으로 이렇습니다.

하나의 화면이 끝나기 전에 다음 화면이 겹치면서 먼저 화면이 차차 사라지게하는 기법

영상에서 한 장면이 다음 장면으로 넘어갈 때 우리는 가끔 오버랩을 봅니다. 다만 그 자연스러움에 신경쓰지 않을뿐이죠.
일반적으로 많이 사용되지 않으며 부드러운 연출이 필요할 때 주로 넣습니다.
보통 tv에서 보면 발라드를 부르는 가수들의 영상에 자주 쓰이며 영화에서는 회상 장면이나 연계된 이미지를 보여줄 때 많이 사용하기도 합니다.

▼오버랩을 잘 설명해주는 장면<아바타 2009 Outro>

다음 장면으로 자연스럽게 넘어가며 전 장면이 사라집니다.

---

1-2. 움짤에 사용되는 오버랩

움짤에도 이 오버랩을 많이 사용합니다. 움짤의 특성상 짧은 재생 타임에 처음과 끝 부분을 이어서 어색한 연결 부분을 자연스럽게 보여주기도 하며 여기에 더해 용량도 줄여주고(이 부분은 아래에 설명) 눈의 피로도 한층 줄일 수 있습니다.

두 개 이상의 움짤을 합칠 때도 용의하며 응용해서 인트로와 아웃트로의 자연스러운 시작과 끝을 만들 수도 있습니다. 또 멈춰진 장면에 여러 개의 움짤을 동시에 보여줄 수도 있습니다.  전에 강의했던 트윈과 다른 점이라면 정지된 장면이 바뀌는 것이 아닌 움직이는 장면이 움직이는 장면으로 바뀐다는 것에서 고급스러움도 가지고 있습니다.

단, 이미지레디의 레이어눈은 단축키로 켜고 끌 수 없습니다. 단축키의 추가 또한 불가능하며(포토샵은 가능) 그래서 오버랩을 액션으로도 저장이 불가능합니다. 직접 눈을 켜주면 레이어 이름까지 저장돼 다른 움짤에 이 액션을 쓸 수 없기 때문입니다.

cs3이상에서는 액션으로 만들어 쉽게 사용할 수 있다는 점 참고하시고 이런 이유로 이미지레디 상에서는 50%는 수작업으로 만들어야 하는 단점 때문에 많은 수의 움짤을 제작시에 이 오버랩을 피하기도 합니다. 꼼수가 있다면 오버랩이 되는 장면수를 줄이는 방법이 있습니다. 

---

2. 오버랩 만들기

이 강좌는 포토샵이나 이미지레디를 중급 이상으로 다루는 사람을 기준으로 작성한 글입니다.

▼오버랩을 넣을 움짤입니다.

 
끝까지 재생되면 다시 처음으로 돌아가는 것이 움짤의 특징입니다. 이 끝과 처음에 오버랩을 만들어 주면 어떻게 될까요?

 

▲갑자기 장면이 바뀌던 것이 없어지고 부드럽게 처음 장면으로 이어집니다. 우리가 배워볼 것이 바로 이 오버랩입니다.

1.필요 없는 레이어 모두 삭제

움짤을 제작하면서 모든 레이어의 이미지를 사용할 때도 있지만 간혹 애니메이션 창의 프레임만 지우고 레이어는 남겨놓는 경우가 있습니다. 좀 더 쉽게 작업하기 위해서 이 삭제된 프레임들의 레이어를 모두 지워줘야 편합니다.
함축해서 말하면 애니메이션창 프레임에 들어있지 않은 이미지들이 레이어창에 있다면 모두 삭제하라는 이야기입니다.

2.오버랩에 사용할 이미지 수

간단하게 설명해 다음 장면이 부드럽게 보여지기 위해서는 앞에 장면이 점점 투명해지며 사라져야 합니다.
이 단계를  한 장 만으로도 표현할 수 있으며 사용되는 이미지가 많을수록 더 부드럽게 넘어가는 오버랩을 감상할 수 있습니다.
위에 예제로 사용한 움짤의 경우 5단계로 넣었습니다. 5장의 이미지가 서서히 사라지고 다음 장면이 왔다는 이야기에요. 
이 사라지는 이미지의 투명도를 작업하는 사람이 직접 정해야 합니다.

예로 9장의 이미지를 사용해 오버랩을 준다면 투명도를 90% 80% 70% 60% 50% 40% 30% 20% 10%로 총 9개의
레이어에 각각 작업해 줘야 한다는 이야기입니다. 말로 표현하기 힘드니 나중에 영상을 참고하시기 바랍니다.

3.본격적인 작업

작업을 설명하면 다음과 같습니다.
프레임을 보면서 오버랩이 들어갈 구간을 선택하고 작업할 프레임과 레이어를 같이 선택해서 레이어의 투명도를 점점 떨어뜨린 후 다음에 오게될 이미지들의 레이어눈을 순차적으로 켜주고 마지막으로 오버랩으로 겹치는 프레임을 삭제해 줍니다.

강의에서는 총 5단계의 오버랩을 만들어 보겠습니다. 5단계의 투명도를 80% 62% 44% 26% 18%로 표현해 보겠습니다. 수치는 각자 정하시고 최대한 부드럽게 보이면 그만입니다. 보통 4단계를 많이 쓰는 편입니다. (80% 60% 40% 20%)

아래와 같이 작업할 프레임과 레이어를 같이 선택하고 오팩시티를 변경해 주면 됩니다.

 

시작은 가장 끝 프레임과 끝 레이어에서 합니다. 1번 프레임을 선택하면 해당 레이어에(2번) 눈이 켜지는데 이 눈이 켜진 레이어를 선택해서 3번 오팩시티 부분의 투명도를 조절합니다. 위에도 설명했듯 점점 투명해지려면 스샷에 보이는 63번 프레임의 투명도는 18%가 돼야 합니다. 다음 같은 방법으로 62번 프레임과 눈이 켜진 레이어를 선택 후 투명도를 26%, 61번 프레임과 눈이 켜진 레이어를 선택 후 투명도를 44%... 이렇게 쭉 반복 작업해서 모든 프레임에 투명도를 넣습니다.

주의할 것은 반드시 선택된 프레임과(1번) 눈이켜진(2번) 레이어를 꼭 선택해야 합니다. 프레임을 선택했는데 엉뚱한 레이어를 잡고

투명도를 주면 프레임에 투명도가 적용되지 않는 것을 볼 수 있습니다. 
 
▼이렇게 투명도가 모두 들어간 애니메이션창을 확인해 봅시다. 서서히 투명해지는 프레임들을 볼 수 있습니다. 

 

위의 과정을 이미지레디의 액션으로 만든 것입니다. 반드시 마지막 프레임과 마지막 레이어에서 액션을 사용하세요.

오버랩.isa

위의 액션을 사용하면 아래 이미지를 합치는 처음 과정인 마지막에 적용한 프레임과 첫 레이어를 자동으로 선택하고 시작하게 됩니다.

이제 오버랩이 될 이미지를 합쳐줘야하는 작업입니다.

 

마지막 투명도 80%를 넣었던 프레임 1번을 선택하고 가장 첫 레이어를 2번을 선택합니다. 그리고 3번 레이어의 눈을 켜줍니다. 이 첫 레이어를 포함해 그 위로 5개의 레이어를 지금까지 작업한 투명한 프레임과 합치는 과정입니다. 
레이어의 투명도를 줬던 것과 달리 프레임과 레이어를 함께 선택하지 않아도 프레임만 선택해서 각각 맞는 레이어의 눈만 켜주면 됩니다.

위의 예제사진으로 보면 다음으로 작업할 내용은 60번 프레임을 선택하고 방금 눈을 켠 레이어 바로 위의 레이어에 눈을 켜주면 됩니다. 이 과정을 5번 반복하면 5단계의 오버랩이 완성됩니다.

완성된 움짤을 재생해보면 처음과 끝이 자연스럽지 않고 한 번 더 반복되는 것을 확인할 수 있습니다. 이미 우리가 작업으로
처음 5장의 프레임을 마지막 5프레임에 넣었기 때문입니다. 그래서 이 겹쳐진 첫 5프레임은 지워줘야 합니다.

▼이렇게 5개의 프레임을 잡고 휴지통을 눌러 삭제하면 최종적으로 오버랩이 완성됩니다.(동시 선택 쉬프트키 사용)

 

이런 삭제 과정으로 움짤의 용량을 줄일 수 있습니다. 오버랩을 10장으로 했다면 결과적으로 10장을 지우니 그만큼 용량이 줄어들겠죠.

720p 전체보기권장. 3단 오버랩 넣는 방법을 간단하게 동영상으로 제작했습니다. 궁금한사항은질문으로

완성이미지

 

---

3. 오버랩의 주의점

주의할 점이라면 여러 개의 움짤을 합쳐서 오버랩 생성 시에 레이어의 위치를 잘 파악해야 합니다.
레이어의 특성상 위에 있는 레이어는 아래 있는 레이어들을 숨기기 때문에 투명해질 레이어는 항상 위에 있어야 합니다.
이것이 여의치 않다면 오버랩 되는 구간의 레이어만 겹쳐질 레이어 상단으로 이동시켜 제작하면 문제가 해결됩니다.

---

3-1. 응용과 페이드 효과

강의에서 봤던 내용은 끝과 처음을 이어주는 경우지만 응용하면 다양하게 사용이 가능합니다. 2개 이상의 움짤을 합칠 때 2~3장의 오버랩으로 쉽게 합성할 수 있으며 투명도를 모두 같게 만들어 계속해서 두 개의 이미지가 겹쳐 보이도록 만들 수도 있습니다.

페이드 효과는 일반 트윈으로도 가능하지만 오버랩 페이드는 움직이면서 생성된 다는 것에서 주목해야 합니다.
오버랩을 이해했다면 만드는데 크게 어렵지 않습니다. 배경을 흰색과 검은색으로만 바꾸면 아래처럼 만들 수 있습니다.

<화이트 인>

<화이트 인+아웃>

<블랙 인+아웃>