Редизайн сайта зарубежной платформы для продажи рекламы в социальных сетях «Admass»

Admass.io — платформа для рекламы в социальных сетях, ориентированная на конверсию и использующая сарафанный маркетинг. Это полноценная платформа для развития и рекламы бизнеса, авторов в интернете. Клиент обратился к нам с просьбой: «немного освежить дизайн», сделать его современным, лёгким для восприятия.

Задачи проекта:

Провести аудит сайта;

Сделать анализ юзабилити;

Разработать и внедрить обновленный дизайн сайта;

Сверстать и наполнить контентом новые страницы.

Провести анализ ЦА, конкурентов и услуг;

Разработать прототип и дизайн сайта;

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

Провести проверку эффективности. Проверить работу сайта в разных браузерах и на разных устройствах. Провести юзабилити-тестирование.

Анализ целевой аудитории

На данном этапе было проведено полное исследование целевой аудитории. Выявлены проблемы и потребности пользователей.

Целевая аудитория: инфлюенсеры.

Анализ конкурентов

составлен ТОП-3 главных конкурентов;

выявлены сильные и слабые стороны;

изучены идеи, которые уже реализованы и подходят для целевой аудитории клиента.

Анализ услуги

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

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

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

После того, как прототип был согласован с клиентом, мы перешли к следующему этапу — дизайну страниц сайта.

Цвета играют немаловажную роль в дизайне сайта.

За основу мы взяли темно-синий цвет бренда.

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

Фон — белый. Он подчеркивает контрастность основного и акцентного цветов.

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

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

Для десктопной версии мы выбрали классическую модульную сетку, состоящую из 12-ти колонок. Она идеально подходит для блочной структуры сайта и расположения элементов на странице.

Для мобильной — модульная сетка из 4-х колонок. Данное количество колонок значительно облегчает верстку сайта.

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

Проведен анализ ЦА, конкурентов и услуг;

Разработан прототип и дизайн сайта. В общей сложности выполнен дизайн 77-ти страниц сайта, что в среднем в 4 раза больше типового количества страниц на подобных сайтах;

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

Проведена проверка эффективности. Проверена работа сайта в разных браузерах и на разных устройствах. Проведено юзабилити-тестирование.