Важное обновление гайдлайнов для иконок Google Play

Google Play внедряет новую систему иконок, которая позволяет лучше приспособить разнообразные графические материалы разработчиков к различным макетам интерфейса, форм-факторам и устройствам, а также обеспечить согласованность и более чистый внешний вид в Google Play.

Унифицированные формы визуально более привлекательны и легче усваиваются. Они помогают пользователям сосредоточиться на иллюстрациях, а не на форме. Они устраняют проблемы с выравниванием для лучшего представления окружающей информации, такой как заголовок, рейтинг и цена.

Важное обновление гайдлайнов для иконок Google Play
Freeform (произвольная форма)– оригинальный формат
Важное обновление гайдлайнов для иконок Google Play
Uniformed (унифицированный) – новый формат

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

Важное замечание: Если вы хотите узнать больше о создании APK launcher icons, которые отличаются от значков Google Play, описанных в этой статье, см. ресурсы ниже:

Следуйте этим рекомендациям по иконкам APK, чтобы узнать, как создавать адаптивные иконки лончера, представленные в Android 8.0 (уровень API 26).

Ознакомьтесь с принципами Material Design для иконок продуктов, включая рекомендации по дизайну иконок, формам, спецификациям и обработке.

Создание ресурсов

В этом разделе описываются некоторые рекомендации, которым вы должны следовать при создании визуальных ресурсов для своего приложения в Google Play.

Атрибуты

Картинка иконки может заполнить все пространство или вы можете создавать и размещать в сетке ключевых линий такие элементы, как логотипы. Размещая иллюстрацию, рекомендуется использовать ключевые линии.

Убедитесь, что ваши ресурсы соответствуют следующим характеристикам:

  • Окончательный размер: 512px x 512px
  • Формат: 32-bit PNG
  • Цветовое пространство: sRGB
  • Максимальный размер файла: 1024KB
  • Форма: Квадрат – Google Play динамически применяет маску. Радиус будет эквивалентен 20% размера иконки.
  • Тень: Отсутствует – Google Play динамически обрабатывает тени. Смотрите раздел «Тени» ниже.
Важное обновление гайдлайнов для иконок Google Play
Общий размер иконки
Важное обновление гайдлайнов для иконок Google Play
Ключевые линии иконки продукта

После загрузки актива Google Play динамически применяет маску с закругленными углами и тень для обеспечения согласованности всех иконок приложений / игр.

Важное обновление гайдлайнов для иконок Google Play
Слева – ваша новая иконка. На следующих трех изображениях справа показана динамическая обработка иконки в Google Play

Определение размеров

Используйте все пространство активов в качестве фона при работе с иконками.

Используйте ключевые линии в качестве руководства для размещения элементов (например, логотипов).

Важное обновление гайдлайнов для иконок Google Play
Ваша иконка без полей (финальный актив)
Важное обновление гайдлайнов для иконок Google Play
Конечный результат с тенями и закругленными углами, динамически применяемыми в Google Play

Не заставляйте свой логотип заполнять все пространство актива. Вместо этого используйте сетку ключевых линий.

Важное обновление гайдлайнов для иконок Google Play

Не делайте.

Не втискивайте иллюстрацию в иконку без полей

Важное обновление гайдлайнов для иконок Google Play

Делайте.

Вместо этого разместите иконку произвольной формы на ключевых линиях

Иллюстрация обычно хорошо работает, как иконка без полей.

Важное обновление гайдлайнов для иконок Google Play

Не делайте.

Не уменьшайте изображение до ключевых линий.

Важное обновление гайдлайнов для иконок Google Play

Делайте.

Используйте все пространство актива, чтобы ваше изображение занимало всю иконку

Тени

Google Play будет динамически добавлять тень вокруг иконки после загрузки. При добавлении теней в изображение иконки учитывайте согласованность с платформой Android, следуя рекомендациям Google Material.

Важное обновление гайдлайнов для иконок Google Play

