UX-тренды на сайтах девелоперов

ИдаПроджект – PropTech разработчик сайтов крупнейших девелоперских компаний из топ Forbes и ЕРЗ. Занимает 1-е место в Рейтинге Рунета в категории разработчиков сайтов по недвижимости 2024. Компания прорабатывает все точки касания и имеет одну из самых глубоких экспертиз в сфере создания digital-инструментов для продажи недвижимости.

Дизайн-директор ИдаПроджект Павел Гавриченко и глава отдела аналитики и исследований Аким Усманов в компании с другими исследователями изучили сайты российских девелоперов из топ ЕРЗ и делятся лучшими фишками.

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

Спойлеры:

- Выносите в карточку проекта информацию о локации и фотографии места

- Размещайте ипотечный калькулятор прямо в карточке квартиры

- Показывайте типовые планировки на разных этажах

Подробнее об этом и других трендах – в материале ниже. А если для вас более удобен формат видео, смотрите юбилейный выпуск VK или на Youtube.
Поехали)

UX-тренды на сайтах девелоперов

Для удобства разделили текст на смысловые блоки, используйте навигацию, чтобы перемещаться между разделами:

Локация на карточках проектов

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

Одни из первых эту проблему решили мы, работая с «Самолетом» еще в 2020 году — в дополнение к указанию станции разместили информацию о локации в карточке проекта.

UX-тренды на сайтах девелоперов

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

UX-тренды на сайтах девелоперов

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

Все самые свежие тренды оперативно появляются в виде новых блоков в Ида.Лайт — ноу-код инструменте для создания продающих сайтов ЖК без головной боли. Там уже больше 1 000 блоков с гибкой кастомизацией дизайна.

Типовые планировки на разных этажах

Впервые мы реализовали это давным-давно у Страны Девелопмент.

UX-тренды на сайтах девелоперов

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

— А есть эта квартира на другом этаже?

— Где самая дешевая такая планировка?

— Есть такая же, но со скидкой?

Вариант, реализованный для КРОСТ в 2022-м, — уже лучше. Он наглядно показывает изменение цены.

UX-тренды на сайтах девелоперов

Как это реализуется в 2024-м, можно увидеть на примере из Красноярска. Девелопер «Арбан» сделал удобный и быстрый просмотр типовых решений прямо в выдаче. Первые, у кого мы заметили аналогичный вариант, был ЖК Balance от компании «Главстрой».

UX-тренды на сайтах девелоперов

Это отличный вариант для изучения типов планировок, потому, что он сжимает множество вариантов до десятка — это позволяет оперативно ознакомиться с квартирографией.

Инфраструктура и ипотека

Карта инфраструктуры уже успела стать трендом и находится в разработке у некоторых застройщиков.

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

Самые современные калькуляторы сейчас — у GloraX, ПИК и А101.

Кстати, первый подход к упрощению калькулятора пришелся на 2021 год. Именно тогда произошел маркетинговый бум со ставками в 0.01%, и мы с «Самолетом» переосмыслили этот инструмент. Вместе мы реализовали формат сравнения двух ипотечных программ, который впоследствии позаимствовали многие застройщики.

UX-тренды на сайтах девелоперов

Информация об ипотеке

80%+ покупок в ипотеку, а вы все еще указываете цену для 100% оплаты?

Тогда вы пропустили тренды начала пандемии. Площадь, комнатность и цена квартиры — основные параметры выбора. Если человек покупает квартиру не в ипотеку, а, например, в рассрочку или через полную оплату , то его оффер меняется. Например, на сайте ПИК стоимость квартиры при покупке с семейной ипотекой — 15 941 303 ₽, а в рассрочку — уже 16 780 320 ₽.

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

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

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

Быстрые контакты

Если у ваших покупателей не только макбуки и айфоны, то стоит дать дополнительные ссылки на мессенджеры — Телеграмм, WhatsApp и где-то даже Viber. Тем более, все больше людей предпочитают именно такой способ связи.

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

UX-тренды на сайтах девелоперов

Ну и прочее:

9 из 10 клиентов не получают решения своей проблемы после звонка в компанию.

51% опрошенных россиян почти не отвечают на звонки с незнакомых номеров

Предприятия пропускают около 22% звонков, которые они получают

Все знают о трудностях работы колл-центров. И про потерянные заявки тоже — это общая проблема рынка.

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

Все так же можно писать ему, чтобы дожимать до продажи, а еще писать можно в рабочее время и вам охотнее будут отвечать именно в мессенджере. Так что предложите пользователям альтернативу прямо на сайте — это уже хорошо реализовано у DOGMA и Практики. А одни из первых, кто так сделал – МСК Девелопмент.

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

Вложенное меню

С меню самый распространенный тренд. Что у нас было раньше:

UX-тренды на сайтах девелоперов

Бургер меню, когда в хедере нужно нажать на иконку из трех горизонтальных полосок, чтобы открыть полную карту сайта — плохой UX, его считают одним из худших типов навигации.

Использовать его можно только если иное представление по каким-то причинам невозможно. Например, невероятно много контента или требуется достаточно жестко делить аудиторию.

