안드로이드 앱 아이콘을 브랜드별로 자동화 생성하려는 프로젝트에서 겪은 실무 경험을 바탕으로, Adaptive Icon 설계 및 Safe Zone에 대한 내용을 정리한 글입니다.
✨ 목표
- 브랜드별로 하나의 원본 이미지(1024x1024)만 관리
- Android/iOS 공통으로 사용할 수 있는 고해상도 아이콘 자동 생성
- Android Studio의 Image Asset Tool에서 Trim: No / Scaling: 100% 조건에서도 시각적으로 안전한 결과 확보
🔹 Android Adaptive Icon 기본 구조
Android의 Adaptive Icon은 다양한 형태의 마스크(circle, squircle, rounded square 등)에 대응하기 위해 Safe Zone 개념을 제공합니다.
| 항목 | 기준 | 1024px 기준 환산 |
|---|---|---|
| 전체 크기 | 108dp | 1024px |
| Safe Zone | 66dp | 626px |
| 마스크에 잘리지 않는 보장 영역 | 중앙 626x626 px |
🔢 Safe Zone 적용 전략
1. “Safe Zone”은 626px보다 작게 만드는 것이 가장 안전
- 로고가 Safe Zone과 거의 같은 크기로 최대화될 경우, 마스크 가장자리에서 잘릴 수 있음
- 조금 더 여백 있게 디자인하고 싶을 경우: 시각적 Safe Zone 권장 = 580~600px
🔹 Android Studio Image Asset Tool 구성 클릭 사용 시 참고사항
| Trim | Scaling | 결과 |
|---|---|---|
| No | 100% | 전체 1024 기준, Safe Zone 범위를 지켜야 안전 |
| Yes | Any | 실제 로고 영역 기준으로 자동 trimming 및 scaling 적용됨 |
“Trim: Yes”가 더 좋아 보이는 이유는, 실제 이미지의 투명 영역을 제거한 상태로 scaling되기 때문. 하지만 이건 우연히 그렇게 보일 뿐이며, 마스크마다 잘림이 다를 수 있음.
🔹 실전 예시: 로고 리사이징 기준
1. 공식 Safe Zone 기준 (정확히 맞춤)
- 전체 이미지: 1024 x 1024
- 로고 크기: 626 x 626 px (66dp)
- 결과: Trim: No, Scaling: 100% → 안전하게 마스크 내 유지
2. 시각적 안정성 고려 (고급형)
- 전체 이미지: 1024 x 1024
- 로고 크기: 580 x 580 px
- 결과: 마스크 내 여백이 있어 고급스럽고 안정감 있는 느낌
🚩 결론 및 추천
| 목적 | 로고 크기(px) | 추천 여부 |
|---|---|---|
| 기능적으로 안전한 아이콘 | 626 x 626 | ✅ 공식 기준, 무조건 안전 |
| 시각적으로 고급스럽고 여유 있는 느낌 | 580 x 580 | ⭐ 실전에서 더 많이 씀 |
📄 팁
- 로고 디자인 의뢰 시: “전체 1024 기준, 로고는 중앙 580px 또는 626px 영역에 배치해주세요” 라고 가이드
- 실제 마스크 적용 결과는 Android Studio에서 미리 확인 가능 (circle, squircle, rounded square 모두 체크)
- iOS AppIcon에도 동일 이미지 사용 가능 (마스킹 없음, 단 여백이 있을수록 자연스러움)
Hello!