Адрес: bazarnaya.fskgotika.ru
 |  |  |
КЛИК ДЛЯ УВЕЛИЧЕНИЯ
Кейс сотрудничества с другой организацией; наша задача состояла в визуальной и технической реализации лендинг-страницы.
Содержимое укладывается в довольно классические объемы подобного формата. Это 8 экранов, разделенных логически.
Как вы можете увидеть из скрин-листа: экран приветствия — содержит тезисную информацию о новостройке с контактной информацией, навигацией и тематическим фото на бекграунде.
Второй экран — дает текстовое описание новостройки. Даты сдачи, близлежащая инфраструктура, количество и содержимое домов и т.д.
Далее идет карта, с наглядной маркировкой важных объектов района.
Задача четвертого экрана — демонстрация планировки. Он разделен на два функциональных блока — соответствующих двум домам.
Каждый блок — показывает планировку квартир, в зависимости от количества комнат; а так же общую схему каждого из этажей.
Это довольно сложная техническая секция, ведь не смотря на свою логическую простоту: сделать подобный элемент интерактивным и сохранить его понятность при адаптивности — непростая и очень кропотливая задача.
Каждая кнопка — содержит в себе несколько других кнопок. И все это опции выбора, которые не должны конфликтовать друг с другом.
Более того, как вы можете увидеть на мобильном скрин-листе — как порядок кнопок меняется, в зависимости от ширины экрана. Эту проблему нельзя решить лишь разметкой и пришлось создать дополнительный ряд кнопок с тем же функционалом.
Т.е. схематика следующая: в зависимости от типа устройства — скрыть одни кнопки, изменить их вид и показать другие в самой различной последовательности, не создавая между этими кнопками ошибочных пересечений их функционала.
Следующий экран — демонстрирует галерею строительных работ и состояния постройки на текущий момент времени. Галерея интерактивная и работает по принципу LightBox.
Финальный экран — представляет из себя блок контактов: карта, адрес, время работы, телефон.
И форму обратной связи. Причем кнопка «заказать консультацию» на первом экране — не перемещает нас в сюда, а вызывает всплывающее окно.
