Hermoso의 네이티브 HTML 광고 템플릿 13종 중 하나입니다. 모델이 생성하는 대신 브라우저가 실제 마크업으로 렌더링하는 포맷입니다. 이 템플릿은 영상을 출력하며, 채울 수 있는 문구 슬롯 4개가 있고, 실행 전에 브랜드의 앱 스크린샷 2장이 필요합니다.
언제 쓰나요
앱 설치 캠페인과 소프트웨어 출시에 맞습니다. 제품 필름에 대한 앱 브랜드의 답이며, 모델이 인터페이스를 지어내지 않고 화면을 보여 줄 수 있는 유일한 방법입니다.
반드시 지켜야 할 것
인터페이스는 실제 스크린샷으로 만든 DOM으로 렌더링되므로 픽셀 단위로 정확하고 읽기 쉽습니다. 화면은 최소 두 장이 필요합니다. 화면 한 장짜리 투어는 정지 광고입니다.
형식 한눈에 보기
- 출력: 영상.
- 문구 슬롯: 4개. 각 슬롯의 글자 수 한도는 추측이 아니라 레이아웃에서 계산됩니다.
- 필요한 에셋: 앱 스크린샷 2장.
- 템플릿 ID: app-ui-tour.
이 템플릿의 렌더링 방식
여기서는 이미지 모델이나 영상 모델로 아무것도 생성하지 않습니다. 이 포맷은 자체 완결된 HTML 페이지이고, 그 애니메이션은 시간의 순수 함수입니다. CSS 키프레임, 타이머, 무작위성이 없습니다. 렌더러가 헤드리스 Chrome에서 그 페이지를 프레임 단위로 넘기며 각 프레임을 캡처하고, ffmpeg로 조립해 H.264 파일을 만듭니다. 파일은 브랜드 엔드 카드로 크로스페이드되며 끝납니다.
여기서 두 가지가 따라옵니다. 렌더는 결정적입니다. 같은 입력은 같은 파일을 만들므로, 어제 괜찮아 보였던 포맷은 오늘도 괜찮아 보입니다. 또 화면의 모든 단어는 브라우저가 렌더링한 실제 텍스트이므로, 문구가 정확하고 어떤 해상도에서도 선명합니다. 전체 비용은 영상 생성이 아니라 크레딧 몇 개입니다. 그래서 이 포맷들을 대량으로 돌리기에 현실적입니다.
투어에는 화면이 몇 개 필요한가요?
최소 두 개입니다. 화면 한 개짜리 투어는 아이폰 테두리를 씌운 정지 광고일 뿐입니다. 화면은 실제 스크린샷을 CSS iPhone 안에 브라우저 DOM으로 렌더링한 것이므로, 인터페이스를 지어내는 대신 읽기 쉽게 유지됩니다.
다른 네이티브 템플릿
13개 템플릿은 모두 네이티브 광고 템플릿 색인에 있고, 더 넓은 카탈로그는 창작 레시피 색인에 있습니다.