Ну что мы с вами все про сложное... про тексты, про пиксели, про стратегии какие-то. Давайте про красивое, про понятное. Про дизайн в соцсетях! Нет, про трендовый дизайн в соцсетях в 2020 году! А они, вы знаете, приходят и уходят быстро, так что заскакиваем в первый вагон трендов и едем впереди конкурентов.

1. Приглушенная цветовая палитра

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

2. Минимализм

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

3. Фирменная анимация

Когда упоминаешь слово GIF, то многие начинают открещиваться, вспоминая ужасы из Одноклассников. Но благодаря технологиям анимация стала более плавной, эстетичной и даже породнилась с AR. Опередите своих конкурентов облачив анимацию в ваш фирменный стиль в 2020 году, это, наверное, высшая степень уникализации контента. С фото еще что-то сделают, а с анимацией такой геморрой! Плагиатор, уходи!

4. Абстрактные иллюстрации

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

5. Тяжелые, но простые шрифты

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

Что можно придумать с Instagram Stories? Как спланировать, создать и в конечном итоге оптимизировать свои истории в Instagram?

Придерживайтесь фирменного стиля в Историях

Не забывайте про фирменный стиль даже в рамках Instagram Stories. Зачастую контент в Историях динамичный, поэтому элементы в нем должны отражать ваш стиль:

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

Но что делать тем, у кого не сформирован брендбук? Оттолкнитесь от образа вашего еще не сформировавшегося бренда (хех). Вы же ассоциируете себя с какими-то цветами, которые подходят под образ, шрифты тоже могут нести эту “образную нагрузку”. В случае UGC контента достаточно комментариев на фоне фирменных цветов. А если пользователи генерят вам тонны контента, то в этом случае вы в праве репостить только максимально подходящие по стилистике.

Планируйте контент в Instagram заранее

Разобравшись с деталями, в которых дьявол, переходим к самому нелюбимому у нас делу - планированию контента! “Истории для людей творческих, хочу записываю, нет настроения - не записываю, план мне не указ”, - аргумент. Но не совсем, что для бизнеса, что для личных блогов, важно не засорять эфир своих подписчиков бесцельной информацией, да еще и наугад по времени. Все, что вы транслируете пользователям - должно отвечать целям вашего бизнеса (личный бренд монетизирован, поэтому причисляю его к бизнесу). Отвечаем на следующие вопросы:

• Истории нужны вам для увеличения продаж?
• Истории нужны вам для повышения узнаваемости бренда?
• Истории нужны вам для повышения вовлеченности в целом?

Все ответы верны или только один из них? Берем в работу и начинаем на этом тощем скелете наращивать контент-план. Наверное, вы и без авторских подсказок сами знаете как правильно составлять рубрики и все к ним прилагающееся, но мало ли, пройдитесь по чек-листу.

• Вы определили частоту выхода Историй. Нет наилучшего варианта для частоты, публикуйте, следите за статистикой и принимайте меры. Но при подготовке контента, особенно, когда часть его ситуативная, делайте себе запланированный резерв из нескольких публикаций.
• Если в ваших историях подразумевается CTA, то вы размещаете CTA. Часто бывает, когда нужна вовлеченность совсем забывают про призыв к действию. Нет, пользователь не догадается, что там за гениальная задумка, у него просто нет времени на это! Лайфхак: если вы бог нативной подводки в серии Историй (5-6 штук), то не оставляете CTA на десерт. Это основное блюдо и лучше его подать в середине.
• Вы зациклены только на одном формате или все-таки чередуете? Конечно, приятно получать большую вовлеченность. Но если ваши истории всегда с CTA, то аудитория быстро просечет фишку и просто перестанет реагировать. Равно также с видео в стиле “говорящая голова”, никакого разнообразия.
• Решите, когда размещать ваши истории. Здесь тоже нет секретного рецепта для вычисления идеального времени размещения истории. Рано или поздно подписчик их посмотрит, но до окончания 24 часов. Шансы велики. Если это что-то важное - опубликуйте накануне, за сутки, а не за несколько часов, ну и стикер-таймер обратного отсчета вам в помощь. Если вы не доверяете самому себе, воспользуйтесь сторонним сервисом, по планингу и отложенным публикациям, только проверяйте, все ли вышло вовремя. Смотрите такие сервисы в разделе официальных партнеров Facebook.

Стоп, кто-то начал ворчать насчет отсутствия в этой статье примеров тем для Историй. Ну раз вы так это любите, то держите, выбирайте наиболее подходящие:

