영상 튜토리얼: Figma 배너 내보내기에 동영상 임베드 추가

Bannerify 플러그인으로 배너에 동영상 파일 임베드를 추가하는 방법을 보여 주는 영상이에요.

YouTube/Vimeo 링크는 작동하지 않아요. 먼저 Dropbox 같은 서비스에 동영상을 업로드한 다음, .mp4 동영상 파일 URL로 직접 연결해야 해요.

호스팅된 동영상 URL은 기본적으로 HTML 내보내기에서 원격으로 유지돼요. Bannerify는 동영상을 ZIP으로 다운로드하지 않고, .mp4/.webm 동영상 임베드 직접 URL을 내보낸 HTML에 그대로 남겨 둬요. 호스팅된 동영상 파일을 HTML 내보내기 ZIP에 포함하려면 임베드 URL 필드 옆의 Download videos into ZIP을 켜세요. Google Ads HTML5와 Google App Campaign Playable 업로드는 ZIP 업로드에서 동영상 파일 포함을 지원하지 않으므로, 이 경우에는 여전히 동영상 임베드 URL이 포함되지 않아요.

Figma Plugin API는 Figma 파일 레이어에서 동영상 파일을 직접 읽는 기능을 지원하지 않지만, Bannerify에서는 .mp4나 .webm 파일로 직접 연결되는 URL을 붙여 넣어 텍스트가 아닌 타임라인 레이어에 동영상을 임베드할 수 있어요.

동영상 파일은 Pixabay 같은 사이트에서 무료 스톡 동영상을 찾아보거나, 직접 만든 .mp4나 .webm 파일을 Dropbox나 Backblaze B2 같은 파일 호스팅 서비스에 업로드한 다음, 애니메이션용 URL 링크를 복사해 Bannerify에서 사용하면 돼요.

기본적으로 동영상은 자동으로 반복 재생되지만, 필요하면 Loop Embed 토글을 꺼서 바꿀 수 있어요.

레이어에서 동영상 애니메이션을 제거하려면 Settings 아이콘 버튼을 다시 클릭하고 동영상 임베드 입력란에서 URL을 지우세요.

Dropbox 링크를 복사한다면 동영상 파일 자체로 직접 연결되는 링크인지 확인해 주세요(URL에 .mp4가 들어 있어야 해요). Dropbox 화면의 어느 부분에서 보느냐에 따라 Dropbox의 “Share”/“Copy Link” 버튼이 폴더 전체로 연결되는 경우가 있어요.

동영상 파일 URL 일괄 적용 다른 레이어 설정과 마찬가지로 일괄 적용 기능을 사용해 동영상 파일 URL 설정을 여러 레이어에 한꺼번에 적용할 수도 있어요.

스프레드시트 기반 동영상 및 Lottie 교체 변형 워크플로를 사용하면 내보낼 때 스프레드시트 행마다 임베드 미디어를 바꿀 수도 있어요. .mp4, .webm, .json 직접 URL이나, 업로드한 ZIP 소스에 함께 들어 있는 같은 이름의 .mp4, .webm, .json 파일을 사용하세요.

동영상 임베드의 전체 크기는 4mb 미만으로 유지하세요. 그래야 Chrome이 시행 중인 과도한 광고 정책 업데이트로 배너 광고가 차단되지 않아요.