Атмосферный редизайн: кейс перезапуска корпоративного сайта жилого комплекса

Рассказываю, как мы помогли жилому комплексу Новая Боровая переосмыслить дизайн их корпоративного сайта. Создали и проработали информационную архитектуру, прототипы и разработали свежий стиль, подходящий под позиционирование компании.

Новая Боровая - жилой комплекс, позиционирующий себя, как город-сообщество с особой атмосферой, где люди доверяют друг другу. Район располагается на участке площадью более 100 гектаров, рядом с главным проспектом Минска. Проект одержал победу в премии «Home Awards: Лучшее для жизни в сфере ремонта, строительства, архитектуры и дизайна Беларуси» в номинации «Лучший жилой район».

Целевая аудитория - в первую очередь это покупатели квартир для жилья. Групп может быть несколько: молодые семьи без детей, семьи с детьми, одинокий молодой человек (любого пола), пожилые люди. Также это могут быть люди покупающие недвижимость для последующей продажи.

Цели у проекта - это достичь максимального комфорта при использовании сайта. Вся информация должна быть доступна и находиться в четкой иерархии.

Для вдохновения и поиска интересных референсов я в основном обращаюсь к dprofile, behance, awwwards, savee.it

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

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

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

Из важных фич: 3d обзор жилого комплекса.

Итог: четко продуманная информационная архитектура, user flow, прототипы с организацией всей информации.

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

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

Но все же, как акцентный цвет мы выбрали синий. Холодный, но передающий надежность и в какой-то степени умиротворение.

Типографика максимальна простая и четкая. Шрифт San Francisco. Большие и длинные заголовки сочетаются с мягким текстом. В целом легко читать и не приходится бегать глазами чтобы найти нужные отрывки текста.

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

Достаточно интересный слайдер с описанием условий покупки. Простой, но информативный и понятный.

Для реализации формы я использовал длинный заголовок, простые поля для ввода и контактные данные.

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

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

Я на самом деле обожаю совмещать строгий стиль с интересной сеткой и композицией. В этом проекте было достаточно информации и изображений.

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

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

Кредит

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

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

Итогом стал удобный для пользователя продукт, который отвечает всем его потребностям. Легкий и доступный текст повысил глубину просмотра, следовательно облегчил задачу консультантам.

При взаимодействии пользователь получает необходимое количество данных: детальную информацию о жилом комплексе "Новая Боровая" и другой тематический контент.

Бизнес в свою очередь получил площадку для привлечения продаж и построения плодотворных отношений с клиентом. Из дополнительных плюсов: возможность делиться анонсами событий и привлекать персонал в команду.

Автор кейса — Волков Арсений
Для заказа писать — t.me/arsenijtut

Проект на dprofile ❤