• Развлекательные материалы. Всякие текстовые шутки / скрины из твиттера, который славится такими бриллиантами или популярные смешные видео.
• Про себя любимого, про бизнес любимый. Раскройте человеческую сторону вашего бренда. Конечно личные блоги тут могут разойтись не на шутку.
• За кулисами вашего бизнеса, так называемые бэкстейджи. Пересекается с предыдущим пунктом, делайте выводы.
• Советы, гайды, инструкции, учебники (?), которые помогут вашим клиентам. Только, пожалуйста, сначала разберитесь с авторским правом, а потом пилите свои чек-листы, касается экспертов в формате личных блогов.
• Ответы на часто задаваемые вопросы.
• Ваша фантазия.

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

Создаем свои Истории

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

• Истории Instagram имеют вертикальное соотношении 9:16 или 1080 x 1920 пикселей. Не забывайте про “безопасные зоны” в Историях, иначе элементы интерфейса могут перекрыть какой-то важный элемент. 
• Фото будет воспроизводиться в течение 6 секунд, а видео - до 15 секунд. Если наснимали более длинное видео, то заботливый Инстаграм все сам порежет и разбросает на отдельные кусочки.
• Есть отдельный функционал создания текста на градиентном фоне. Длительность 6 секунд.
• Фото и видео можно масштабировать под нужный размер, если вы загружаете его с телефона, просто зажмите материал двумя пальцами и творите.
• Поговаривают, что наличие стикеров (слайдер, опрос), повышают вовлеченность. Логично… там же можно потыкать? Но об этом в пункте 4.
• Владельцы Android жалуются, что видео, выложенные в Историю, теряют качество до уровня шакалов. Автор частично решил эту проблему съемкой видео сначала через дефолтную камеру, а потому уже размещение готового материала в Историю. Ух, дискриминация!
• Пробуйте комбинировать форматы!

Сейчас многие оправданно обратили внимание на анимированный формат макетов для Историй. Для создания таких вы можете поставить очередное приложение, где все самое интересное придется докупать, иначе получится как у всех. Или потратьте несколько часов (дней) на изучение Adobe After Effects, в таком случае до вас не подкопаться и выглядеть все будет органично, в фирменном стиле и уникально!

Стимулируйте вовлеченность!

Гармоничный вариант - ваше фото / видео с внутренними элементами Instagram. Тогда создается впечатление, что материалы вы не штаповали на отмахнись ради лоска и красоты, а приложили усилие, выбрав GIF в тему и сочинив опрос. Чем будем украшать наши сырые макеты?

• Стикер опроса
• Стикер открытого вопроса
• Стикер обратного отсчета
• Стикер-слайдер
• Стикер чата
• Викторина

Больше кликов - большое вовлеченности! А в некоторых случаях вы еще и драгоценное мнение узнаете. Стикеры «Опрос», «Вопросы» и «Викторина» - это практические инструменты для извлечения вовлеченности из вашей аудитории. Зрители историй могут сделать выбор, добавить свой отзыв, задать вопрос, ответить на вопрос, предложить что-то новое. Стикер «Обратный отсчет» подходит для различных event’ов и событий с конкретной датой. Можно же не только анонсировать, а интриговать, не давая никаких объяснений. Стикеры - не единственный способ оптимизировать ваши истории для увеличения вовлеченности:

• Не делайте истории с текстом ради “красиво”, делайте ради “читаемо”. Тут некоторые возразят, что если текст плохо читаем, то зритель будет удерживать историю для перелистывания. Верно. Но может изначально не насиловать глаза и внимание пользователя?
• Используйте яркие или контрастные цвета, чтобы выделить ключевые сообщения.
• Используйте GIF-стрелки или другую анимацию, чтобы побудить подписчиков перейти к следующей истории, удерживайте их.
• Если у вас бизнес-аккаунт на 10 000 подписчиков или вы являетесь подтвержденным аккаунтом, то у вас есть возможность прикреплять, ссылки к историям. Кстати, мы уже писали в нашем блоге, как разместить ссылку в историях, немного схитрив. Спойлер: IGTV.

Оптимизируйте охваты своих Историй

