비디오에서 Photoshop에서 GIF를 만드는 방법

Photoshop으로 GIF를 만드는 방법에 대해 여기까지 왔다면 아마도 웹사이트에 업로드한 비디오가 로딩 시간을 늦추었기 때문일 것입니다. 잘 찾아오셨습니다. 이 가이드에서는 비디오 장면에서 Photoshop에서 GIF를 만드는 방법을 보여줍니다. 그것은 귀하의 사이트에서 멋지게 보일 것이며 비디오 파일보다 속도에 대해 훨씬 더 최적화될 것입니다!

GIF를 사용하면 웹 사이트에서 루프로 모든 유형의 비디오를 표시할 수 있습니다. 판촉 자료의 클립, 튜토리얼의 화면 녹화 또는 원하는 거의 모든 것이 될 수 있습니다.

이 튜토리얼에서는 몇 가지 비디오 푸티지와 Adobe Photoshop이 필요합니다. Photoshop 구독이 없는 경우 무료 평가판을 사용할 수 있으므로 Photoshop이 있으면 웹 디자인에 큰 도움이 될 수 있습니다! 비디오가 매우 긴 경우 iMovie 또는 Adobe Premiere와 같은 비디오 편집기에서 먼저 잘라낼 수 있습니다. Photoshop에는 가져올 때 다듬기 옵션도 있지만 원본 푸티지가 매우 긴 경우 비디오 편집기가 더 좋습니다.

시작하자.

최종 결과 미리보기

이것은 이 튜토리얼을 위해 만든 GIF의 최종 결과이며 섹션 또는 모듈 배경에 적합합니다.

시작하려면 비디오를 Photoshop으로 가져오기

비디오 클립을 Photoshop으로 가져오려면 먼저 Photoshop 편집기 내부에 있어야 합니다. 거기에서 파일 > 가져오기 > 비디오 프레임을 레이어로 클릭합니다. 사용할 동영상을 선택하고 열기를 클릭합니다.

팝업 대화 상자에는 두 가지 선택 사항이 있습니다. 1. 처음부터 끝까지 – 비디오 전체를 사용하거나, 2. 선택한 범위만 – 트리밍 옵션을 사용하고 비디오의 일부만 사용합니다.

그 아래에는 가져오기를 선택한 프레임 수로 제한하는 선택 사항이 있습니다. 비디오가 짧으면 작은 숫자를 선택하고 비디오가 길면 큰 숫자를 선택하십시오. 올바른 흐름이 될 때까지 시행착오가 필요할 수 있습니다. 예를 들어 변경 사항이 작거나 느린 푸티지에는 거의 똑같이 보이는 프레임이 많이 있습니다. 반면에 시각적 변화가 많은 푸티지가 빠르면 프레임을 너무 많이 빼면 요란해 보일 수 있습니다.

이 자습서에서는 '처음부터 끝까지' 및 '3 프레임마다 제한'을 선택합니다. 'Make Frame Animation'이 클릭되었는지 확인하십시오.

푸티지 조정

크기 자르기에서 색상 수준 조정에 이르기까지 비디오 푸티지를 원하는 대로 조정할 수 있는 완벽한 시간입니다. 예를 들어, 비디오 모서리에 보기 흉한 물체가 있거나 비디오의 전체 높이가 웹사이트 디자인에서 배치하려는 위치에 비해 너무 클 수 있습니다. 또는 비디오 장면의 채도가 지나치게 높은 경우 조정 패널을 사용하여 모든 레이어의 채도를 한 번에 조정할 수 있습니다.

창의적인 사람들의 경우 다른 레이어를 조정하면 GIF에 모든 종류의 다양한 효과가 만들어집니다. 할 수 없는 것은 배경을 제거하거나 한 번에 한 레이어에서만 작동하는 도구를 사용하는 것입니다.

전문가 팁: 어떤 조정을 하든 모든 레이어를 선택했는지 확인하십시오.

한 번에 모든 레이어를 자르는 방법

