14 Ноя 2019

Готовим креативы: полезные сервисы для обработки картинок

Прочитать позже или поделиться с друзьями

Рано или поздно веб-мастер сталкивается с подготовкой креативов. Сегодня расскажем, какие они должны быть, а также расскажем немного о платных и бесплатных инструментах для редактирования изображений.

Креативы в мире CPA — это рекламные материалы (в большинстве своём баннеры и картинки для рекламных кампаний, иногда видео), которые используются для продвижения товаров и услуг рекламодателей. Да, сами интернет-магазины и онлайн-сервисы заливают в партнёрские сети готовые баннеры, но у них есть несколько минусов:

Отсутствие необходимых размеров. У каждой площадки свои требования к размерам и форматам баннеров, и если залить не подходящее по параметрам изображение, сам баннер может исказиться, а вёрстка «поехать».
Баннеры не на всех языках. Это может быть критично для веб-мастеров, работающих с зарубежными ГЕО. Очевидно, что баннер на родном языке привлечёт больше внимания, чем то же изображение с англоязычным контентом (даже при учёте того, что пользователь может знать иностранный язык).
«Выжатые» баннеры. Креативы необходимо постоянно менять и освежать, так как порой у пользователя «замыливается» глаз: первый раз он кликнет по изображению, второй — обратит внимание, а после третьего просто начнёт игнорировать.

Конечно, всегда можно направить запрос на обновление баннеров или предоставление креативов нужного размера на языке целевой аудитории — рекламодатели охотно идут навстречу и помогают веб-мастерам. Но это занимает время, а его может не быть, особенно в период активных распродаж и высокий сезон. Поэтому порой бывает проще и быстрее подготовить изображение самостоятельно, а затем выслать его на согласование. Получить «благословение» от рекламодателя важно: в противном случае (если вы будете использовать креативы) действия, сделанные по ним, будут отклонены, а вы подвергните бренд риску.

Требования к креативам

Рассмотрим основные параметры креативов (баннеров, изображений для рекламных кампаний):

Форма

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

Сейчас практически на любой площадке есть подсказки, каким должно быть изображение, чтобы качественно отображаться. К ним относятся: размер (максимальное или минимальное соотношение сторон в пикселях), вес (в кило- и мегабайтах), формат (PNG, JPEG, GIF, SVG и другие).

Если мы имеем дело с растровыми изображениями (например, фотографиями), важно помнить, что при увеличении их размера картинка начинает «расплываться», становится нечёткой, теряется качество. И наоборот: если мы уменьшаем картинку, она становится визуально более чёткой (хотя при этом могут теряться некоторые мелкие детали). Лучше всего не менять оригинальный размер изображения, но либо обрезать его, либо подбирать точно под требуемый размер. На некоторых платформах (например, в соцсетях) есть встроенная функция кадрирования (то есть обрезки изображения), но не везде: иногда картинка может автоматически обрезаться так, что часть информации просто не попадёт в кадр, и сделать ничего внутри платформы будет нельзя.

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

Содержание

Первое правило: ваш креатив не должен нарушать закон в интернет-пространстве того государства, на котором он запускается. Самый полный список требований с примерами, на наш взгляд, перечислен в статье «Создаем рекламный баннер: как не нарушить закон».

Второе правило (повторим ещё раз) — согласованность с рекламодателем, отсутствие «мислидов». Мислид — креатив, который дезинформирует и провоцирует пользователей. В креативах онлайн-игр нельзя использовать героев других артов и игр, в баннерах магазинов — изображение моделей, которые не работают с ним, товаров и услуг, которые в них не представлены. И конечно, нельзя вводить пользователей в заблуждение скидками и акциями, которых на самом деле нет.

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

Ну и не забываем про авторские права. Использовать в рекламе чужие изображения (фотографии, иллюстрации, клипарты) без разрешения автора работы (а иногда и модели на изображении) — очень плохо. У вас есть несколько вариантов: получить разрешение или купить права на использование непосредственно у автора, купить доступ к базе стоковых изображений или использовать бесплатные базы. Очевидно, что на бесплатных ресурсах, скорее всего, изображения будут более «заезженные», чем с платных, и уж точно менее оригинальные, чем авторские работы. Но если вам нужен не шедевр дизайна, а просто качественное изображение, в которое при необходимости можно внести правки и дополнения — решение что надо.

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

Если вы понимаете, что вам не нужно столько изображений, то можно ограничиться бесплатными ресурсами:

