Иконка приложения: размеры и альфа-канал в App Store и Play

У вас один логотип и два магазина приложений, и файл, который устраивает Apple, — не тот файл, который нужен Google. Всплывает это в худший момент: сборка готова, а загрузка раз за разом падает из-за альфа-канала.

Apple нужна квадратная иконка 1024x1024 с непрозрачным фоном. Play нужен 32-битный PNG 512x512, который технически поддерживает альфу — но, по собственному гайдлайну Google, использовать её не стоит. И ни один из магазинов не ждёт файл с готовой отделкой: оба накладывают свои скругления и эффекты уже после загрузки. Разберём, что требует каждый и как получить оба файла из одного логотипа.

Apple: 1024 пикселя, квадрат, ничего прозрачного

В Human Interface Guidelines у Apple размер макета иконки для iOS, iPadOS и macOS указан как 1024x1024 px, квадрат, в sRGB, Gray Gamma 2.2 или Display P3. Предпочтительный путь у Apple теперь — Icon Composer: вы импортируете слои переднего плана и задаёте фон прямо в инструменте. Но сведённое изображение по-прежнему допустимо — слои дают больше контроля, но не обязательны.

Тех, кто сдаёт приложение впервые, останавливает именно фон. Инструкция Apple для импортированного слоя фона предельно прямая: он должен быть в край и непрозрачный. PNG 1024 px с прозрачным фоном — невалидная иконка для App Store: загрузите такой, и App Store Connect вернёт ITMS-90717: иконка App Store не может быть прозрачной или содержать альфа-канал. Единственное исключение — тёмный вариант иконки: его Apple просит сдавать как раз с прозрачным фоном, чтобы сквозь него был виден системный фон. Во всех остальных случаях решите, какой цвет стоит за вашим знаком, и запеките его в файл.

На других платформах Apple размер макета меняется: watchOS 1088x1088 и visionOS 1024x1024, обе с круглой маской, а у tvOS — горизонтальный 800x480. Меняется и способ сборки: иконки tvOS и visionOS собираются многослойным стеком изображений в Xcode, а не в Icon Composer.

Google Play: 512 пикселей, альфа разрешена, прозрачность всё равно ошибка

Иконка в карточке Play — это 32-битный PNG с альфа-каналом, 512x512 px, sRGB, максимум 1024KB. Прочитайте только это — и прозрачная вырезка, которая у вас уже есть, покажется подходящей.

Гайдлайн Google по дизайну иконок эту дверь закрывает: у прозрачных ассетов проступает цвет фона интерфейса Google Play. Ваш знак начинает висеть на той поверхности, которую нарисует Play, а тёмный логотип в тёмной теме исчезает. Совет Google: выберите цвет фона, подходящий вашему бренду.

Ещё два правила Play: никаких плашек и надписей, намекающих на рейтинг, цену или категории Play, и иконка в карточке магазина — не то же самое, что значок запуска на устройстве. Эта адаптивная иконка собирается из слоёв 108x108 dp, и гарантированно не обрезается OEM-маской только внутренняя зона 66x66 dp.

Как получить оба файла из одного логотипа

Оба файла начинаются с одного и того же — с вашего знака, чисто отделённого от того, на чём он лежал. Если логотип существует только как JPEG от подрядчика или фотография печатного бланка, сначала вырежьте его, чтобы форма осталась изолированной, с настоящим альфа-каналом. remover.bg снимает знак с фона и позволяет положить его на сплошной или свой фирменный цвет прямо в редакторе — это и есть тот шаг сведения, которого требует Apple.

Порядок, который работает:

1. Уберите фон, чтобы логотип остался сам по себе. Проверьте края на тёмном цвете, а не на белом — тонкие штрихи и засечки прячут свои огрехи на белом превью.
2. Задайте фон фирменного цвета и экспортируйте PNG. Прозрачную версию тоже сохраните — для пресс-китов и фавиконок.
3. В своём графическом редакторе положите этот PNG на квадратный холст и экспортируйте 1024x1024 для Apple и 512x512 для Play. Размеры — задача редактора, а не сервиса удаления фона.

Если логотип отсканирован или снят на камеру, как удалить фон с логотипа разбирает пограничные случаи, а гид по прозрачным PNG объясняет, почему такой мастер-файл стоит хранить.

Пусть углы и тень рисуют сами магазины

Play на этот счёт конкретен: он сам скругляет углы радиусом 30% от размера иконки, сам добавляет тень после загрузки и просит не делать ни того, ни другого. Apple маскирует ваш квадрат в системный скруглённый прямоугольник и накладывает собственные блики, преломление и полупрозрачность, предупреждая: заранее замаскированные слои портят эти эффекты и делают края зазубренными.

Итого: никаких заранее скруглённых углов, никакой тени, никаких фасок и свечения. Эта сдержанность касается именно иконок — на фото товара реалистичная контактная тень как раз и не даёт предмету выглядеть приклеенным.

Раз маску накладывают оба магазина, держите важную часть знака по центру. Apple прямо советует центрировать основное содержимое, чтобы маска его не срезала. Сетка ключевых линий Play работает не так, как принято думать: это ориентир для позиционирования, а не граница. Google предписывает по возможности заполнять графикой весь ассет и отступать к ключевым линиям только тогда, когда форма вокруг логотипа — часть бренда. Отступите от края на всякий случай — и ваша иконка отрисуется заметно мельче каждой соседней в выдаче.

Радиус в 30% съедает именно углы, так что текстовый логотип (wordmark), загнанный в них, теряет концы. А на круглых масках watchOS и visionOS текстовый логотип в край теряет первую и последнюю буквы целиком.

Перед загрузкой

• Apple: PNG 1024x1024, квадрат, полностью непрозрачный, углы острые.
• Play: 32-битный PNG 512x512, максимум 1024KB, фон фирменного цвета вместо прозрачности, углы острые.
• Одинаковая графика и одинаковые цвета в обоих магазинах: пользователь должен узнать одно приложение, а не два.
• Посмотрите обе иконки в размере превью. Детали, которые читаются на 1024, на 40 пикселях пропадают.

Разберитесь с иконкой один раз — и дальше этот вопрос закрыт для каждого следующего релиза.