2 заметки с тегом

анима

Новый сайт Анимы

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

Краткая предыстория

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

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

Расти можно только через боль.

Проблема: не видно продукта

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

Скриншот старой версии целиком можно посмотреть в Дроплере → https://d.pr/free/i/Jk73jw

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

Проблема: неинформативное описание функций

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

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

Проблема: высокая нагрузка на поддержку

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

Блок про внедрение и обучениен выглядел скучно

Решение: показать функции крупным планом и сократить текст

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

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

Сам продукт: его интерфейс, фотографии или изображение. Такой вариант был самым простым. Продукт уже готов, сделать скриншоты или отрисовать нужные экраны — это пару дней работы.

Иллюстрации: комикс или история в картинках. Для неё нужен иллюстратор и много времени. Нам этот вариант не подходил.

Продукт в использовании: гифки, видео и анимация. Самый красивый и эффектный вариант, но и самый трудозатратный. Поэтому мы сразу отправили его в корзину.

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

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

Стало лучше, но проблемы не решились: продукт всё ещё выглядит мелко, а текст теряется.

Отдельной проблемой были разные цвета в каждом блоке. Это сбивало с толку, пользователю пришлось бы привыкать к каждому экрану заново и разбираться, что есть что. Это особенно заметно по чёрному блоку про внедрение ЦРМ-системы. Три картинки, внезапный зелёный цвет — такое никуда не годится.

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

Управлять вниманием читателя можно не только заголовком, но и контрастом.

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

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

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

Тезисно

У нас была проблема: неинформативный сайт о ЦРМ-системе. Чтобы исправить это, мы вынесли продукт на первый план.

  1. Показали интерфейс Анимы крупным планом, сделали его якорным элементом на всех экранах.
  2. Сократили и переписали все тексты, выделили главное, чтобы не пришлось читать весь абзац.
  3. Проиллюстрировали раздел о внедрении ЦРМ.
  4. Ответили на частые вопросы клиентов.

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

Редактор отвечает за продукт, а не за текстики.

Заценить новый сайта Анимы →


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

 Нет комментариев    212   29 дн   анима   портфолио

Анима: выбор стратегии для продуктового медиа

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

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

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

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

На старте проекта, важно понять, какая стратегия будет основной. Обе взять не получится, так как это не даст никакого результата, и скорее всего убьёт продукт. Потому что ресурсы любой компании конечны. Я сейчас не рассматриваю гигантов вроде Гугла или Микрософта. Они могут экспериментировать и закрывать продукты. Но у маленького российского продукта такой возможности нет.

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

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

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

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

Человеку просто рассказали о возможности, а он сам решил её использовать. Такие покупатели стоят дорого, зато они делают выбор наверняка, и остаются верными продукту долгие годы.

В Аниме мы выбрали именно такой подход. Будем делать медленно, долго, зато наверняка. Хайп — это хорошо, но эффект от него быстро проходит.