4. Разработка дизайна
Разработка дизайна проводилась на основе готовых прототипов, собранных референсов, проведенной аналитики.
Особый акцент был сделан на соответствие ожиданиям ЦА и брендбуку компании.
Повторимся: требовалось разделить целевую аудиторию уже на первом экране сайта и направить каждый сегмент пользователей по индивидуальному пути, предложив им отдельные сценарии взаимодействия.
И если на прототипе мы схематично показали, как данное разделение будет выглядеть, то при создании дизайна надо было с помощью всей совокупности визуальных элементов воплотить это в жизнь и найти такое решение, которое и соответствовало бы представлениями Клиента, и стало понятным и удобным для ЦА.
Так, первая дизайн-концепция была создана в соответствии с брендбуком.
Однако получившийся вариант не во всем соответствовал пожеланиям и задачам Клиента, в силу чего было принято решение не ссылаться полностью на брендбук.
Дело в том, что:
- Фирменные цвета, которые работают в офлайне, оказались менее эффективны в онлайн-пространстве: на сайте важно было обеспечить высокую читаемость и контрастность, чтобы улучшить восприятие информации.
- Онлайн-продвижение ISPsystem нацелено на определенные сегменты аудитории, значит, необходимо учесть их психотип, эмоциональные и цветовые предпочтения.
Как известно, цвета могут по-разному восприниматься разными аудиториями, и новый сайт должен вызывать нужные ассоциации и создавать комфортный визуальный фон для пользователей.
Так как у Клиента было четкое понимание своей ЦА и того, что основные ее представители — мужчины, так или иначе связанные со сферой IT, решили использовать более темные оттенки фирменных цветов, оставив синий в качестве акцентного. Неизменным, по сути, остался только фирменный шрифт.
- «Новый сайт — новый стиль». И он должен соответствовать трендам: современные цифровые стандарты диктуют необходимость гибкости в использовании палитры. В данном случае это позволило создать уникальный и актуальный стиль, который соответствовал текущим визуальным ожиданиям пользователей.
- Гибкость в цветовом решении помогает эффективнее продвигать услуги: новый стиль и палитра позволяют лучше подчеркнуть особенности продуктов, сделать сайт более запоминающимся, поддерживать развитие бренда в нужных направлениях.
Корректировка подхода позволила обеспечить релевантный опыт для каждой группы пользователей, что, в свою очередь, должно повысить их вовлеченность и облегчить процесс поиска нужных решений.
Кроме этого, решение задачи разделения путей для указанных аудиторий потребовало продуманного дизайна интерфейса и четкой логики маршрутов.
Что и отразилось во второй, финальной, дизайн-концепции, где для идеального с точки зрения соответствия и пожеланиям Клиента, и интересам ЦА, и трендам варианта мы прибегали к помощи ИИ-аналитики.
В частности, специалисты Комплето с помощью искусственного интеллекта проанализировали дизайн для получения тепловой карты проекта.
Здесь можно провести параллель с инструментом Тепловизор, доступным в Яндекс Метрике, только он показывает фактическое поведение пользователей на сайте, а ИИ помог нам сымитировать будущий опыт.
В результате мы получили:
- отображение мест, на которых будет сосредоточено внимание пользователя;
Пример тепловой карты
- данные по эффективности расположения кнопок с приблизительной оценкой % CTА по кликабельности:
Также для наглядности и более детального понимания пути пользователя был разработан интерактивный дизайн:
Как можно увидеть, итоговое дизайн-решение не в полной мере соответствует прототипу.
Все потому, что в прототипе мы не могли показать всю креативность, то самое «дизайнерское решение», за которым к нам и обратились, но схематично прорисовали варианты пути клиента, отражающие наше представление о нем и максимально соответствующие брендбуку.
Однако после сбора и рассмотрения конкретных референсов от него отказались в пользу более креативных решений.
Мы буквально креативили вместе с представителями Клиента, обменивались опытом, изучали референсы (в данном случае было рассмотрено около 30 референсов, тогда как «среднее по проекту» по нашему опыту — 10), провели 4 итерации результативных правок, благодаря чему и пришли к итоговому варианту, который в полной мере соответствовал и всем запросам Клиента, и потребностям целевой аудитории, и текущим трендам дизайна, и тенденциям в ИТ-нише.
Важно: не всегда обновление сайта подразумевает полный отказ от устаревшего варианта. У Клиента были в арсенале «стеклянные» 3D-иконки, и мы использовали их в новой дизайн-концепции в качестве акцентных. Более того, мы дополнили пак таких иконок, создав нужные для соответствия с контентом изображения в едином стиле.
Пример использования «стеклянных» иконок в новом дизайне
Все эти шаги позволили нам реализовать концепцию интуитивно понятного пользовательского пути, что должно стать важным преимуществом сайта и усилить его значимость как инструмента продаж, упрощая потенциальным заказчикам процесс выбора решения и увеличивая объем целевых обращений.
Антон Карасев,
директор по маркетингу ISPsystem
Не преувеличу, если скажу, что проект создания нового сайта по своей сложности и затраченному количеству ресурсов однозначно войдет в список лидеров департамента маркетинга ISPsystem!
Мы выбрали взвешенный подход к проектированию новой веб-витрины компании, поскольку не были ограничены в сроках: от этапа глубокой аналитики до итоговой подачи дизайн-макета.
Каждый этап требовал максимальной концентрации и участия нашей команды. Нужно помнить, что, каким бы классным, опытным и надежным ни был исполнитель, без всесторонней поддержки со стороны заказчика искомого результата никогда не добиться. Команда Completo обладает многолетним опытом реализации проектов из сложных B2B-тематик. Однако мы понимали, что без должного погружения в проект с нашей стороны, реализация его растянулась бы на многие месяцы.
Нам было важно получить «свежий взгляд со стороны», и я рад, что совместная с агентством работа помогла этого добиться. В итоге мы получили отличный сайт и существенно улучшили метрики.
