Photo by Parampreet Chanana on Pixabay
애플의 제품에서 사용되는 응용 프로그램(애플리케이션, 이하 앱)을 사거나 팔 수 있는 플랫폼을 앱 스토어 App store라고 한다. 앱 스토어에는 개인 개발자 기준으로 연 99달러(한화 약 12만 원 이내)를 지불하면 자신이 개발한 앱을 무제한으로 업로드할 수 있는데 사전에 앱을 등록하고 심사하는 과정을 거쳐야 한다. 앱스토어의 가장 큰 의의는 소프트웨어 개발자들 자신들이 만든 소프트웨어에 대해서 당당하게 심사받고 제대로 된 보상을 받을 수 있는 일종의 시장을 열었다는 데 있다.
이는 애플 사용자에게도 큰 이점이다. 일단 앱 스토어에 올라온 앱은 애플의 검수를 통과했다는 것을 잘 알고 있기 때문에 소프트웨어에 대한 대중들의 신뢰도가 매우 높은 편이다. 여기에서 알 수 있듯, 애플의 앱 심사는 매우 까다로운 편이고 따라서 제품을 만드는 팀의 일원이라면 가이드를 미리 숙지해놓는 것이 좋다. 특히, 제품 디자이너는 기본적으로 앱을 설계할 때부터 OS 별 제약사항을 잘 알고 있어야 한다. 자칫 잘 못 하다가는 시간을 들여 앱을 만들었지만 심사에 탈락하고 규정에 맞게 다시 화면을 수정해야 하는 일이 생길 수 있다.
앱 등록은 앱 스토어 커넥트 App Store Connect를 이용하게 된다. 여기서 앱 스토어에 판매 중인 앱을 관리하고 제출하며, 테스트 플라이트 TestFlight로 앱의 베타 버전을 배포할 수 있다. 또한, 등록 시 필요한 내용들을 앱 스토어 커넥트 도움말에 자세하게 설명해놓았다.
이 과정에서 필수로 등록해야 하는 항목들이 있는데 제품 디자이너는 주로 앱 아이콘이나 스크린 샷 같은 이미지를 준비하게 된다. 앱의 상세페이지를 제품 페이지라고 하며, 제품 페이지에는 최대 3개의 앱 미리보기와 10개의 스크린샷을 업로드할 수 있다. 앱이 현지화되지 않았거나 여러 기기의 크기에서도 내용이 동일한 경우, 가장 높은 해상도의 스크린샷을 제공하면 된다.
아래의 내용은 2020년 1월 기준이며, 최신의 내용은 언제나 공식 홈페이지(https://help.apple.com/app-store-connect)를 참고하는 것을 권장한다.
1. App Store 아이콘
앱 스토어의 여러 섹션에서 앱을 나타내는 데 필요한 아이콘을 제공해야 한다. 앱 아이콘을 만들 때에는 때, Human Interface Guidelines를 참고 하자.
https://developer.apple.com/design/human-interface-guidelines/ios/icons-and-images/app-icon/
모바일 제품을 다루는 디자이너에게 애플의 HIG나 구글의 머터리얼 디자인 Material Design은 바이블 같은 존재로 자주 읽어두면 정말 도움이 많이 된다.
앱 아이콘 속성
속성 | 값 |
포맷 | PNG |
색상값 | sRGB or P3 (Color Management 참고) |
레이어 | 투명도가 없는 단일 레이어 |
해상도 | Image Size and Resolution 참고 |
모양 | 둥근 모서리가없는 정사각형 |
앱 아이콘 크기
기기 또는 플랫폼 | 아이콘 크기 |
iPhone 120px × 120px (60pt × 60pt @2x) |
180px × 180px (60pt × 60pt @3x) |
120px × 120px (60pt × 60pt @2x) | |
iPad Pro | 167px × 167px (83.5pt × 83.5pt @2x) |
iPad, iPad mini | 152px × 152px (76pt × 76pt @2x) |
App Store | 1024px × 1024px (1024pt × 1024pt @1x) |
2. 앱 미리 보기
앱 미리 보기는 사용자가 App Store 제품 페이지에서 시청할 수 있는 짧은 동영상으로 주로 앱의 기능 및 UI를 담고 있다. 사용자가 제품 페이지를 볼 때 앱이 음소거된 오디오로 자동 재생되므로 비디오의 처음 몇 초가 시각적으로 매력적이어야 한다. 비디오가 자동 재생되지 않을 때에는 앱 미리 보기 포스터 프레임이 보인다.
마케팅 가이드라인 https://developer.apple.com/app-store/app-previews/
앱 미리보기 요구사항
- Mac은 macOS 10.10이상 버전이거나, Safari 8 이상의 버전에서 실행된다.
- iPhone용 5.5형 디스플레이는 iOS 8 이상 버전에서 실행되고, iPad 또는 Apple TV의 경우 12.9형 디스플레이에서 실행된다.
3. 스크린샷
각 스크린샷은 앱의 주요 이점이나 기능에 집중하여 가치를 충분히 전달할 수 있도록 해야 한다. 그리고 앱이 다크 모드를 지원하는 경우, 사용자가 미리 경험할 수 있도록 적어도 하나 이상의 스크린을 포함하는 것이 좋다.
iPhone의 경우 6.5형 iPhone Xs Max와 5.5형 기기(iPhone 6s Plus, iPhone 7 Plus, iPhone 8 Plus)의 스크린샷이 요구된다. 그리고 iPad의 경우 12.9형 iPad Pro (2세대)와 12.9형 iPad Pro (3세대)의 스크린샷이 필요하다. 해당 스크린샷들은 작은 크기의 기기에서 축소되어 노출된다.
스크린샷 사양
기기 크기 또는 플랫폼 |
스크린샷 크기 |
요구 사항 |
스크린샷 소스 |
6.5형(iPhone 11 Pro Max, iPhone 11, iPhone X S Max, iPhone XR) |
1242 x 2688 픽셀 (세로) 2688 x 1242 픽셀 (가로) |
앱이 iPhone에서 실행되는 경우 필요 |
6.5형 스크린샷 업로드 |
5.8형(iPhone 11 Pro, iPhone X, iPhone XS) |
1125 x 2436 픽셀 (세로) 2436 x 1125 픽셀 (가로) |
앱이 iPhone에서 실행되며 6.5인치 스크린샷이 제공되지 않은 경우 필요합니다 |
기본값: 크기가 조정된 6.5형 스크린샷 대안: 5.8형 스크린샷 업로드 |
5.5형 (iPhone 6s Plus, iPhone 7 Plus, iPhone 8 Plus) |
1242 x 2208 픽셀 (세로) 2208 x 1242 픽셀 (가로) |
앱이 iPhone에서 실행되는 경우 필요 |
5.5형 스크린샷 업로드 |
4.7형 (iPhone 6, iPhone 6s, iPhone 7, iPhone 8) |
750 x 1334 픽셀 (세로) 1334 x 750 픽셀 (가로) |
iPhone 및 5.5형 스크린샷에서 앱이 실행되는 경우 필요합니다. |
기본값: 크기가 조정된 5.5형 스크린샷 대안: 4.7형 스크린샷 업로드 |
4형 (iPhone SE) |
640 x 1096 픽셀 (상태 표시줄을 포함하지 않는 세로 비율) 640 x 1136 픽셀 (상태 표시 줄을 포함하는 있는 세로 비율) 1136 x 600 픽셀 (상태 표시줄을 포함하지 않는 가로 비율) 1136 x 640 픽셀 (상태 표시줄을 포함하는 가로 비율) |
앱이 iPhone에서 실행되고, 5.5형 또는 4.7형 스크린샷이 제공되지 않은 경우 필요합니다. |
기본값: 크기가 조정된 5.5 또는 4.7형 스크린샷 대안: 4형 스크린샷 업로드 |
3.5형 (iPhone 4s) |
640 x 920 픽셀 (상태 표시줄을 포함하지 않는 세로 비율) 640 x 960 픽셀 (상태 표시줄을 포함하는 세로 비율) 960 x 600 픽셀 (상태 표시줄을 포함하지 않는 가로 비율) 960 x 640 픽셀 (상태 표시줄을 포함하는 가로 비율) |
앱이 iPhone에서 실행되며 5.5인치 스크린샷이 제공되지 않은 경우 필요합니다 |
기본값: 크기가 조정된 5.5, 4.7 또는 4형 스크린샷 대안: 3.5형 스크린샷 업로드 |
12.9형(3세대 iPad Pro) |
2048 x 2732 픽셀 (세로) 2732 x 2048 픽셀 (가로) |
앱이 iPad에서 실행되는 경우 필요 |
12.9형 iPad Pro (3 세대) 스크린샷 업로드 |
12.9형(2세대 iPad Pro) |
2048 x 2732 픽셀 (세로) 2732 x 2048 픽셀 (가로) |
앱이 iPad에서 실행되는 경우 필요 |
업로드 12.9형 iPad Pro (2 세대) 스크린샷 |
11형 (iPad Pro) |
1668 x 2388 픽셀 (세로) 2388 x 1668 픽셀 (가로) |
앱이 iPad에서 실행되며, 12.9형 iPad Pro (2 세대) 스크린샷이 제공되지 않는 경우 필요 |
기본값: 크기가 조정된 12.9형 iPad Pro (3 세대) 스크린샷 대안: 11형 스크린샷 업로드 |
10.5형(7세대 iPad, iPad Pro, iPad Air) |
1668 x 2224 픽셀 (세로) 2224 x 1668 픽셀 (가로) |
앱이 iPad에서 실행되며, 12.9형 iPad Pro (2 세대) 스크린샷이 제공되지 않는 경우 필요 |
기본값: 크기가 조정된 12.9형 iPad Pro (2 세대) 스크린샷 대안: 10.5형 스크린샷 업로드 |
9.7형 (iPad, iPad mini) |
고해상도: 1536 x 2008 픽셀 (상태 표시 줄 미포함) 1536 x 2048 픽셀 (상태 표시줄을 포함하는 세로 비율) 2048 x 1496 픽셀 (상태 표시줄을 포함하지 않는 가로 비율) 2048 x 1536 픽셀 (상태 표시줄을 포함하는 가로 비율) 표준 해상도: 768 x 1004 픽셀 (상태 표시줄을 포함하지 않는 세로 비율) 768 x 1024 픽셀 (상태 표시줄을 포함하는 세로 비율) 1024 x 748 픽셀 (상태 표시 줄 미포함) 1024 x 768 픽셀 (상태 표시줄을 포함하는 가로 비율) |
앱이 iPad에서 실행되고 12.9형 iPad Pro (2 세대) 또는 10.5형 스크린샷이 제공되지 않는 경우 필요 |
기본값: 크기가 조정된 12.9형 iPad Pro (2 세대) 또는 10.5형 스크린샷 대안: 9.7형 스크린샷 업로드 |
Mac |
다음 중 하나를 16:10 종횡비로 제공 1280 x 800 1440 x 900 2560 x 1600 픽셀 2880 x 1800 |
Mac 앱에 필요 |
목록에 나열된 크기 중 하나로 Mac 스크린샷 업로드 |
Apple TV |
1920 x 1080 픽셀 3840 x 2160 픽셀 |
Apple TV 앱에 필요 |
목록에 나열된 크기 중 하나로 Apple TV 스크린샷을 업로드 |
Apple Watch |
다음 중 하나를 수행합니다. 312 x 390 픽셀 (Series 3) 368 x 448 픽셀 (Series 5 및 Series 4) |
Apple Watch 앱에 필요 |
목록에 나열된 크기 중 하나로 Apple Watch 스크린샷을 업로드합니다. |
*참고:
https://namu.wiki/w/App%20Store?from=%EC%95%B1%EC%8A%A4%ED%86%A0%EC%96%B4%EF%BB%BF
https://help.apple.com/app-store-connect/#/dev910472ff2
'UX & UI' 카테고리의 다른 글
디자이너 알아야 할 단위들 : #2 안드로이드 디자인 (0) | 2019.01.08 |
---|---|
디자이너가 알아야 할 단위들 : #1 iOS 디자인 (0) | 2019.01.07 |
UI 디자이너는 무슨 일을 하나요? (1) | 2016.10.14 |