Не делайте.

Не добавляйте тени к финальной версии вашей иконки

Важное обновление гайдлайнов для иконок Google Play

Делайте.

Вы можете создавать тени и освещение в пределах иллюстрации

Радиус закругления

Google Play динамически применяет радиус закругления угла. Это обеспечивает согласованность при изменении размера иконки в разных макетах интерфейса. Радиус будет эквивалентен 20% размера иконки.

Важное обновление гайдлайнов для иконок Google Play

Не делайте.

Не закругляйте края финальной версии вашего актива

Важное обновление гайдлайнов для иконок Google Play

Делайте.

Заполните весь свой актив изображением, когда это возможно

Бейджи (наклейки)

Встроенные бейджи убираются из самой иллюстрации и плохо масштабируются вместе с иконкой

Важное обновление гайдлайнов для иконок Google Play

Внимание.

Избегайте сообщений о рекламных акциях на самом изображении

Важное обновление гайдлайнов для иконок Google Play

Внимание.

Избегайте использования брендинговых наклеек

Адаптация бренда

Если фигуры являются важной частью логотипа, не делайте иллюстрацию без полей. Вместо этого поместите ее в новую сетку ключевых линий.

Важное обновление гайдлайнов для иконок Google Play
Слева направо: исходная иконка, новая иконка (рекомендуемая адаптация), новая иконка, отображаемая в Google Play

Если возможно, выберите цвет фона для вашей иконки, соответствующий вашему бренду с непрозрачностью 100%. Прозрачные активы будут отображать цвет фона пользовательского интерфейса Google Play.

Важное обновление гайдлайнов для иконок Google Play
Слева направо: исходная иконка, новая иконка (рекомендуемая адаптация), новая иконка, отображаемая в Google Play

Если вокруг логотипа нет четкой формы, поместите его на фон без полей.

Важное обновление гайдлайнов для иконок Google Play
Слева направо: исходная иконка, новая иконка (рекомендуемая адаптация), новая иконка, отображаемая в Google Play

Если ваша работа достаточно гибкая, попробуйте настроить ее так, чтобы в полной мере использовать размер ресурсов. Если это невозможно, вернитесь к размещению логотипа на сетке ключевых линий.

Важное обновление гайдлайнов для иконок Google Play
Слева направо: исходная иконка, новая иконка (рекомендуемая адаптация), новая иконка, отображаемая в Google Play

Режим совместимости

Исходные ресурсы иконок, которые не были обновлены в соответствии с новыми спецификациями, будут в конечном итоге переведены в «Режим совместимости» и уменьшены на 75% до размера сетки ключевых линий (512 * 0.75 = 384px).

Загрузка иконки в соответствии с исходной спецификацией не будет разрешена с мая 2019 года. Ознакомьтесь с более подробной информацией о сроках.

Важное обновление гайдлайнов для иконок Google Play
Исходные иконки будут автоматически преобразованы в активы режима совместимости и уменьшены на 75% до новой сетки ключевых линий

Скачайте шаблоны

Для начала скачайте один из предоставленных шаблонов активов:

Если вы нашли ошибку, выделите фрагмент текста и нажмите Ctrl+Enter

Похожие записи

Тренды UI и UX дизайна на 2019 год

Тренд номер один в современном дизайне – это контекст. Больше нет обобщений. Все находится в контексте и связано между собой.

Ключевые принципы новой дизайн системы Fluent Design System от Microsoft

Fluent Design System от Microsoft фокусируется на пяти принципах, которые помогают разработчикам создавать более творческие интерфейсы: глубина, материал, свет, масштаб и движение.

20 ярких трендов в дизайне, которые мы увидим в 2018 году

Опираясь на прошлогодний контент, мы составили список конструктивных особенностей, которые, по нашему мнению, имеют наибольший потенциал, чтобы стать тенденциями дизайна в 2018 году. Без дальнейших церемоний, вот наши 20 лучших прогнозов.