포토샵으로 살아 움직이는 GIF 만들기

몇년 전 움직이는 GIF를 만들기 위하여 잘 아는 지인으로부터 팁을 제공받아 만들곤 했었습니다.

몇년이 지난 지금 과도한 음주와 흡연으로 인하여 제 기억력은 점점 더 희미해지고 가물거려 GIF 만드는 방법조차 기억이 잘 나지 않았습니다. -,.-;

희미한 기억으로 포토샵을 이리저리 뒤척이다가 결국 성공하긴 했지만, 이번 기회에 GIF 만드는 방법에 대해 포스팅을 하여 기억도 되살리고 블로그에 자료도 남기기로 하였습니다.

보통 움직이는 GIF는 저용량을 강점으로 하여 인터넷이나 홈페이지 등에서 자유롭게 올릴 수 있는 간단한 영상으로 이용되어져 왔습니다.

본인 또한 간단한 팁이나 재미있는 장면들을 영상으로 담을 경우 GIF를 이용하곤 하였습니다.

자, 포토샵을 이용하여 살아 움직이는 GIF를 만들어 보도록 하겠습니다.

우선 포토샵을 실행한 후 새로운 작업을 시작하였으며 본인이 사용하는 버전은 포토샵 CS5 한글판이 되겠습니다.

GIF 만들기

우선 영상으로 만들 이미지들을 레이어에 모두 불러옵니다.

보통 얼굴 표정의 변화나 재미있는 영상들을 편집하곤 하는데요, 오늘은 간단하게 설명해 드리기 위해 점프하는 화면 4개를 GIF로 만들어 보도록 하겠습니다.

GIF 사용할 이미지 불러오기

이렇게 불러온 레이어 4개가 준비되었습니다.

.

상단 메뉴의 창 -> 애니메이션을 실행시키게 되면 화면 하단에 아래와 같은 애니메이션(프레임) 조작 창이 나타나게 됩니다.

(영문 버전에서도 동일하게 Windows -> Animation 메뉴 실행)

창 - 애니메이션 효과 시작

 

 

바로 여기서 애니메이션 작업을 진행하게 되는데요, 우선 애니메이션 창에서 복제 버튼을 이용하여 애니메이션에 사용할 사진의 개수만큼 프레임을 늘려줍니다.

여기서는 총 4개의 사진을 사용할 것이니 4개의 프레임을 만들었습니다.

프레임 복사 과정 (사진 수량 만큼)

이제 여기서 중요한 작업이 시작됩니다.

4개의 프레임을 연속 화면으로 보여주기 위해 각각의 사진의 다음번에 보여질 사진을 선택해 주는 과정인데요, 1번 프레임 선택 후 우측 레이어 화면에서 첫번째로 보여질 사진 선택, 2번 프레임 선택 후 레이어 화면에서 두번째로 보여질 사진을 선택, 연속해서 쭉~쭉~쭉~ 해 주면 되겠습니다.

프레임별로 보여질 사진 선택

1번 프레임 선택 -> 첫번째 표시될 레이어 선택

2번 프레임 선택 -> 두번째 표시될 레이어 선택

3번 프레임 선택 -> 세번째 표시될 레이어 선택

4번 프레임 선택 -> 네번째 표시될 레이어 선택

.....

.....

.....

설명해 드리기가 조금 애매하여 사진에 화살표로 표시해 드렸는데요, 한번 선택해도 다시 변경할 수 있으니 부담가지지 마시고 이리 저리 순서대로 사진을 선택해 보시기 바랍니다.

아주 쉽습니다!!

또한 애니메이션(프레임) 화면에 보시게 되면 각 사진(프레임)별로 화면에 표시되는 시간을 조절할 수가 있는데요, 0.1초 단위 0.5초 단위 1초 단위 등 원하는 시간으로 표시해 줄 수 있으니 적절한 값으로 선택해 주시기 바랍니다.

완성된 GIF 프레임 애니메이션

위는 이렇게 프레임이 완성된 화면입니다.

우측 화살표 ▶ 플레이 버튼으로 애니메이션을 실행해 보시면 완성된 화면을 보실 수 있겠습니다.

이렇게 완성된 움직이는 영상은 다른이름으로 저장하시면 되겠으며, 또한 웹이나 특정장치에서 사용하기 위해 웹 및 장치용으로 저장 기능을 이용하여 원하는 해상도와 용량으로 저장할 수 있겠습니다.

(영문 버전에서는 Save for Web & Devices...)

살아 움직이는 GIF 애니메이션이 완성되었습니다.

GIF 애니메이션 완성

고해상도 이미지 원본을 그대로 이용했더니 용량이 9M 이나 되는군요... -,.-;

고해상도 이미지일 경우 용량 제한에 걸려 홈페이지나 블로그 등에 업로드할 수 없는 경우도 있으니 주의하시기 바라며, 더욱 생동감 넘치는 영상을 제작하여 멋진 홈페이지, 웹사이트, 블로그 꾸미시기 바랍니다.

-----

방문 감사합니다 (__)