Иконка приложения — первое, что видит пользователь в сторе. Если она не соответствует требованиям платформы, сабмит отклонят. Иконка tab bar, нарисованная без учёта оптического веса, запутывает навигацию. Мы решаем эти проблемы на основе 10+ лет опыта в мобильной разработке и более 50 реализованных проектов.
Почему важно соблюдать требования App Store и Google Play к иконкам?
App Store: требуется изображение 1024×1024px в PNG без альфа-канала. Xcode генерирует остальные размеры через Asset Catalog. До недавних версий iOS требовалось 20+ размеров, теперь современные версии Xcode принимают Single Size и масштабируют автоматически. Но мы всё равно проверяем результат на физических устройствах: алгоритм масштабирования иногда даёт нечёткие края на маленьких размерах. Согласно App Store Review Guidelines (Section 4.2), иконка должна быть без текста и отражать функционал приложения.
Google Play: 512×512px PNG для страницы приложения + адаптивная иконка для лончера. Адаптивная иконка — два слоя: foreground (108×108dp, контентная зона 72×72dp) и background. Начиная с Android 13 поддерживается monochromatic icon (третий слой). Без адаптивной иконки на Android 8+ лончер может обрезать иконку по кругу, и логотип окажется обрезанным.
| Платформа | Размер (базовый) | Особенности |
|---|---|---|
| iOS | 1024×1024px PNG | Single Size, Asset Catalog, проверка на devices |
| Android | 512×512px PNG + adaptive icon | Foreground 108×108dp, background, monochromatic (13+) |
Как выбрать между SF Symbols и кастомными иконками?
На iOS умолчанием стали SF Symbols — системная библиотека из 5000+ иконок, поддерживающая все веса шрифта, multicolor и анимацию (начиная с iOS 17). Если дизайн строится на SF Symbols, разработка получает бесплатно: масштаб, темизацию, доступность. Кастомные иконки нужны только там, где SF Symbols не покрывает — например, фирменные символы для финтеха или медицины. На Android аналог — Material Symbols с теми же возможностями.
Использование SF Symbols вместо кастомных иконок сокращает время разработки на 30–40% и ускоряет дизайн в 2–3 раза, так как не требует отрисовки и экспорта каждого элемента.
Форматы экспорта для разработчика
| Фреймворк | Формат | Инструмент |
|---|---|---|
| iOS/SwiftUI | PDF-вектор в Asset Catalog | Scales: Single Scale |
| Android | Vector Drawable XML | Android Studio → File → New → Vector Asset |
| React Native | SVG через react-native-svg | SVGR для трансформации в компоненты |
| Flutter | SVG через flutter_svg | FlutterIcon.com для конвертации |
SVG должен быть чистым: без лишних групп, без трансформаций на корневом элементе, без embedded bitmap. Проверяем в Figma перед экспортом: Outline Stroke на всех обводках, Flatten на сложных булевых операциях.
Что входит в работу по созданию иконок
- Анализ требований — изучаем дизайн-макет, платформенные гайдлайны, стилистику.
- Проектирование сетки — выбираем единый размер (24×24 или 28×28pt) и оптический вес.
- Рисование — создаём иконки в Figma с учётом визуального выравнивания.
- Экспорт — подготавливаем файлы для каждой платформы (PDF, XML, SVG).
- Верификация — проверяем на физических устройствах и в симуляторах.
- Передача — отдаём исходники и готовые наборы разработчику.
Чек-лист проверки иконок перед отправкой в магазин
- Размеры соответствуют требованиям App Store и Google Play
- Отсутствует альфа-канал (iOS)
- Адаптивная иконка корректно отображается на Android 8+
- Иконки интерфейса оптически выровнены
- Файлы экспортированы без лишних группировок
Набор иконок для приложения
Типичный набор для средней сложности приложения: 30–80 иконок. Tab bar (4–5 штук), toolbar actions (8–15), иконки категорий (10–30), системные (закрыть, назад, поделиться). Все иконки рисуем в единой сетке с одинаковым визуальным весом — оптическое выравнивание, а не математическое. Круглая иконка должна быть чуть больше квадратной того же размера, чтобы выглядеть одинаково.
Срок — 2–3 дня на полный набор иконок для среднестатистического приложения. Стоимость рассчитывается индивидуально, качество подтверждено опытом более 50 проектов. Закажите разработку иконок под ключ — свяжитесь с нами для оценки вашего проекта. Получите консультацию по иконкам вашего приложения.