Визуальная оптимизация страниц приложений: тренды 2021

Грамотная визуальная оптимизация страниц приложений в App Store и Google Play повышает конверсию в установку на 17-24%. Поэтому важно тестировать разные варианты иконки и скриншотов и выбирать самые эффективные. Обращайте внимание на тренды визуальной оптимизации, которым следуют издатели популярных приложений.

В этой статье мы проанализировали иконки, скриншоты и видео 100 бесплатных приложений из топов App Store и Google Play в США и выделили тенденции 2021 года. Мы изучили цветовые, графические и композиционные решения, которым следуют популярные издатели.

Томас Пети (консультант по росту приложений), Дарья Павлюк (ZiMAD), Лина Данильчик (Splitmetrics) рассказали о трендах визуальной оптимизации 2021. Надеемся, что эта статья поможет вам найти инсайты для оформления страницы и сделать приложение заметнее среди конкурентов.

Визуальная оптимизация страниц приложений: иконки

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

Параметры оценки оформления иконок:

• Основной цвет фона
• Изображение на иконке
• Цвет изображения

Цвет фона на иконке

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

Наиболее популярный фон в обоих магазинах — белый. Его используют 38% издателей приложений в App Store и 42% издателей в Google Play.

Яркие цвета фона — красный, жёлтый, розовый используются редко. Издатели приложений выбирают приглушённые оттенки синего, чёрного или зелёного. В App Store также популярен голубой цвет, его используют 14% издателей.

Изображение на иконке

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

Тем не менее пользователям чаще знакомо имя бренда, чем его логотип. Логотип лучше использовать только в том случае, если приложение является сильным брендом и известно большинству пользователей. К таким приложениям относятся Instagram, Twitter, Facebook.

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

Цвет изображения на иконке

Белый цвет остаётся самым популярным для изображения на иконках App Store и Google Play. Его используют 42% издателей в App Store и 40% в Google Play. Белый также может сочетаться с любыми другими цветами и оттенками. Это позволяет брендам помещать на иконку свои логотипы в виде изображения или текста, состоящие из одного или нескольких цветов.

В App Store распространены изображения красного, чёрного и зелёного.

В Google Play — красного, чёрного и голубого.

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

Мы совместили данные App Store и Google Play о цветах фона и изображения на иконке и сделали сводную диаграмму. Наиболее популярные цвета в дизайне иконок после белого — чёрный, красный, зелёный, синий и голубой.

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

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

В этом может помочь Competitors Table в инструменте Keyword Charts от ASOdesk. Таблица даёт возможность быстро анализировать иконки конкурентов по вашим ключевым словам.

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

Визуальная оптимизация страниц приложений: скриншоты

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

Параметры оценки оформления скриншотов:

• Цвет фона или наличие интерфейса приложения
• Наличие текста и его цвет
• Наличие устройства
• Формат и композиция скриншотов
• Наличие дополнительной графики и обработки
• Количество скриншотов

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

Мы проанализировали цвета фона скриншотов в магазинах приложений. Самые популярные цвета фона скриншотов в App Store: белый (24%), голубой (12%), красный (12%).

В Google Play 20% издателей используют белый цвет, 16% — синий, 10% — фиолетовый.

12% издателей App Store и Google Play также предпочитают оставлять скриншоты без фона и публикуют снимки экранов приложения в качестве скриншотов.

Например, Facebook выбрала именно такой минималистичный подход к дизайну скриншотов для своих топовых приложений.

Цвет текста на скриншоте

Для текста на скриншотах в App Store и Google Play в подавляющем большинстве используются белый и чёрный цвета. Светлые цвета — зелёный, голубой, жёлтый используются редко. В приложениях, для которых издатели решили оставить скриншоты без обработки, как правило, не используется дополнительный текст.

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

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

Наличие устройства

Как правило, на скриншотах изображают устройство с интерфейсом приложения. Устройство есть на 82% страницах приложения в App Store и Google Play.

Размещение изображения устройства усложняет процесс создания скриншотов. Например, в App Store необходимо помещать на скриншот именно то устройство, которое соответствует размерам экрана 5,5” или 6,5”. В Google Play важно не забывать менять старые устройства с большими рамками на новые, почти безрамочные.

Формат и композиция

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

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

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

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

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

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

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

Дополнительная графика и обработка

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

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

Обработка скриншотов позволяет выделить важные элементы приложения и привлечь к ним внимание пользователя. Отдельные объекты экрана приложения выделяются путём увеличения, стрелочек, обводки цветом.

