Как создать визуальные эффекты, призывающие к действию
Как создать визуальные эффекты, призывающие к действию
27 июня 2016

Как сделать ваши Call-to-Action элементы более эффективными.

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

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

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

Каждый призыв к действию хочет немного внимания

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

Желаемое действие, как правило, не так привлекательно для первых посетителей. Вы не можете просто приглашать людей на свой сайт словами "приди и подпишись на мою электронную рассылку!" Конверсия такого призыва будет слишком ничтожной...

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

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

Тем не менее, тот же подход не будет хорошо работать, если вы используете его для вашей кнопки «купить» на странице продаж. Вы хотите подготовить своих посетителей? Решите их проблемы и создать интерес прежде чем просить их купить ваш продукт.

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

Сначала определите ваши визуальные паттерны

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

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

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

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

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

Почему нужно "разбить" ваш красивый дизайн? Чтобы привести глаза ваших посетителей прямо в ваше предложение на загруженной странице. Другими словами, чтобы привлечь внимание ваших посетителей в то место, где вам это нужно. Чтобы лучше объяснить, представьте, что вы приглашены на вечеринку, где каждый одет в то, что хочет. Итак, у вас есть все различные цвета и стили. С такими вводными довольно трудно выделиться из толпы, если вы хотите чтобы кто-то обратил внимание на вас. Конечно же это не невозможно, но вы должны принять некоторые радикальные шаги.

Теперь представьте, что вы собираетесь на вечеринку, где каждый одет в черно-белое. Что вы могли бы сделать, чтобы выделиться из толпы? Можно было бы просто надеть красную футболку! Точно так же и с CTA - делайте его контрастным.

Теперь, разорвите ваши визуальные паттерны

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

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

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

Вот так несложно можно повысить конверсию на ваших CTA элементах.

Читайте также
5 UX трендов, которые вы увидите в 2016 году
5 UX трендов, которые вы увидите в 2016 году

Какие тренды только зарождаются в UX? Читайте об этом и о будущем UX в данном материале.

27.06 0
Как улучшить навигацию и подготовиться к эре мобильного интернета?
Как улучшить навигацию и подготовиться к эре мобильного интернета?

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

22.06 0
8 худших UX ошибок и как их не делать - Комментарии экспертов
8 худших UX ошибок и как их не делать - Комментарии экспертов

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

28.05 0
Как выглядит простота в UX?
Как выглядит простота в UX?

В этой статье речь пойдёт о простоте, её природе и влиянии на UX. Немного мыслей на предмет того, что определяет качественный пользовательский опыт от плохого.

28.05 0
Комментарии

×
Подписка на новости Skillsup

Заполните поля, чтобы получать новости о дизайне от Skillsup,
обещаем не тревожить чаще 2-х раз в неделю.
Если передумаете — во всех письмах будет ссылка на отписку.