App Icon
hig
App Icon
A unique, memorable icon communicates the purpose and personality of your experience and can help people recognize your app or game at a glance in the App Store and on their devices.
독창적이고 기억할 수 있는 아이콘은 당신의 경험의 목적과 개성을 이야기해주고 사람들이 그들의 장치에서, 앱 스토어에서 한 눈에 당신의 앱 (혹은 게임)을 알아차릴 수 있도록 도와준다.
Check List
- 아이콘이 간단한가?
- 아이폰, 아이패드, 맥 모두에서 잘 어울리는가?
- 텍스트가 들어가 있는가?
- 있다면, 꼭 필요한 경우인가?
- 사진을 아이콘으로 만든 것인가?
- UI 컴포넌트를 복제한 부분이 있는가?
- 가장자리에 여백이 있는가?
- 앱 아이콘의 대체제를 제공하는가?
- 애플의 하드웨어 제품의 복제품을 사용하는가?
Best practices
- Embrace simplicity.
- 간단해야 한다.
- Create a design that works well on multiple platforms so that it feels at home on each.
- 모든 플랫폼에서 잘 어울리는 디자인을 만들어야 한다.
- Prefer including text only when it’s an essential part of your experience or brand.
- 당신의 경험 혹은 브랜드의 필수적인 부분으로 텍스트가 필요할 경우에만 아이콘에 포함시켜야 한다.
- Prefer graphical images to photos and avoid replicating UI components in your icon.
- 사진보다 그래픽 이미지를 선호하고, UI 컴포넌트를 당신의 아이콘에 복제하는 것을 피해야 한다.
- If needed, optimize your icon for the specific sizes the system displays in places like Spotlight search results, Settings, and notifications.
- 필요하다면, 당신의 아이콘을 특정 사이즈로 최적화해라.
- Design your icon as a full-bleed square image.
- 가장자리의 여백 없는 이미지로 아이콘을 디자인해라.
- Consider offering an alternate app icon.
- 대체 앱 아이콘을 제공하는 것을 고려해라.
- Don’t use replicas of Apple hardware products.
- 애플의 하드웨어 제품의 복제품을 사용하지 마라.
Platform considerations
iOS, iPadOS
- Don’t add an overlay or border to your Settings icon.
- 너의 아이콘에 overlay 혹은 border를 추가하지 마라.
macOS
- Consider depicting a familiar tool to communicate what people use your app to do.
- If you depict real objects in your app icon, make them look like they’re made of physical materials and have actual mass.
- Use the drop shadow in the icon-design template.
- Consider using interior shadows and highlights to add definition and realism.
- Avoid defining contours that suggest a shape other than a rounded rectangle.
- Keep primary content within the icon grid bounding box; keep all content within the outer bounding box.
tvOS
- Use appropriate layer separation.
- Use gradients and shadows cautiously.
- Leverage varying opacity levels to increase the sense of depth and liveliness.
- Make sure your Home Screen icon adheres to safe-zone specifications.
watchOS
- Avoid using black for your icon’s background.