Google и Яндекс картинки. Вбиваете в поиске тему, выставляете требования по размеру и цвету в настройках — и у вас есть нужное изображение. И не забудьте поставить галочку в поле «С лицензией на использование» в пункте «Права на использование».

Freepik. Прекрасный сервис, в котором можно найти фотографии, векторы, иллюстрации, подложки, картинки на прозрачном фоне и всё, на что хватит вашей фантазии. В бесплатной версии есть лимит по загрузкам за день, если зарегистрироваться, лимит исчезнет, а в премиум доступе вы получите ещё больше качественных изображений. Сами пользуемся, поэтому советуем. К сожалению, интерфейс сайта на английском языке, но разобраться с ним будет очень просто.
Flaticon. Огромная база иконок, которые пригодятся и для оформления сайта, и для баннеров, и для инфографик. Выбираете формат, размер, цвет, и скачиваете. Как и во Freepik, функционал разный для зарегистрированных, незарегистрированных и премиум-аккаунтов. Им тоже пользуемся с удовольствием.

Вот ещё подборки баз картинок, которые полностью или частично бесплатные:

Этого вам уж точно должно хватить 🙂

Для тех, кто считает, что это всё мелочи: именно в деталях и кроется то, что в итоге влияет на конверсию. Поэтому делать картинки на «тяп-ляп» не надо: вы просто потратите своё время впустую.

Обработка изображений

Давайте признаем: весь пакет продуктов Adobe (Photoshop, Illustrator, Lightroom и многие другие) — очень хороший инструмент для обработки и создания с нуля изображений, и закрывает весь спектр задач, с которыми может столкнуться веб-мастер. Но стоимость инструментов довольно высокая, а большинством функций вы пользоваться не будете (конечно, если вы не профессиональный дизайнер). Поэтому предлагаем вам несколько альтернатив, которые вам помогут редактировать графический контент. По сути, минимальный набор функций в них есть: изменить размер изображения, обрезать его, добавить к нему текст, объединить несколько изображений в клип-арт.

Вот несколько неплохих программ, которые вы сможете установить к себе на компьютер — этакий «фотошоп на минималках»:

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

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

Iloveimg. Позволяет сжать изображение (уменьшить его вес), изменить размер, обрезать, преобразовать в JPG-формат.
IMGonline. Позволяет не только изменить размер и вес изображения, но и добавить к нему эффекты.
Inettools. В сервисе можно наложить эффекты и фильтры и отретушировать изображение, а также определить, какой цвет в нём используется.
Editor.Pho.To. Обрезайте картинки, добавляйте фильтры, накладывайте текст — здесь это будет сделать довольно просто.
Fotoump. Ещё один онлайн-редактор, в котором даже есть готовые шаблоны для создания изображения.

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

Обратите внимание: в онлайн и мобильных редакторах выбор шрифтов на кириллице обычно ограничен. В тех программах, которые н ужно устанавливать на компьютер, вы можете добавить свои шрифты. Скачайте их (например, на сайте Fonts Online), вытащите из архива (если файлы заархивированы), а затем либо кликните дважды по каждому файлу, либо просто перекиньте их в папку Fonts на вашем компьютере. После этого они будут доступны во всех программах, где требуется набирать текст. Обратите внимание: шрифты также являются интеллектуальной собственностью создателей, так что заниматься пиратством не стоит.

Дизайнерский вкус

Конечно, чувство прекрасного, художественное или дизайнерское образование и творческий талант будет неоспоримым плюсом, но будем честными: наша цель — не попасть в топ Behance, а сделать изображение, которое будет приносить продажи.

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

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

Ководство Лебедева. Уже стала классикой, которую любят и ненавидят, но равнодушной она не оставит никого.
Блог Tilda. Много хороших статей по принципам создания сайтов, дизайну, вёрстке.
Сайты для дизайнеров — подборка самых полезных. Хорошая подборка от Skillbox с большим количеством сайтов на английском языке, но есть и на русском. Если не поможет инструментами, то уж точно разовьёт «насмотренность», а это тоже полезно.

Тестируйте. Запускайте несколько одинаковых рекламных кампаний с разными баннерами и смотрите на результаты: только так вы узнаете, что лучше конвертит для вашего сегмента. И не забывайте проставлять subID метки — без них будет сложно понять, с какого креатива было больше переходов, а на каком выше CR.

Ну и последнее, что мы хотели сказать: «лучшее — враг хорошего» и «краткость — сестра таланта». Удачи!

Прочитать позже или поделиться с друзьями