Привлечение пользователей6 мин. время чтения

Скриншоты для App Store и Google Play. Идеи и советы по созданию скриншотов для ASO

Валерия Шалимова

ASO Manager, Appbooster

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

Процесс создания скриншотов – это не отрисовка баннеров для рекламы, а конструктор, который собирается из элементов, разрешенных гайдлайнами App Store и Google Play. Весь дизайн скриншотов можно разделить на четыре составляющие:

  • Мокапы
  • Текст
  • Фон
  • Дополнительные решения для ASO

Далее мы поделимся идеями оформления каждого из перечисленных блоков.

Оставить заявку на ASO в Appbooster

Скриншоты мокапы

Мокап – это макет, который дизайнеры используют для демонстрации своей работы. Это может быть экран ноутбука, визитка, монитор или мобильный телефон. Он нужен для того, чтобы заранее представить, как будет выглядеть какой-либо интерфейс на экране, например, мобильного устройства. Благодаря мокапу можно получить не просто плоскую картинку, вырванную из контекста, а реалистичное изображение.

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

Размеры скриншотов для App Store и Google Play

App Store
Для iPhone (вертикальные скриншоты):
Количество от 3 штук.

  • 6.7" Display (14 Pro Max) — 1290 x 2796 pixels.
  • 6.5" Display (X, XS, XS Max, XR, 11, 11 Pro, 11 Pro Max, 12 mini, 12, 12 Pro, 12 Pro Max, 13 mini, 13, 13 Pro, 13 Pro Max, 14, 14 Plus, 14 Pro) — 1242 x 2688 pixels.
  • 5.5" Display (8 Plus, 7 Plus, 6s Plus и более старые модели) — 1242 x 2208 pixels.
    Для горизонтальных скриншотов размеры обратны вертикальным.

Для iPad (вертикальные скриншоты):

  • Количество от 3 штук.
  • Размеры — 2048 x 2732 pixels.
    Для горизонтальных скриншотов размеры обратны вертикальным.

— Google Play
Для смартфонов (вертикальные скриншоты):

  • Количество от 2 штук.
  • Размеры: 1440-2560 pixels.
  • JPEG или PNG 24.
  • Минимальная длина стороны: 320 pixels.
  • Максимальная длина стороны: 3840 pixels.
  • Соотношение не более 2:1.
    Для горизонтальных скриншотов размеры обратные.

Для планшетов (вертикальные скриншоты):

  • Количество от 3 штук.
  • Размеры — 2048 x 2732 pixels.
    Для горизонтальных скриншотов размеры обратные.

Мы покажем четыре варианта представления интерфейса мобильного устройства в ASO.

Скриншоты с объёмными реалистичными устройствами

Скриншоты с объёмными реалистичными устройствами

Flat скриншоты – плоские устройства

Flat скриншоты – плоские устройства


Скриншоты с обводкой линией


Это решение подойдет для разграничения фона и функционала приложения без перегруза лишними визуальными эффектами.

Скриншоты с обводкой линией

Скриншоты без устройства

Скриншоты без устройства

Текст

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

Мы подобрали 5 популярных решений по оформлению текста:

Часть фразы выделена цветом

Оформление текста скриншотов

Часть фразы выделена иным кеглем

оформление текста скриншотов

Часть фразы скриншота подчёркнута

оформление текста скриншотов

Часть текста скриншота под плашкой

оформление текста скриншотов

Емкие фразы в одно слово

оформление текста скриншотов


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

Оставить заявку на ASO в Appbooster

Фон скриншота

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

оформление фона скриншотов ASO

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

оформление интерфейса скриншотов ASO
цветовое оформление скриншотов ASO

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

цветовое оформление скриншотов ASO

И еще одно визуальное решение для фона: перетекающие элементы связывают скриншоты в единую композицию.

визуальное оформление скриншотов ASO

Дополнительные решения для ASO

Скрин-обложка

Это отличный способ быстро и просто продемонстрировать основную суть приложения и вызвать нужные эмоции.

Скрин-обложка для ASO

Скриншоты с персонажами и логотипами

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

Персонажи и логотипы для ASO

Скриншоты с акцентом на функциях

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

Акцент на функциях при оформлении скриншотов ASO

Плашки с контентом

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

Плашки с контентом при оформлении скриншотов ASO

Фотофон

Еще один вариант оформления скриншотов – фотофон.

Фотофон при оформлении скриншотов ASO

Изометрия

Изометрия – привлекательное решение, но важно, чтобы она не повлияла на видимость интерфейса приложения.

Изометрия при оформлении скриншотов ASO

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

Оставить заявку на ASO в Appbooster

Бесплатный конструктор для создания скриншотов от AppBooster

Валерия Шалимова

ASO Manager, Appbooster

Популярные

postcard thumb
Как повысить удержание пользователей в мобильном приложении

В статье рассказали, что такое показатель удержания в мобильном приложении, зачем он нужен, как его рассчитать и какие инструменты использовать, чтобы его увеличить.

Валерия Шалимова

ASO Manager, Appbooster

Рост продуктов7 мин. время чтения

Последние

postcard thumb
Как мы увеличили видимость приложения Welly в App Store на 400% за три месяца

Добились притока целевого трафика по релевантным запросам, сочетая ключевые инструменты привлечения органики: текстовое ASO и машинный трафик.

Ирина Льготина

Product Manager, Appbooster

Статьи6 мин. время чтения
postcard thumb
Кейс: улучшили индексацию приложения в нише займов в 4 раза и привлекли новые органические установки

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

Анна Софийская

ASO Manager, Appbooster

Статьи2 мин. время чтения
postcard thumb
Как повысить удержание пользователей в мобильном приложении

В статье рассказали, что такое показатель удержания в мобильном приложении, зачем он нужен, как его рассчитать и какие инструменты использовать, чтобы его увеличить.

Валерия Шалимова

ASO Manager, Appbooster

Рост продуктов7 мин. время чтения

Свяжитесь с нами

Phone

Адрес

г. Самара, ул. Ново-Садовая 265а