44% издателей в App Store и Google Play дополнительно обрабатывают скриншоты.

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

Количество скриншотов

В App Store для публикации доступно 10 скриншотов, в Google Play — 8. Тем не менее издатели в среднем предпочитают публиковать только 5-7 скриншотов.

Только 12% издателей используют максимальное количество скриншотов в App Store.

18% издателей используют все доступные скриншоты в Google Play.

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

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

Визуальная оптимизация страниц приложений: видео

Видео больше распространено для продвижения игр, чем для приложений. В Google Play можно добавлять только одно видео, в App Store количество ограничено тремя. Формат видео в Google Play более свободный, чем в App Store. Издатели Android-приложений могут публиковать не просто съёмку интерфейса, а целые фильмы со специальными эффектами и реальными людьми.

Параметры оценки оформления страниц в App Store и Google Play:

• Количество страниц с видео относительно страниц со скриншотами
• Звук, текст и формат видео

Количество страниц с видео

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

Только 10% издателей App Store используют видео.

Издатели Google Play используют видео в 3 раза чаще — в 28%.

На обеих платформах разработчики публикуют не более одного видео.

Звук, текст и формат видео

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

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

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

В App Store на видео можно показывать только интерфейс приложения.

При создании ролика не забывайте о звуке и субтитрах — это поможет акцентировать внимание пользователя на самых важных деталях.

Обязательно проведите A/B-тестирование и сравните, как будет отличаться конверсия в установку для страницы с видео и со скриншотами.

Визуальная оптимизация страниц приложений топовых приложений

• Минималистичный дизайн иконки и скриншотов
• Цвета и оформление визуальных элементов соответствует брендбуку
• Белый цвет популярен для фона, шрифта и изображений на иконках
• Большинство иконок сделаны в синих, чёрных или красных тонах
• Реже всего используются оранжевый, фиолетовый, розовый и жёлтый
• Издатели предпочитают дополнительно обрабатывать изображения, а не просто выкладывать скриншоты интерфейса
• Вертикальные скриншоты встречаются гораздо чаще, чем горизонтальные
• На страницу приложения загружается в среднем 5-7 скриншотов
• Большая часть издателей предпочитает не использовать видео

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

Визуальная оптимизация страниц приложений: чек-лист

1. Проведите исследование приложений, стоящих рядом с вами в поисковой выдаче, и подумайте, каким образом вы сможете выделиться на их фоне.
2. Сделайте визуальные элементы страницы приложения информативными. Учитывайте тренды, но вместе с тем отстройтесь от конкурентов.
3. Страница и реклама приложения должны быть выполнены в одном стиле. Так вы создадите у пользователя единый органичный образ и ассоциацию с брендом.
4. Адаптируйте визуальные элементы под разные страны и культуры.
5. Передайте с помощью иконки самую важную информацию о приложении и его предназначении.
6. Вынесите имя бренда на иконку, чтобы оставить больше символов для ключевых слов в названии.
7. Ориентация скриншотов должна согласоваться с основной ориентацией приложения.
8. Используйте вертикальные скриншоты, чтобы донести до пользователя больше информации.
9. Вынесите на первые три скриншота информацию о важных преимуществах приложения, выделяющих вас среди конкурентов.
10. Текст на скриншотах должен быть лаконичным и читабельным даже на небольших экранах, а шрифт — крупным и контрастным.
11. Добавляйте на скриншоты эмоциональные картинки, чтобы притягивать внимание пользователя.
12. Выделяйте на скриншотах важные UI-элементы. Главные функции приложения должны быть на первых трёх скриншотах.
13. Подумайте над использованием панорамных скриншотов. Они могут мотивировать пользователя посмотреть все изображения.
14. Перед добавлением видео на страницу приложения обязательно проведите A/B-тестирование. Сделайте видео интересным и качественным, добавьте субтитры и звук.
15. Прислушайтесь к рекомендациям экспертов. Лина Данильчик (Splitmetrics) выделяет следующие тренды оформления иконок 2021: геометрические фигуры, минимализм, наклонные элементы. Тренды оформления скриншотов — наклонные и увеличенные элементы, яркие и контрастные цвета.
16. Не следуйте только трендам и собственным предпочтениям. Проводите A/B-тесты и смотрите на конверсию страниц с разным набором визуалов. Только так вы найдёте то оформление, которое вызовет лучший отклик у пользователей.