실제 mm 치수 비율로 제작된 사진처럼 사실적인 3D 기기 프레임 4종.

20종 대신 4종인 이유

App Store Connect는 최신 제출에 스크린샷 크기 단 두 가지만 요구해요: 6.9" iPhone (1320 × 2868)과 13" iPad (2064 × 2752). 나머지 작은 클래스는 Apple이 자동으로 조정해요. Play는 휴대폰과 태블릿 하나씩을 원해요. 그래서 두 스토어를 완벽하게 커버하는 4종을 제공해요: iPhone 16 Pro Max, iPad Pro 13", Galaxy S25 Ultra, Galaxy Tab S9 Ultra — 각 클래스에서 가장 큰 모델이에요. 대부분의 생성기는 기능 목록을 더 화려하게 보이려고 20개 이상의 프레임을 제공하지만, 정확한 프레임을 적게 두면 "비율이 살짝 안 맞는" 엣지 케이스가 줄고 불필요한 것도 없어요.

"사실적"이 중요한 이유

App Store 스크린샷은 원본 크기로 보이지 않아요 — 대부분의 사용자는 200px 썸네일로 스크롤하며 지나쳐요. 비율이 조금이라도 틀린 프레임은 그 썸네일에서 "가짜 스톡 템플릿"처럼 보여요. Mokbi의 비율은 실제 기기의 밀리미터 단위 치수에서 가져왔어요 (iPhone 16 Pro Max: 163.0 × 77.6 mm → 2.101). 썸네일 크기에서도 기기처럼 보이도록 베젤은 물리적 모델보다 약 5% 두껍게 조정했어요.

선택 가능한 기기

iPhone: 16 Pro Max (6.9").
iPad: Pro 13" (M4).
Android: Galaxy S25 Ultra (휴대폰), Galaxy Tab S9 Ultra (태블릿).

자동 vs 고정

각 기기 레이어는 자동(선택한 내보내기 크기를 따름 — iPhone 6.9"에서 6.5"로 전환하면 자동 기기도 변형돼요)으로 설정하거나 특정 프레임에 고정할 수 있어요. 자동이 기본값이에요. 디자인 상 특정 모델이 필요할 때(예: iPhone 패널 옆에 iPad 전용 기능 표시) 고정을 사용해요.

기울기와 깊이

모든 기기는 WebGL을 통해 브라우저에서 실시간 렌더링되는 사진처럼 사실적인 3D 모델(GLB 형식)이에요. X·Y 축으로 기울이면 조명, 반사, 그림자가 실시간으로 반응해요. SVG 원근감 트릭과 달리 실제 메시를 회전시키는 방식이라 별도의 내보내기 단계 없이 브라우저에서 바로 전문적인 3D 렌더 수준의 품질을 얻을 수 있어요.

새 기기 추가 시기

Apple이나 Google이 스크린샷 크기에 실질적인 변화를 주는 새 클래스(예: 새 iPad Pro 크기)를 출시할 때 기기를 추가해요. 기능 목록을 늘리기 위해 새 기기를 추가하지는 않아요 — 그러면 스토어에 제출할 수 있는 결과는 달라지지 않으면서 유지 비용만 올라가요.

기기별 목업 생성기

각 프레임에는 전용 생성기 페이지가 있어요 — 스펙, 정확한 스크린샷 크기, 단계별 사용법, 해당 기기의 흔한 실수까지 담겨 있어요:

에디터 열기 →