레이어 1을 클릭하여 모든 레이어를 선택한 다음 Shift 키를 누른 상태에서 맨 위 레이어를 클릭합니다. 직사각형 선택 윤곽 도구를 선택하고 유지하려는 비디오의 영역을 선택합니다(빼고 싶은 것이 아님). 이미지 > 자르기를 클릭하면 선택 영역 밖의 영역이 사라집니다. 우리의 비디오에서는 전체 비디오 영역을 선택하고 상단의 일부를 선택하지 않은 채로 남겨둡니다. 전체 비디오의 높이를 낮추고 수평선의 흰색 가장자리를 제거하려고 합니다.

GIF의 색상을 조정하는 방법

모든 레이어를 선택한 상태에서 패널 메뉴에서 조정 탭을 클릭합니다. 조정 도구를 사용하여 GIF의 레이어에 적용할 수 있습니다. 예를 들어 색상을 흑백으로 바꾸거나 이중톤 효과를 줄 수 있습니다. 우리는 흑백 조정을 색조와 함께 사용하여 비디오의 색상을 좀 더 예술적으로 만듭니다. 콘텐츠의 나머지 부분에 방해가 되지 않는 배경에 적합합니다. 원하는 색상 색조를 사용하고 원하는 방식으로 다양한 색상 수준을 조정할 수 있습니다. 색상 조정을 추가하면 최종 파일이 추가하지 않을 때보다 더 커집니다.

이 GIF는 색상 필터 없이 211MB, 색상 조정을 적용한 312MB로 다운로드되었습니다. 색상 조정을 정말로 원하면 프레임을 줄여서 최종 파일을 더 작게 만들어야 합니다. 다음 섹션에서 더 자세히 설명합니다.

타임라인을 사용하여 프레임 편집

타임라인 창에서 프레임을 편집하여 GIF 파일의 최종 크기를 줄일 수 있습니다. 예를 들어 클립 끝에 있는 추가 프레임이 지연되거나 정적 섹션을 생성하는 것처럼 보입니다. 더 많은 프레임을 꺼낼수록 더 좋습니다! 그러나 너무 많은 프레임을 꺼내면 최종 효과가 흐트러지므로 일부 프레임을 삭제한 후 루프가 어떻게 보이는지 시간을 내서 확인하십시오.

타임라인 창에 액세스하고 루프에서 GIF가 어떻게 작동하는지 보려면 창 > 타임라인을 클릭합니다. 화면 하단에 긴 가로 패널이 열립니다. 왼쪽 하단에는 몇 가지 컨트롤이 있습니다. 루프 옵션을 '영원히'로 선택하고 재생 버튼을 눌러 GIF가 어떻게 보이는지 확인합니다. 우리의 경우 GIF는 꽤 좋아 보이지만 여전히 너무 깁니다. 200개 이상의 프레임과 색상 조정으로 최종 파일은 무려 312mB입니다. 아래 'GIF로 저장' 섹션의 단계에 따라 최종 파일의 크기를 확인할 수 있습니다. 살펴보신 후 저장 대신 취소를 누르시면 됩니다. 웹용으로 내보내기 옵션을 사용하여 파일 크기를 줄일 수도 있습니다.

GIF 파일 크기를 작게 만들기 위해 프레임을 삭제하는 방법

GIF를 훨씬 작게 만들기 위해 마지막 200개 프레임을 꺼냅니다. 전체 비디오에는 드론 카메라가 해변 뒤 공원을 향해 왼쪽으로 회전하고 패닝하는 섹션이 있습니다. 우리는 그것을 필요로하지 않았다. 이제 GIF의 무게는 160MB입니다. 여전히 꽤 큽니다. 프레임이 불안정해지기 때문에 더 이상 프레임을 제거하지 않으므로 나중에 '웹용으로 저장' 옵션으로 최적화하기 위해 그대로 둡니다.

