Как мы разработали сайт для таун-парка под Ижевском за 40 часов

«Федерация» — застройщик, который с 2017 года строит недвижимость эконом- и комфорт-класса в Ижевске, Удмуртской Республике и в Перми.

Недавно «Федерация» начала строительство нового объекта — таун-парка «Спасский» под Ижевском. Проект находится в непосредственной близости к городу, но при этом окружен природой. Таун-парк представляет из себя комплекс из 32 малоэтажных домов со спортивными комплексами, детскими площадками и зелеными зонами.

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

Среди интересов целевой аудитории мы выделили два основных:

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

В III квартале 2024 года во второй очереди проекта застройщик планировал старт продаж домов, и для этого нужен был лендинг.

На момент старта работы над лендингом у клиента еще не были готовы рендеры
и УТП таун-парка. При проектировании прототипа сайта мы работали с рыбой-текстом и черновыми изображениями.

Чтобы начать разработку, мы вместе с клиентом заполнили бриф.

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

Клиент также предоставил нам для работы презентацию и брендбук проекта.

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

На основе мудборда и брендбука также в Figma мы разработали 3 дизайн-концепции будущего сайта, чтобы клиент смог выбрать наиболее понравившийся вариант.

Клиент выбрал третью концепцию. Остальные разделы сайта мы разрабатывали, основываясь на ней.

Чтобы сделать сайт удобным для пользователей, необходимо понимать путь пользователя — то, что он будет делать на сайте с момента захода и до совершения целевого действия.

Для этого мы составили CJM (customer journey map) — карту, которая позволяет заранее продумать сценарий действий пользователя на сайте. Она помогает правильно построить лендинг и добиться высокой конверсии в рекламных кампаниях.

Мы решили использовать классическую структуру для сайта, который предназначен для продажи жилых объектов.

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

Поэтому мы сначала прогрели аудиторию блоками о проекте, его основных преимуществах, инфраструктуре и расположении, далее показали планировки и Call-to-action.

Вот такая структура у нас получилась:

1. О проекте
2. Преимущества
3. Инфраструктура
4. Расположение
5. Планировки
6. Способы покупки
7. Архитектура и инженерия
8. О застройщике

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

Прототип необходим каждому сайту, так как на нем можно увидеть и исправить все недочеты на этапе «черновика».

Мы подготовили детализированный дизайн и адаптировали его под десктопную и мобильную версии за 8 часов. Мы использовали стиль неоминимал — это сочетание минимализма, простых форм и бенто-элементов. Бэнто-элементы — это квадратные или прямоугольные блоки на сайте, которые структурируют информацию и создают интуитивно понятный интерфейс для пользователей.

Завершающим этапом стала верстка лендинга на платформе Tilda, его анимация и базовая SEO-оптимизация. На все работы у нас ушло 16 часов.

Большую часть анимации на сайте мы реализовали с помощью Step-by-step анимации в Tilda. А эффект набегания чисел в блоке «о застройщике» мы сделали вручную с помощью html, так как в Tilda такой функции нет.

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

В июле 2024 года клиент запустил рекламу с ссылкой на лендинг.