Классическое двухуровневое меню, как у MR Group, тоже не лучшее решение. Оно плохо раскрывает пункты, которые мы туда внедряем.

До сих пор помню как долго Тинькофф тестировали отказ от такого подхода и в несколько заходов внедряли текущее, максимально упрощенное меню.

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

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

Однако, если вы возьметесь делать меню, нейминг – ваш главный враг.

В еще одном исследовании: подготовили 4 макета с разными названиями вкладки с жилыми комплексами в хедере сайта. Собрали около 60 респондентов. Попросили перейти в просмотр жилых комплексов.

UX-тренды на сайтах девелоперов

К примеру, привычные нам «Проекты» могут и проиграть «Новостройкам», если исследовать это подробнее. Но у некоторых застройщиков Новостройки ассоциируются со Стандарт и Комфорт классом и дешевят.

Выбор локации в подборщике

Далеко не все, кто заходит к вам с Главной, идут выбирать проекты. Они хотят планировки и цены! Но планировки и цены без локации ничего не значат.

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

В листинге квартир в Level мы расположили фильтрацию по расположению, что поможет таким пользователям лучше понимать цену локации.

UX-тренды на сайтах девелоперов

ПИК давно работает с этой аудиторией — объединив фильтры проекта и фильтр квартир. Но страницу с подбором квартир трудно найти через основную навигацию сайта.. Да и подбор в таком виде слишком сужает выборку.

UX-тренды на сайтах девелоперов

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

Тем не менее, добиться такого можно и другими способами.

Сторис

Да, это сторис!

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

Еще в 2023 году Брусника, а сейчас и А101 с Level перобразовали мультиофферы на первом экране упаковав их в сторис. Думаю, что в ближайшие пару лет мы увидим такой реализации только больше.

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

UX-тренды на сайтах девелоперов

Apple-Like

Не помню, какой это был год, помню только, что тогда Аким сказал — это нам нужно. А я уже сделал концепт.

UX-тренды на сайтах девелоперов

Я даже не скажу, кто начал первым, но оно понеслось: Самолет, Level, GloraX, ПИК, St.Michael, Гранель! Свеженький Гранель!

Это очень красивый формат рассказа УТП о вашем проекте. Компактный, с картинками, сразу обо всем, что продает. Особенно он хорошо работает с людьми, которые не изучают проект подробно. Посмотрел на красивые квадраты — уже понял большую часть проекта. То, что нужно, чтобы решить, интересен ли тебе этот проект.

А еще его легко заскринить и переслать партнеру или вставить в презентацию.

Тренд на человечность

У нашей команды есть такая ценность – человекоцентричность. Она про подход к людям. Про то, как мы видим личность и помогаем ее развивать. Неважно, вы член нашей команды или представитель клиента. Мы все – люди, и нам важна коммуникация.

С интерфейсами так же. «A101» спрашивает у вас не: «Подходите ли вы под условия льготной семейной ипотеки?», а «Есть ли у вас ребенок, который родился после 2018 года?». Согласитесь, ответить на второй вопрос намного легче. Потому что он понятный.

UX-тренды на сайтах девелоперов

Брусника расскажет, что такое патио, и покажет, как это выглядит.

UX-тренды на сайтах девелоперов

А Level не просто покажет фото хода строительства, но и объяснит, какие работы производились и зачем они были нужны.

Кластеризация проектов

Иногда у застройщиков в одной локации несколько проектов для одной и той же ЦА. Тогда организовать выборку на сайте, да и продвигать проекты удобнее как «кластер». Застройщики все чаще задумываются об объединении проектов и кажется, только сейчас мы переходим к тестированию этого формата.

UX-тренды на сайтах девелоперов

Если вы вдруг решите, что ПИК сделал это первым, то нет. Бигвилли уже давно существуют у ребят из Казахстана. Они так называют кластеры и выделяют под них отдельные рекламные странички. Например, у BI Group, которым мы помогали с дизайном сайта.

UX-тренды на сайтах девелоперов

Базовая информация о проекте

База: размещение информации о сроке сдачи, цене, метро на первом экране сайта. Если у вас вдруг этого нет, то надо дорабатывать. Это информация важна и для тех, кто переходит с рекламы и тем, кто получает ссылку «а посмотри еще вот это».

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

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

Человечный текст

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

UX-тренды на сайтах девелоперов

Вам необходимо иметь первоначальный взнос от 20% для льготных ипотечных программ Семейной ипотеки и ипотеки для ИТ специалистов, от 30% для льготных ипотечных программ с Господдержкой. По стандартным ипотечным программам минимальный первоначальный взнос начинается от 15%.

В недвижимости мало копирайтеров, которые могут писать тексты классно, понятно, однозначно и с нужным Tone of Voice. В нашей команде базово такие проблемы решает ИИ:

Для ипотечных программ «Семейная ипотека» и «Ипотека для ИТ-специалистов» первоначальный взнос должен быть не менее 20%. Для программ с государственной поддержкой — не менее 30%. По стандартным условиям взнос составляет от 15%.

UX-тренды на сайтах девелоперов

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

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

UX-тренды на сайтах девелоперов

