Кейс Landin Page для компании РСК

Создан самый презентабельный Landing Page в своей нише

Landing Page для компании РСК в нише сантехника

Цель: 

  • показать всю красоту изделий
  • отобразить презентабельность компании, так как нацелены на VIP-клиентов
  • преподнести в понятном формате все преимущества компании

Комманда: 4 человека (руководитель проектов, дизайнер, программист, верстальщик)

 

1. Прототип

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

Основные момент:

  • На втором екране решили разместить видео, так как услуга по комплексной комплектации сантехники довольная новая, и лучше сразу объяснить что к чему
  • Так как целевая аудитория довольно разносторонняя, в четвертом развороте разжевали для кого данная услуга. Архитекторы/дизайнеры, частные клиенты, строительные компании/подрядные организации

Для создания прототипа использовали Moqups. В итоге получилось вот так:

Прототип Landing Page для компании РСК

Клиент утвердил и мы поехали дальше.

 

2. Дизайн

Самый первый вариант первого разворота смутил даже меня, но все же решили показать клиенту (сделали в двух вариантах с разными продуктами):

Первый вариант первого разворота Landing Page

Второй вариант первого разворота Landing Page

Ответ клиента развеял все сомнения :)

"У нас дорогая красивая дизайнерская продукция – должно быть много красивых больших фото. И давайте избавимся от круга"

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

Дизайн первого разворота Landing Page для компании РСК

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

В последующих блоках так же часто использовали большие и качественные изображение. 

Хочу обратить внимание на эелементы брендинга. Где это было к месту, добавляли логотип и название компании (каталоги, карты). Брендинг впринцыпе убивает чувство дешевизны. Элемент малозаметный, но играющий важную роль.

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

Добивали дизайн до упора, пока не добились того самого золотого слова, без которого не можем переходить на этап верстки:

Вот кстати, что получилось в итоге:

Дизайн Landing Page для компании РСК

 

3. Верстка

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

Так как мы перфекционисты, срочно нужно избавлятся. Перешаманив с верстко все что можно, лучшим решением оказалось просто тупо увеличить стену справа на фотошопе, чтоб фотография стала выше. В итоге (+ стрелочки добавили): 

 

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

Итог: все довольны, все работает, сайт запустили) А вот и ссылка: http://set.rsk.ltd/