— Проект — довольно интересный, не совсем типовой. Вместо Битрикса, который отлично подходит для создания корпоративных сайтов с каталогами, здесь мы использовали целую пачку технологий:

Фреймворк Laravel плюс админку Voyager, заточенную специально под него; фреймворк для создания пользовательских интерфейсов Vue. js плюс Vuex — реактивную технологию, которая является частью Vue; а для фильтра — могучий Elasticsearch.

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

И конечно, мы использовали CSS-переменные: за счёт них, например, мы можем перекрашивать страницы жилых комплексов застройщика в фирменные цвета. Да, штука не новая, но с тех пор, как IE11 сбросили со скалы (This is Sparta!), её можно использовать без оглядки на него :)

— Главное пожелание заказчика — никакого Битрикса, с которым у него были проблемы из-за техподдержки на прошлом проекте. Почему Laravel? Потому что клиент хотел что-то универсальное, чтобы потом можно было разработать REST API и мобильное приложение.

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

— Фильтрацию в каталоге «пилили» сами, включая и «умность» фильтра. Чаще мы на проектах используем битриксовый, потому что он закрывает потребности пользователей.

Здесь — обратились к Elasticsearch, чтобы сократить количество запросов к базе данных для получения списка возможных значений каждого из параметров фильтра. Изначально было примерно 3N запросов, где N — количество параметров. С Эластиком удалось сократить до N запросов к базе и паре запросов к самому Эластику.

— Фильтр — динамический, при изменении параметра фильтрации сразу становятся недоступны неподходящие параметры, и показывается актуальное количество объектов.

— Админка касаемо подборщика — гибкая. Шаги можно ставить в произвольном порядке, можно даже сделать их повтор, задавать каждому своё название. При необходимости какие-то шаги можно опустить.

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

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

— Обычно на проектах с Битриксом мы делаем типовую текстовую страницу, для которой создаем разные варианты блоков. В Laravel всё иначе, поэтому на дизайне мы предусмотрели универсальный шаблон-конструктор страниц, который дополнили ещё пачкой компонентов:
 — баннерами 2-х форматов;
 — слайдером изображений с описанием к каждой картинке;
 — табами;
 — прикреплением файлов;
 — формой обратной связи.
Для сборки кастомизировали редактор Tiny.MCE, который предусмотрен в Laravel. Для этого сделали компоненты, как сниппеты/компоненты в Битриксе, а их создание кастомизировали: залинковали каждый компонент с местом в админке, где тот создается. Благодаря этому получился схожий с Битриксом функционал, когда типовую текстовую страницу можно собрать из любых нужных компонентов из списка.

— Типовая текстовая страница — стоит особняком, поскольку в Laravel в принципе нет такого понятия. Да еще и дизайн у неё оказался не самым простым: с баннерами, вкладками, возможностью встраивания одной страницы в другую. Поэтому в админке пришлось создавать механизм, который позволяет внутри текста вставлять компоненты (прямо как в Битриксе).

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

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

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

— В первом спринте мы написали кастомный импорт: он берёт данные каталога из 1С и все дополнительные сущности. Импорт — одним файлом, выгрузка — по расписанию. Дополнительно прописали обмен c 1C: для этого написали обработчики на стороне сайта, по которым 1С сразу передаёт изменение цен и статусов.

—  Наша команда получила новый современный сайт, управлять которым мы можем автономно, даже несмотря на то, что на нем реализовано много технологически сложных решений. Мы сами добавляем на сайт новые ЖК — теперь весь трафик идет на единый сайт застройщика, а не на отдельные лендинги, как раньше. Сами делаем 3D-туры, подборщики квартир, не привлекая разработчиков по каждому случаю. Такой вариант обходится нам дешевле и делается быстрее.

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