Tỷ lệ khung hình và vùng an toàn.
Tỷ lệ khung hình iPhone
Tỷ lệ khung hình thực tế theo từng loại iPhone hiện đại:
- 6.9" (16 Pro Max):
1320 × 2868= 2.173 (≈ 19.5:9) - 6.7" (15 Pro Max, 15 Plus, 14 Plus, 13 Pro Max, 12 Pro Max):
1290 × 2796= 2.167 - 6.1" (16, 15, 14, 13, 12, 11):
1170 × 2532= 2.164 - 5.5" (8 Plus, 7 Plus, 6s Plus):
1242 × 2208= 1.778 (16:9)
Loại 5.5" là ngoại lệ — thiết bị cũ hơn dùng 16:9. Nếu bạn thiết kế cho cả hai, neo nội dung quan trọng vào dải dọc trung tâm để nó vẫn hiển thị ở cả hai tỷ lệ.
Vùng an toàn
App Store render ảnh chụp màn hình với góc bo (khớp với khung thiết bị) và có thể phủ metadata ứng dụng ở một số vị trí carousel. Theo thực tế:
- 80 px trên cùng có thể bị cắt bởi lớp phủ thanh trạng thái hoặc bán kính góc.
- 60 px cạnh mỗi bên là lề an toàn thực tế.
- 100 px dưới cùng đôi khi bị che bởi khả năng "cuộn để xem thêm" trên điện thoại nhỏ hơn.
Chú thích và CTA nên nằm giữa 80 và 600 px từ trên cùng của thiết kế — hiển thị ở kích thước thumbnail, không bị cắt ở kích thước đầy đủ.
Mắt nhìn vào đâu đầu tiên
Các nghiên cứu theo dõi mắt về carousel App Store (nhất quán qua phân tích của nhiều công ty ASO, 2024-2026) đặt sự chú ý mạnh nhất ở góc trên bên trái mỗi bảng. Văn bản chú thích quan trọng đọc tốt nhất khi trải dài phần tư trên cùng của bảng và dùng màu tương phản cao với nền. Hình ảnh render thiết bị hoạt động tốt hơn khi hơi nghiêng (8-15° quanh trục Y) thay vì thẳng đứng.
Lớp phủ vùng an toàn thực tế
Nếu bạn thiết kế trong Figma hoặc Photoshop, thêm các guide này vào canvas (dùng 6.9" làm cơ sở, chia tỷ lệ tương ứng cho các loại khác):
- Lề trên: 80 px
- Lề dưới: 100 px
- Lề bên: 60 px mỗi bên
- Vùng chú thích: 80–600 px từ trên
- Vùng thiết bị: 600–2400 px từ trên