Кейс разработка дизайна лендинга для спецпроекта Домокомплекты Технониколь

Домкомплекты
Технониколь

Разработка лендинга
и отрисовка иллюстраций

ПРОЦЕСС РАБОТЫ

Игорь
Проект-менеджер

Александра
Иллюстратор

Лена
Копирайтер

Катя
Старший дизайнер

СПЕЦИАЛИСТЫ

СРОК

ИНСТРУМЕНТЫ

18
дней

ЗАДАЧА ПРОЕКТА

Разработать дизайн лендинга с иллюстрациями для нового спецпроекта «Домокомплекты Технониколь» .

ЗАКАЗЧИК

Корпорация ТЕХНОНИКОЛЬ

Ведущий международный производитель надёжных и эффективных строительных материалов и систем

Работаем с заказчиком с 2018

За это время разработано 22 проекта

ПОДГОТОВКА | 1 ДЕНЬ

Изучение ТЗ, выстраивание плана работ

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

ПЕРВЫЙ ЭТАП | 2 ДНЯ

Разработка прототипа сайта

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

ВТОРОЙ ЭТАП | 3 ДНЯ

Дизайн-концепция

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

Дизайн в светлых, спокойных,
пастельных тонах преимущественно

Добавили чуть больше яркости и насыщенности в цвете

Ещё больше яркости и насыщенности
в каждом блоке сайта

Итог
согласования

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

ТРЕТИЙ ЭТАП | 7 ДНЕЙ

Отрисовка иллюстраций для сайта

Отрисовали 4 домика по мотивам реальных проектов домов от Технониколь. Обыграли каждый
зимними и летними пейзажами, разными природными ландшафтами.

Иллюстрация для главного экрана

Иллюстрации для результатов теста

Карта-схема

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

ЧЕТВЁРТЫЙ ЭТАП | 3 ДНЯ

Продолжение дизайна сайта

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

ПЯТЫЙ ЭТАП | 1 ДЕНЬ

Адаптивы. Подготовка к вёрстке. Передача

Написали подробное ТЗ по функционалу, дизайну и анимации для верстальщика. Это ответственный этап, от которого во многом зависит результат. Сайт должен быть понятным и комфортным для пользователя, адаптивным и должен корректно отображаться на всех устройствах. Передали все материалы на вёрстку.

ЗАКЛЮЧИТЕЛЬНЫЙ ЭТАП | 1 ДЕНЬ

Тестирование. Проверка

Тестирование сайта

Протестировали работу сайта на исправность. Проверили отображение в нескольких браузерах и на мобильных устройствах Andriod и IOS.

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

Проверка дизайна

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

Проверка
текста

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

Игорь Костромин
CEO студии

Оставить заявку

Написать в Telegram

Давайте обсудим
ваш проект

МЕДИА

Telegram

YouTube

VC.ru

DSGNERS!

Данный сайт носит информационно-справочный характер
и ни при каких условиях не является публичной офертой