Жилой комплекс «Северная гавань» придуман для примера, кадры пролёта сгенерированы. Так может выглядеть лендинг вашего ЖК: прокрутите ниже — камера пролетит над кварталом, подлетит к башне и опустится на террасу. Под примером — что должно быть на таком лендинге, как я его делаю и сколько он стоит.
Северная гавань
Жилой комплекс на набережной: пять башен вокруг парка, пентхаусы с террасами над водой.
0машин во дворе
Парковка — на двух подземных уровнях. Наверху парк с прудом, детские площадки и дорожки для самокатов.
7минут пешком до метро
По набережной, без перехода через проспект. До воды — две минуты.
24этажа в главной башне
Три верхних занимают пентхаусы, к ним поднимается отдельный лифт.
3,4 мпотолки в пентхаусах
Окна от пола до потолка смотрят на реку и на закат.
48 м²терраса у пентхауса
Своя у каждого: стеклянное ограждение, подсветка в полу, вид на воду.
2027ключи в IV квартале
Отделка white box или под ключ — на выбор. Квартиры и цены — ниже.
Квартирыот студии до пентхауса с террасой
Пять форматов в пяти башнях. Цены — за квартиру с отделкой white box, без скидок и рассрочки.
| Формат | Площадь | Этажи | Цена от |
|---|---|---|---|
| Студия | 26–31 м² | 3–15 | 8,4 млн ₽ |
| Евродвушкакухня-гостиная и спальня | 39–46 м² | 3–18 | 11,9 млн ₽ |
| Две спальни | 58–71 м² | 4–21 | 17,2 млн ₽ |
| Три спальни | 84–102 м² | 6–21 | 24,8 млн ₽ |
| Пентхаусс террасой 48 м² | 146–194 м² | 22–24 | 61 млн ₽ |
«Северная гавань» — вымышленный комплекс: башни, планировки, цены и сроки придуманы для примера. На сайте застройщика таблицу заполняют из прайса отдела продаж.
Это демонстрационная страница: жилой комплекс в ней придуман, а механика настоящая. Пролёт камеры — не видеоролик, а 90 кадров, и номер кадра зависит от того, насколько вы прокрутили страницу. Остановились — камера зависла над кварталом, прокрутили назад — отлетела обратно. На лендинге вашего ЖК всё устроено так же, меняются только кадры и подписи.
Сначала задаются начало и конец: вид на квартал с высоты на закате и терраса на верхнем этаже башни. Движение между ними сгенерировано — восемь секунд полёта. Ролик разрезан на кадры, и прокрутка выбирает, какой из них показать: камера слушается колеса мыши и пальца, а не таймера.
Кадры привязаны к прокрутке по движению, а не по времени: где камера летит быстро, на шаг прокрутки приходится больше пути, где медленно — меньше. Поэтому пролёт идёт ровно: не проскакивает быстрые участки и не зависает на медленных.
Каждый кадр — отдельный файл 1600×900 в WebP, все загружены в Тильду. Пролёт весит больше остальных примеров: камера движется, и в кадре меняется каждый пиксель, а не только предмет на спокойном фоне. Поэтому вес считаю до начала работы.
Первый кадр появляется вместе со страницей, остальные догружаются по ходу прокрутки, по нескольку файлов разом. Пока посетитель читает заголовок и первые подписи, пролёт успевает подгрузиться.
Этажность, дорога до метро, двор без машин и срок сдачи стоят поверх сцены обычной вёрсткой, а не впечатаны в кадры. Их меняют без перерендера, а на телефоне они встают под кадр и не закрывают дом.
Пример собран на Tilda в одном блоке с кодом, на сайте на чистом коде механика та же. На телефоне стоя кадр встаёт в верх экрана целиком по высоте, подписи и шкала пролёта — под ним, дом ничем не закрыт.
Пролёт камеры продаёт вид и атмосферу, но квартиру выбирают по цифрам. Поэтому вокруг сцены на лендинге жилого комплекса стоят блоки, без которых заявку на просмотр не оставят. С них и начинается дизайн сайта ЖК: сначала порядок экранов, потом красота.
Вид, факты, квартиры и цены, планировки, ипотека, документы, заявка. Человек пришёл с рекламы и за минуту должен понять, подходит ли ему дом по цене, сроку и району.
Лендинг ЖК делают под корпус, очередь, старт продаж или формат квартир. На него ведут рекламу, а сравнивать все дома застройщика удобнее на полном сайте.
Кнопка на каждом экране открывает форму, в которую уже попали выбранная планировка или корпус. Менеджеру не нужно переспрашивать, о какой квартире речь.
Нужен не лендинг, а пример сайта застройщика целиком — с шахматкой, документами и обновлением наличия? Он разобран на странице «Сайт для застройщика».
В примере — жилой комплекс, но приём годится для любого объекта, который продают видом и масштабом. Для вашего дома, посёлка или бизнес-центра сделаю пролёт по его рендерам, с его цифрами и в его фирменном стиле.
Лендинг делается от 7 дней, пролёт камеры добавляет несколько рабочих дней на кадры и привязку к прокрутке. Срок материала зависит от того, есть ли рендеры, и называется до старта, а не по ходу.
Разбираем комплекс, покупателя и рекламу, согласуем порядок экранов и путь камеры: откуда начинается пролёт и где заканчивается. Здесь дешевле всего менять решения. 1–2 дня.
Рендеры проекта, 3D-модель архитектора или съёмка с дрона. Если нужен подрядчик, называю его сумму и срок отдельной строкой до начала работы.
Макет для компьютера и телефона. Дизайн сайта застройщика — в его фирменном стиле, а не в стиле этого примера. Цифры, планировки и цены — из вашего прайса.
Отбор и сжатие кадров, привязка к прокрутке, отдельная раскладка для телефона, формы заявки и Метрика с целями. Несколько рабочих дней.
Вес и скорость на телефоне — цифрой в отчёте. Домен, доступы и исходники остаются у вас. 1 день.
Цены — из прайса сайта. Итог фиксируется в договоре до начала работы и дальше не растёт.
от 15 000 ₽
Лендинг на Tilda под один корпус, очередь или акцию, от 7 дней. На чистом коде — от 20 000 ₽.
от 27 000 ₽
Пролёт, как в этом примере, и полноценный лендинг вокруг него: лендинг 15 000 ₽ и видео по скроллу от 12 000 ₽ надбавкой. На чистом коде — от 32 000 ₽.
от 30 000 ₽
Многостраничный сайт на Tilda, от 21 дня. С админкой, шахматкой и обновлением из CRM — на чистом коде от 50 000 ₽.
Материал для сцены — рендеры проекта или съёмка с дрона — считается отдельной строкой, сумму называю до подписания договора. Если нужен свободный облёт дома мышью, а не пролёт по одной траектории, — это 3D-сцена, от 40 000 ₽. Видео по скроллу ставлю на сайт, который делаю сам, или на сайт, который у меня на продвижении либо сопровождении. Все цены
Лендинг — от 7 дней, пролёт добавляет несколько рабочих дней на кадры и привязку к прокрутке. Если рендеры готовы, это весь срок. Если нужен подрядчик на рендеры или съёмку с дрона, его срок называю до старта.
В этом примере 90 кадров весят 7,1 МБ — это самая тяжёлая сцена из шести примеров: камера летит, и меняется весь кадр. Первый кадр появляется сразу, остальные догружаются по ходу прокрутки. Для вашего проекта вес и время загрузки на телефоне называю цифрой до сдачи; если нужно легче — уменьшаю число кадров и готовлю отдельные кадры для телефона.
Да, эта демонстрационная страница собрана на Tilda в одном блоке с кодом: кадры загружены в Тильду, прокрутку считает небольшой скрипт. На сайте на чистом коде механика та же. Подписи и цены — обычный текст, их меняют без перерендера кадров.
Лучший вариант — рендеры или 3D-модель архитектора: они дают точный фасад и честные виды из окон. Если дом уже стоит, подойдёт съёмка с дрона. В этом примере комплекс вымышленный, поэтому кадры сгенерированы; настоящий дом так точно не повторить, для него нужен материал проекта.
Сцена — это картинки, текста в них нет. Всё, что должно находиться в поиске, стоит обычной вёрсткой: заголовки, описание комплекса, планировки, цены, вопросы. Лендинг под корпус чаще живёт на рекламе, а в поиске работает полный сайт застройщика, ссылки между ними ставлю сразу. Кадры не тормозят первый экран: страница открывается раньше, чем догружается пролёт.
Запустить лендинг без пролёта — на фотографиях площадки, визуализациях и планировках, от 15 000 ₽. Пролёт добавляется позже, когда появятся рендеры: место под сцену на странице закладываю сразу, переделывать лендинг не придётся.
Шесть примеров — шесть ниш и шесть разных дизайнов. Бренды вымышлены, так может выглядеть сайт вашего товара или вашего бренда: движение в каждом ведёт прокрутка.
Городской рюкзак открывается, вещи вылетают из отделений и возвращаются обратно.
Пример промо-сайта товараБеговой кроссовок раскладывается на подошву, пену, стельку и шнурки.
Лендинг кроссовокИнгредиенты по очереди ложатся друг на друга, сыр тает последним.
Дизайн сайта ресторанаЗолотая спираль жидкости застывает стеклянным флаконом духов.
Пример сайта брендаТурбокомпрессор разбирается по оси, выноски с оборотами и давлением идут за прокруткой.
Пример сайта с анимациейЧто такое видео по скроллу, откуда берутся кадры, сколько весит страница и сколько стоит — от 12 000 ₽ надбавкой к сайту.
Видео по скроллуПосчитаю лендинг для вашего комплекса. Пришлите, что есть: рендеры, планировки, прайс по квартирам. Отвечу, сколько кадров нужно для пролёта, какой формат сайта подойдёт и во что это обойдётся.
Смотрите также: Сайт для застройщика · Сайт агентства недвижимости · Лендинг под ключ · 3D-сайты