Без какого показателя статистика не статистика? Правильно, без охватов! Нам нужно больше зрителей, а им нужно больше хлеба и зрелищ. Так как увеличить охваты легальным способом? Во-первых, строить недотрогу в Instagram как минимум глупо. Вы своих пользователей раздразнили, а на их усилия обратной связи не дали. Зрители в недоумении. Если в случае открытых вопросов можно поделиться ответом и дать минуту славы, то в случае опросов можно вознаградить участвовавших хотя бы результатом голосования. Не хотите размещать что-то в Истории, хотя бы поблагодарите через Direct. Во-вторых, использовать геотеги. Да, для локального бизнеса это мега супер, но если порыскать по популярным геоточкам, то от количества нерелевантной информации хочется хвататься за голову. Например, гео-точка дорогого ресторана с определенным контингентом, но владельцы шоурумов из Китая так не считают. Если вас эта гео-помойка не пугает - используйте, ставьте популярный геотег. А если у вас есть конкретный адрес, то максимум можно взять точку вашего района. Лайфхак: если у вас микро-точка (конкретный дом), то поставив его, Instagram может подтянуть ваше местоположение к более широкому, на уровне района или города. Лайфхак наоборот не работает, увы. В-третьих, не плюйте на хэштеги. К вашей истории можно прикрепить только один красивый стикер-хэштег, если у вас серия историй, проявите разнообразие. Если вы решили обхитрить Instagram и сделать незаметную простыню из 50 штук в цвет фона, то Instagram засчитает только первые три. Хэштеги не надо «прятать» за другими стикерами, они должны быть четко читаемыми и видимыми. Или вы чего-то стесняетесь? В любом случае, нет гарантии, что если вы решите проверить свою видимость по определенному хэштегу, то вы увидите свою историю. Вы не увидите, а ваша релевантная аудитория увидит, алгоритмы, так сказать. В-четвертых, отмечайте своих подписчиков в Историях. Может быть они победили в викторине или поучаствовали в опросе, неважно, кликабельный стикер с упоминанием даст возможность пользователю на радостях поделиться со своими друзьями вашей отметкой и тогда охват увеличится, на попробовать-то стоит. Но не переусердствуйте, пожалуйста.

В качестве послесловия

Как и любой вид творчества - все решения остаются за вами. Добавлять стикеры или нет, ставить хэштеги или нет, да даже публиковать истории или нет - все на ваше усмотрение, которое откликается на цели бизнеса. Демонстрируйте свою уникальность, любите аудиторию и будьте верны индивидуальности вашего бренда! Но рано или поздно придет время анализа результатов и вот тогда вам пригодятся 5 метрик, по которым можно оценить эффективность ваших Stories. Что вы еще включаете в алгоритм при работе с Инстаграм Историями? Поделитесь своими мыслями или опытом в комментариях.  

Почему важно знать как настраивать цели через css-селекторы? 1. Не всегда событие gtm.click подтягивает необходимые нам переменные ( Click Classes, Click ID), что может вызвать проблему при настройке триггеров и целей соответственно. 2. У отслеживаемого элемента (кнопки и т.д.) нет индификатора в виде атрибутов class или id.

Как найти css-селектор?

Найти css селектор можно при помощи консоли разработчика. 1. Открываем консоль разработчика, кликнув на отслеживаемый элемент правой кнопкой мыши -> исследовать элемент. 2. Копируем css селектор, нажав на необходимый тэг правой кнопкой мыши -> скопировать css-селектор. Вот так выглядит css селектор моего отслеживаемого элемента:

div > div.footer_button > div > div.offer_buy_block.buys_wrapp.woffers > div.counter_wrapp > div > span > span

Как проверить правильность выбора css-селектора?

Перед использованием css-селектора мы можем проверить его корректность. 1. Заходим в консоль разработчика. В вкладку Console. 2. Прописываем в строке код:

document.querySelectorAll('div > div.footer_button > div > div.offer_buy_block.buys_wrapp.woffers > div.counter_wrapp > div > span > span')

Вместо "div > div.footer_button > div > div.offer_buy_block.buys_wrapp.woffers > div.counter_wrapp > div > span > span" - вставляем собственный css-селектор. 3. В консоле должны появится отслеживаемые элементы. У меня отображаются все кнопки "В корзину" на странице - делаю вывод, что css-селектор выбран правильно.

Где применять css-селекторы

Мы нашли css-селектор, проверили его корректность - давайте теперь рассмотрим как его использовать. 1. Заходим в настройки триггера -> создаем новый триггер типа "Нажатие на все кнопки". 2. В условиях активации триггера выбираем (1)"Class Element" -> (2)Соответствует селектору CSS -> (3)наш css-селектор.   Настроили триггер, который теперь мы можем использовать в условиях активации цели. Как настраивать цели вы можете прочитать тут. Теперь проверяем правильно ли отрабатывает тег. 1. Заходим в предварительный просмотр. 2. Совершаем целевое действие. 3. Смотрим, по каким параметрам тег активировался.

Вместо итога

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