프레임을 삭제하려면 타임라인 창의 재생 기능 아래에 있는 휴지통 아이콘을 선택하고 누르면 됩니다. 마찬가지로 하나를 클릭하여 연속적인 프레임 그룹을 선택한 다음 Shift+클릭을 눌러 앞이나 뒤의 프레임을 선택할 수 있습니다. GIF의 시작이나 끝에서 장면을 자르지 않고 더 짧게 만들고 싶다면 하나를 눌러 대체 프레임을 삭제한 다음 다른 프레임마다 command+클릭합니다.

Photoshop에서 비디오를 사용하여 GIF를 만들 때 가져올 때와 나중에 푸티지의 섹션을 잘라낼 수 있다는 점이 마음에 듭니다! 실용적입니다.

GIF의 속도를 변경하는 방법

타임라인 창에서는 GIF 속도를 늦추거나 높일 수도 있습니다. 타임라인의 각 프레임 아래에는 속도 컨트롤이 있습니다. 기본 측정값은 '지연 없음' 또는 '0'이지만 사용한 동영상에 이미 속도 조정이 있을 수 있습니다. 이것은 우리 비디오의 경우입니다. 프레임을 삭제한 위의 스크린샷을 보면 프레임 지연이 0.04초임을 알 수 있습니다. GIF를 미리 볼 때 속도가 빨라진 것처럼 보입니다. 우리는 그것을 원하지 않습니다.

타임라인 창의 왼쪽 상단 모서리에 있는 세 줄을 클릭하여 타임라인의 모든 프레임을 선택하고 '모든 프레임 선택'을 클릭합니다. 어느 프레임에서나 작은 아래쪽 화살표를 클릭하고 '지연 없음'을 선택합니다. 이렇게 하면 GIF가 자연스럽게 흐르게 됩니다. 슬로우 모션으로 움직이는 것처럼 보이는 GIF를 만들려면 1초보다 큰 값을 선택하십시오.

GIF로 저장 및 최적화

모든 작업이 완료되면 프로젝트를 GIF로 저장할 차례입니다. 파일 > 내보내기 > 웹용으로 저장(레거시)을 클릭하고 팝업 대화 상자에서 GIF 옵션을 선택합니다. 파일의 크기를 확인하고 출력을 고려하십시오. 파일 크기를 줄이기 위해 수행할 수 있는 몇 가지 작업이 있습니다.

• 색상 수를 줄이십시오.
• 디더를 줄이거나 제거하십시오.
• 높이와 너비를 줄입니다.

조정이 GIF를 어떻게 변경하는지 확인하려면 미리보기 버튼을 클릭하십시오. 2-Up 및 4-Up 탭을 사용하여 다른 옵션을 봅니다. 여전히 너무 큰 경우 돌아가서 더 많은 프레임을 제거해야 할 수 있습니다. 20MB 미만의 파일 크기를 목표로 합니다. 전체 너비 섹션에 대한 GIF를 만드는 경우 웹에 적합한 크기로 가져오려면 프레임을 실제로 줄여야 합니다.

좋은 경험 법칙은 GIF 파일을 약 20MB 이하로 유지하는 것입니다. 그 이상은 너무 큽니다. 너무 많은 품질을 잃지 않고 10MB 미만으로 축소할 수 있다면 승자가 있습니다.

GIF에서 더 많은 프레임을 삭제하여 18MB로 줄였습니다. 그런 다음 GIFCompressor를 통해 이를 55% 줄였습니다. GIFCompressor는 품질 저하 없이 GIF 크기를 줄이는 무료 온라인 도구입니다. 최대 50MB 크기의 GIF를 업로드할 수 있습니다.

결론

보시다시피 Photoshop에서 비디오 장면에서 GIF를 만드는 것은 매우 쉽습니다. 유일한 주의 사항은 시작하는 비디오의 길이와 제거하는 프레임 수입니다. 충분히 제거하지 않으면 최종 파일이 정말 거대해지며 전혀 도움이 되지 않습니다. 마침내 원하는 모양의 GIF를 얻으려면 약간의 시험 실행이 필요할 수 있습니다. 이 가이드와 같이 튜토리얼용 스크린샷의 GIF를 생성하는 경우 익숙해지고 매번 더 간단해질 것입니다.

emojoez/Shutterstock.com을 통한 추천 이미지