Тренды рынка

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

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

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


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

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

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

Изображение для статьи

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

Изображение для статьи

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

Изображение для статьи
Изображение для статьи

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

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

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

Изображение для статьи

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

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

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

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

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

Изображение для статьи

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

Изображение для статьи

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

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

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

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

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

Изображение для статьи
Изображение для статьи
Изображение для статьи

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

Изображение для статьи

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

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

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

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

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

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

Изображение для статьи
Изображение для статьи
Изображение для статьи
Изображение для статьи

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

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

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

Изображение для статьи

Ну и прочее:

  • 9 из 10 клиентов не получают решения своей проблемы после звонка в компанию. 
  • 51% опрошенных россиян почти не отвечают на звонки с незнакомых номеров
  • Предприятия пропускают около 22% звонков, которые они получают

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

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

Изображение для статьи
Изображение для статьи

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

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

Изображение для статьи
Изображение для статьи

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

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

Изображение для статьи

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

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

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

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

Изображение для статьи
Изображение для статьи

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

Изображение для статьи
Изображение для статьи
Изображение для статьи

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

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

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

Изображение для статьи

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

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

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

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

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

Изображение для статьи

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

Изображение для статьи

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

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

Сторис

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

Изображение для статьи

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

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

Изображение для статьи

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

Изображение для статьи

Apple-Like

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

Изображение для статьи

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

Изображение для статьи
Изображение для статьи
Изображение для статьи
Изображение для статьи

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

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

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

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

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

Изображение для статьи

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

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

Изображение для статьи
Изображение для статьи

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

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

Изображение для статьи

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

Изображение для статьи

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

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

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

Изображение для статьи
Изображение для статьи
Изображение для статьи

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

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

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

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

Изображение для статьи

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

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

Изображение для статьи

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

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

Изображение для статьи

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

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

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

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

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

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

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

Изображение для статьи
Изображение для статьи

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

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

Изображение для статьи
Изображение для статьи

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

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

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

Изображение для статьи
Изображение для статьи

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

Изображение для статьи
Изображение для статьи

Mobile Detach

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

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

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

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

Изображение для статьи

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

Изображение для статьи

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

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

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

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

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

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

Изображение для статьи

Презентация доступна по QR-коду в группе в Телеграм.

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

Реклама. ООО «ВЕБ РИЭЛТИ». ИНН 9728042820. Erid: 2SDnjdBg28K

Поделиться

Девелоперам: еженедельная рассылка о недвижимости

Полезные статьи о маркетинге и продажах в недвижимости. Помогаем развиваться и улучшать проекты девелоперов.

GMK Club
Что дает резидентство в GMK Club:
  • бесплатный чек-лист «Оптимальные показатели работы отдела продаж и маркетинга»;
  • электронная книга из серии «Библиотека девелопера»;
  • бесплатный доступ к эксклюзивным мастер-классам для девелоперов;
  • суперпосты в нашем блоге по закрытой ссылке;
  • приоритетное информирование о наших мероприятиях по всей России;
  • специальные цены и акции на наши услуги.