제품 페이지 헤더는 사람들이 App Store에서 앱을 열었을 때 가장 먼저 보는 요소입니다. Apple이 WWDC26에서 추가했으며, iOS 27과 iPadOS 27 이상에서 표시됩니다. 이 글에서는 정확한 크기, 디자인할 때 지켜야 하는 세이프 영역, 그리고 헤더가 표시되는 곳을 정리합니다.
짧게 답하면: 제품 페이지 헤더는 3840 × 1646픽셀(21:9)이며, 투명도가 없는 JPEG 또는 PNG입니다. 중요한 요소는 모두 가운데의 1646 × 661 아트 세이프 영역 안에 두세요. 같은 크기의 5–30초 동영상을 대신 쓸 수도 있습니다.
제품 페이지 헤더란 #
제품 페이지 맨 위, 앱 아이콘과 이름, 스크린샷 위에 들어가는 가로로 넓은 이미지나 동영상입니다. 스크린샷과 달리 앱 화면을 보여 줄 필요가 없습니다. Apple은 헤더를 브랜드, 시즌 프로모션, 새 콘텐츠를 알리는 데 써서 '제품 페이지 전체의 분위기를 정하라'고 제안합니다.
헤더는 세 가지 크리에이티브 에셋 중 하나입니다. 나머지는 검색 결과 에셋과, 두 자리를 모두 채울 수 있는 유니버설 에셋입니다. 세 가지가 어떻게 맞물리는지는 WWDC26 변경 사항 개요에서 설명합니다.
표시되는 곳 #
- 제품 페이지 맨 위. iPhone과 iPad, 모든 방향에서 표시됩니다.
- 맞춤형 제품 페이지. 페이지마다 자체 헤더를 둘 수 있으므로, 광고나 웹사이트의 링크를 타고 온 사람에게 어울리는 비주얼을 보여 줄 수 있습니다.
- 제품 페이지 최적화. 여러 헤더 비주얼을 서로 비교해 테스트할 수 있습니다.
- 앱이 피처드될 때. Apple은 App Store에서 앱을 피처드할 때 크리에이티브 에셋이 쓰일 수 있다고 밝혔습니다.
헤더는 iOS 27과 iPadOS 27 이상에서만 표시됩니다. 이전 버전을 쓰는 사람에게는 헤더 없는 제품 페이지가 보입니다.
제품 페이지 헤더 크기 #
| 이미지 | 동영상 | |
|---|---|---|
| 크기 | 3840 × 1646픽셀 | 3840 × 1646픽셀 |
| 화면비 | 21:9 | 21:9 |
| 형식 | .jpeg, .jpg, .png | .mov, .m4v, .mp4 |
| 프레임 레이트 | — | 30fps 또는 60fps |
| 길이 | — | 5초에서 30초 |
| 기타 규칙 | 알파 채널이나 투명도 불가 | 반복 재생, 기본 음소거(사람들이 해제 가능) |
크기는 범위가 아니라 정확히 이 값이어야 합니다. 헤더 자리에는 5244 × 2950 PNG 유니버설 에셋을 쓸 수도 있습니다. 자세한 내용은 유니버설 에셋 가이드를 참고하세요. 크기는 Apple의 크리에이티브 에셋 사양을 기준으로 하며, 2026년 10월 21일에 확인했습니다.
헤더 세이프 영역 #
Apple은 문서에 세이프 영역 수치를 적어 두지 않았습니다. 수치는 Photoshop과 Pixelmator용 헤더 템플릿에 아트 세이프 영역 상자로 들어 있습니다. 실제 비율대로 그리면 다음과 같습니다.
제품 페이지 헤더 21:9
3840 × 1646 px
세이프 영역 1646 × 661, 캔버스의 43% × 40%
| 픽셀 | 캔버스 대비 비율 | |
|---|---|---|
| 캔버스 | 3840 × 1646 | 100% |
| 아트 세이프 영역 | 1646 × 661 | 너비의 43%, 높이의 40% |
| 세이프 영역 위치 | x 1097, y 493(왼쪽 위 모서리) | 가로세로 모두 가운데 |
| 좌우 여백 | 각각 1097 | |
| 상하 여백 | 각각 493 |
상자가 꽤 작습니다. 하나의 이미지로 세로로 든 iPhone과 가로로 든 iPad를 모두 채워야 하므로, 너비의 절반 이상과 높이의 대부분이 잘릴 수 있습니다. 그래서 다음을 지키세요.
- 텍스트, 로고, 핵심 요소는 상자 안에 두세요. 헤드라인, 캐릭터의 얼굴, 제품 사진 같은 것들입니다.
- 나머지는 잘려도 괜찮은 것으로 채우세요. 배경, 텍스처, 가운데만 남아도 의미가 통하는 장면이 좋습니다.
- 가장자리에 맞춰 배치하지 마세요. 왼쪽 위 모서리에 둔 로고는 세이프 영역 밖이라 사라질 수 있습니다.
- 미리보기로 확인하세요. App Store Connect의 미리보기는 제출하기 전에 iPhone과 iPad에서, 두 방향과 모든 언어로 페이지를 보여 줍니다.
Apple이 알려 주는 디자인 팁 #
Apple의 에셋 가이드에서 정리했습니다.
- 하나의 분명한 아이디어. 빽빽하고 어수선한 헤더는 눈에 들어오지 않습니다.
- 처음 방문한 사람을 위해 디자인하세요. 앱을 처음 듣는 사람에게 가장 매력적인 것을 보여 주세요.
- 텍스트는 넣더라도 짧게. 이미지를 설명하기보다 이미지에 무언가를 더하는 짧은 문구를 쓰고, 지원하는 모든 언어로 번역하세요.
- 가격, 할인, URL, 저작권 기호는 넣지 마세요. 다른 플랫폼이나 스토어, Editor's Choice 같은 Apple 수상 내역도 넣으면 안 됩니다.
- 4+ 등급에 맞는 콘텐츠를 쓰세요. 앱의 연령 등급이 더 높더라도 마찬가지입니다.
- 동영상이라면: 눈에 띄는 포스터 프레임을 고르고, 가장 좋은 장면으로 시작하고, 자연스럽게 반복되도록 만들고, 소리 없이도 통하게 하세요.
헤더를 업로드하는 방법 #
방법은 두 가지이며, 둘 다 App Review를 거칩니다.
- 앱 버전과 함께. App Store Connect의 버전 페이지에 헤더를 추가하고, 미리 본 다음, 버전을 제출합니다.
- Asset Library에서. 이미지나 동영상만 따로 업로드해 심사에 제출합니다. 새 버전이 필요 없습니다.
에셋이 승인되면 헤더를 그 에셋으로 바꾸고 바로 게시할 수 있습니다. 그래서 시즌 헤더나 캠페인 헤더는 출시가 아니라 간단한 변경 작업이 됩니다.
헤더가 스크린샷을 대체하지는 않습니다 #
스크린샷은 여전히 헤더 바로 아래에 표시되고, 사람들이 결정하기 전에 넘겨 보는 것도 여전히 스크린샷입니다. 헤더와 스크린샷은 같은 색상, 타이포그래피, 메시지를 쓰는 한 세트로 계획하고, 업데이트도 함께 하세요.