Общие связанные фильтры

Одно из основных отличий недвижимости от ритейла — вложенность покупки. В e-com мы часто покупаем товар, который нам доставят через N дней или даже часов. Товар живет сам по себе — найти его просто, достаточно написать нужное слово в поисковой строке маркетплейса.

Для условной электрощетки трек поиска и покупки будет таким: Открыть Ozon → Ввести в поиск «Электрощетка» → Выбрать вариант

В случае с недвижимостью мы покупаем кота в мешке, которого увидим через пару лет (в лучшем случае), а при поиске квартиры мы выбираем не только планировку, но и ЖК.

Трек подбора растягивается и включает несколько пунктов, вложенных друг в друга: Локация → Проект → Дом → Квартира

И как раз из-за вложенности покупки длительность поиска дольше. Упростить процесс помогут фильтры: в e-com они действуют на категорию определенных товаров, а в недвижимости одни и те же фильтры позволяют выбрать сначала ЖК, а после Квартиру.

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

Такой сценарий уходит в прошлое, все стремится к упрощению. У ПИК, Гранель и еще парочки застройщиков теперь один фильтр, который отвечает за подбор проектов и квартир. Параметры сохраняются и пользователю не нужно многократно вводить одно и то же.

Еще одна фишка ритейла, которая также перешла в недвижимость — флеш-фильтры для быстрой смены параметров.

Комплексная покупка

А что, если при подборе квартиры дать возможность сразу выбрать машино-место и кладовую? Так и застройщику средний чек покупки выше, и пользователю удобно.

Такой сценарий реализован у Брусники. Но самым первым появился у МСК Девелопмент.

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

Mobile Detach

Мы наблюдаем новый расцвет mobile first подхода. Точнее, его перерождение.

Внутри команды мы используем термин mobile detach — персонификацию интерфейса для пользователей мобильной версии, которая может быть лишена части решений из desktop’а и иметь собственные блоки.

Особенно ярко это выражено с функциональными блоками — фильтр квартир, подбор ипотеки. Контент подается многоэтапно. Для быстрого ознакомления — краткая информация, мы ценим ваше время. Хотите подробнее — вот вам сторис. Нужно больше деталей — читайте лонгрид в духе vc.ru.

На десктопной версии фильтры часто открыты для взаимодействия сразу, в мобильной версии мы можем скрыть фильтр в кнопку. Но это привычный формат. А вот открывать сразу фильтры по нажатию на кнопку «Квартиры» в меню или на странице проекта — новый паттерн. Он основан на потребности пользователей сначала взаимодействовать с фильтрами, а потом с товарами. Карточки квартир часто не обладают красивой фотообложкой, а стоимость столь высокая, что нет смысла скроллить ленту с квартирами до применения фильтрации.

UX-тренды на сайтах девелоперов

И дело тут не в том, что у каждого застройщика доля посещений с мобильных устройств составляет от 60 до 90%. Просто мир изменился и потребление контента тоже. Новые поколения больше зависают в смартфонах, потому что они всегда под рукой. Мы смотрим рилсы, шоты, тик-токи — потому что это быстрая доза дофамина и такая доступная.

UX-тренды на сайтах девелоперов

Вот и интерфейсы учатся адаптироваться под формат, момент и аудиторию. Прямо как с хорошей презентацией.

Подводим итоги

Как вы могли заметить, мы часто упоминаем застройщиков из топ-20. Тут есть корреляция: вложения в сайт напрямую влияют на развитие компании, продажи и рост в рейтинге. Не единственный фактор, но значимый.

Пройдемся шустренько по всему списку:

  • Размещайте информацию о локации на карточках
  • Показывайте доступные планировки такого же типа на других этажах
  • Делайте расчет и сравнение ипотеки проще
  • В инфраструктуре рассказывайте об особенностях локации — цифрами, картинками и разделением на лайфстайл
  • Рассказывайте про первый взнос и минимальный ипотечный платеж в карточке квартиры и на странице
  • Дайте возможность общаться с вами не только по телефону, но и в мессенджерах
  • Меню делайте удобным и вообще побольше времени уделяйте навигации, потому что это самый простой способ поднять метрики
  • Сделайте общий связанный фильтр на всем сайте и сохраняйте параметры при переходе со страницы на страницу
  • И добавьте туда удобный выбор локации
  • Важную информации подавайте через привычные сторис
  • Особенности показывайте будто вы Apple
  • Оставайтесь человечными и понятными
  • Объединяйте схожие проекты в группы, особенно если у вас их много
  • Всю ключевую информацию о проектах рассказывайте с первого экрана
  • Пишите классные тексты — ОЧЕНЬ прошу
  • Дайте возможность покупать квартиру вместе с элементами допродажи
  • И выделите время для качественной проработки мобильной версии
  • Собирайте продающие сайты ЖК в Ида.Лайт — быстро и без головной боли

Такие вот получились выводы даже не только к этому материалу, но и ко всему 3 сезону Инсайта.

Как всегда — презентация по QR-коду в нашей группу telegram.

UX-тренды на сайтах девелоперов

Дальше — больше.

Начать дискуссию