· Дизайн · 5 мин. чтения

Графический объект Google Play, который конвертирует

Графический объект Google Play, который конвертирует
TL;DR. Графический объект 1024 x 500 стоит в самом верху страницы приложения в Play, поэтому именно он создаёт первое впечатление. Пусть он передаёт одну мысль, держи логотип и любой текст подальше от центра и краёв (промовидео накладывает кнопку воспроизведения поверх середины), совпадай по стилю с иконкой и скриншотами и убери все фразы, которые Play запрещает — «Лучшее», «№1», «Бесплатно», цены, счётчики загрузок, звёздные рейтинги. Это редакционный материал, а не реклама.

Страница приложения в Play даёт тебе один широкий баннер над всем остальным. И в мобильном браузере, и внутри самого приложения Play он растягивается на всю ширину экрана перед скриншотами, перед описанием — часто ещё до прокрутки. Это элемент, который видит больше всего людей, и элемент, который большинство разработчиков экспортируют из шаблона не задумываясь, — именно поэтому продуманный вариант выделяется.

Это дизайнерская и регламентная часть истории. Точные размеры, формат файла и место, где отображается графика, разобраны в отдельной статье; коротко: она должна быть 1024 x 500 px, сохранена как JPEG или 24-битный PNG без альфа-канала. Play отклоняет всё, что отличается хотя бы на пиксель, и отображает прозрачность как чёрный цвет. Всё, что дальше, предполагает, что этот холст у тебя уже есть и ты хочешь, чтобы он заслужил клик.

Донеси одну мысль

Графический объект — это не афиша, которую нужно набить фичами. В том размере, в котором он реально отображается — часто несколько сотен пикселей в ширину на экране телефона, — ты доносишь одну идею или не доносишь ничего. Выбери единственную причину, по которой человек установит твоё приложение, и построй вокруг неё весь кадр. Приложение для медитации показывает спокойствие, а не список функций. Приложение для бюджета показывает растущую цифру, а не пять иконок.

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

Учитывай безопасную зону под кнопку воспроизведения

Если ты прикрепишь к странице промовидео, Play наложит на графический объект кнопку воспроизведения, чтобы люди могли на неё нажать. Эта кнопка оказывается по центру баннера, а сама графика может по-разному кадрироваться на разных поверхностях и устройствах. Отсюда два следствия для макета:

  • Держи логотип и любой текст подальше от самого центра. Кнопка воспроизведения поверх названия бренда выглядит как ошибка. Смещай важные элементы от центра — в левую треть кадра или в нижнюю полосу, — чтобы наложение никогда с ними не пересекалось.
  • Дай краям пространство для «дыхания». Не прижимай текст или логотип к границам. Если платформа обрезает кадр, крайний контент теряется первым. Считай внешние поля вылетом за обрез, а не полезной площадью.

Даже если сегодня у тебя нет видео, оформляй так, будто кнопка воспроизведения может появиться в любой момент. Это сохраняет тебе свободу манёвра и просто делает композицию надёжнее.

Границы, которые Play не даст пересечь

Правила качества контента Google Play относятся к графике в магазине как к редакционному материалу, а не рекламе. Графический объект (как и заголовок, и краткое описание) не должен содержать рекламных заявлений или заявлений об эффективности. Нарушишь одно из правил — заявку пометят или отклонят. Запрещённые категории:

  • Заявления об эффективности и рейтинге — «Лучшее», «№1», «Топ», «Приложение года», «Популярное», «Лучшее в Play».
  • Награды, отличия и отзывы — значки трофеев, «Упоминалось в», цитаты из отзывов, звёздные рейтинги, изображения пяти звёзд.
  • Счётчики загрузок или пользователей — «1 млн+ загрузок», «Присоединяйся к миллиону пользователей».
  • Цены и акции — «Бесплатно», «Скидка 50%», «Распродажа», «Ограниченное время», «Кэшбэк $50».
  • Призывы к действию — «Скачай сейчас», «Установи сейчас», «Играй сейчас», «Попробуй сейчас».
  • Значки Play и элементы интерфейса магазина — значок «Get it on Google Play» или что угодно, напоминающее элемент управления Play, а также фейковые кнопки, переключатели или зоны нажатия, встроенные в саму картинку.

Формулировка, которая убережёт тебя от проблем: описывай, чем приложение является, а не то, какое место оно занимает или сколько стоит. «Отслеживай все подписки в одном месте» — нормально. «Трекер подписок №1 — бесплатно!» — это два нарушения в одной строке.

Сделай его читаемым там, где он реально отображается

Оформляй в размере 1024 x 500, но оценивай на уровне миниатюры. Вот ошибки, которые проявляются, только когда баннер уменьшается:

  • Низкий контраст. Бледный текст на пёстром фото исчезает, как только изображение уменьшается. Размещай текст на однотонном фоне или мягком градиенте и держи заметную разницу по светлоте между текстом и фоном.
  • Слишком мелкий или слишком тонкий шрифт. Тонкие начертания и длинные фразы превращаются в кашу. Если вообще используешь слова, оставь несколько крупных и жирных.
  • Детали, которые читаются только в полном размере. Мелкий интерфейс, крошечные кадры продукта и плотные узоры — всё это теряется. Делай ставку на крупные формы и один чёткий фокус.

И отдельная ловушка: не трать баннер на повторение названия приложения. Твой заголовок и так стоит прямо рядом на странице. Тратить главный посыл графики на текст, который пользователь и так прочитает в двух сантиметрах от неё, — это впустую потраченное сообщение. Покажи вместо этого выгоду или сам продукт.

Совпадай со всей страницей

Графический объект — это не самостоятельная картинка, а верхняя часть набора. Ниже него — иконка, ещё ниже — скриншоты. Когда цвет, шрифт и настроение проходят единой нитью от баннера к иконке и скриншотам, страница ощущается как единый продукт, который делали неравнодушные люди. Когда графический объект — это случайный стоковый градиент, не имеющий ничего общего со скриншотами, он выглядит как нечто второстепенное и незаметно подрывает доверие.

Бери палитру из иконки или реального интерфейса приложения. Используй тот же акцентный цвет, что и в подписях к скриншотам. Держи одно семейство шрифтов везде. Единообразие здесь — не украшение, а сигнал того, что вся страница спроектирована осознанно.

Чем здесь поможет Mokbi

Mokbi оформляет графический объект 1024 x 500 вместе с набором скриншотов, поэтому баннер, панели и подписи сразу используют одну палитру, один шрифт и одно сообщение — без отдельного инструмента и без ручного подбора цвета. Экспорт идёт точно по спецификации (JPEG или 24-битный PNG, без альфа-канала), важные элементы остаются вне центра и краёв, а сам объект локализуется на 50 языков — так что каждый рынок получает подходящий баннер, а не обрезанную английскую версию.

Решение о сообщении и художественном направлении всё равно остаётся за тобой. Инструмент просто делает так, чтобы вся страница — включая графический объект — выглядела единым целым.

Что почитать дальше

Оформи свой графический объект →