Сайт з оренди елітної нерухомості в ОАЕ
Про проект
Компанія Profi Make займається здаванням вілл в оренду на острові Пальма Джумейра в ОАЕ.
Історія компанії налічує ні багато ні мало 12 років, і звичайно, за цей час вона встигла обзавестися корпоративним сайтом. Однак згодом клієнт вирішив просувати свої послуги під новим брендом і створити ще один сайт. Так компанія Profi Make і зустріла команду Webnauts.
Про те, що вийшло з нашої співпраці, читайте в нашому кейсі.
Завдання
Компанія Profi Makе представлена на різних онлайн-сервісах бронювання житла, зокрема Booking.com і Airbnb. Але основний майданчик – це корпоративний сайт, який приваблює клієнтів за допомогою контекстної реклами.
Так перед нами постало завдання — розробити для компанії такий сайт, який би повністю відповідав її діяльності: з привабливим дизайном і грамотною подачею контенту. Тобто зробити так, щоб усі сторінки сайту були не просто переконливими, а зазнаки підкреслювали багатий досвід компанії в сфері елітної нерухомості.
Технологічне рішення
Для розробки сайту Profi Makе ми використали конструктор на CMS «Бітрікс24». Рішення було обґрунтоване тим, що клієнт уже використовував «Бітрікс24» як CRM, і створення сайту всередині цієї ж CRM була дуже доречною.
Чим же такий гарний Бітрікс24? Це зручний конструктор, який дозволяє:
- спроєктувати дизайн із готових блоків і елементів;
- створювати додаткові вебсторінки;
- оптимізувати сайт для просування;
- отримувати докладну статистику;
- збирати контакти клієнтів за допомогою вбудованих CRM-форм;
- інтегрувати сайт із платіжними та іншими зовнішніми сервісами.
Крім того, швидкість і вартість розробки сайту на Бітрікс24 просто не може не тішити.
Дизайн і навігація сайту
Як ми і замислювали, дизайн сайту вийшов мінімалістичним, акуратним і елегантним, як і належить проєкту з оренди елітних вілл. Колірна гама стримана та складається з 3-х кольорів:
- білий — основний колір вебсторінок фону. Він надає сайту витонченості та повітряної легкості;
- пісочний — додатковий теплий колір із прямим відсиланням до пустельних дубайських пейзажів;
- чорний — акцентний колір для основного тексту, шапки та підвалу сайту. Асоціюється з професіоналізмом, зрілістю та дозволяє зосередитися на важливому.
Структура головної сторінки
У шапку сайту ми помістили всього 3 елементи: логотип і два контакти у вигляді телефонного номера та посилання на Instagram-акаунт.
На головному екрані також красується фото дубайського горизонту, лаконічний слоган і локація. Всі вони влучно та лаконічно транслюють діяльність компанії:
Анімований рop-up у нижній правій частині екрану ненав’язливо нагадує про можливість написати консультанту, а клік на нього миттєво викликає вікно чату:
До речі, всі повідомлення, надіслані з сайту, миттєво падають у звичну для нашого клієнта CRM-систему «Бітрікс24» для їхньої подальшої та оперативної обробки.
Каталог
Найперший сайт компанії мав каталог із суцільною блоковою структурою та 2-ма фільтрами пошуку: локація (непотрібний пункт із огляду на те, що варіант всього один) і кількість кімнат. У такому каталозі була відсутня логіка, візуальна привабливість і зручність сприйняття.
На цей раз при розробці каталогу ми зовсім відмовилися від панелі навігації та відразу структурували вілли за кількістю кімнат. Це основний параметр під час пошуку апартаментів, від якого часто залежить і вартість оренди. Розділи каталогу ми представили у вигляді кругового слайдера:
Опис локації
Як уже згадувалося раніше, всі вілли мають єдину та неповторну локацію – Пальма Джумейра на березі Дубая. За лаконічний опис острова з натхненням взялися копірайтери, проілюструвавши їх мальовничими фотографіями. Під опис локації ми виділили окремий екран:
Про нас
Це не просто блок сайту, а дзеркало бренду. В ньому відбивається історія, діяльність і досвід компанії. Йому під силу сформувати імідж, що заслуговує на довіру клієнтів, з поправкою на грамотний текст. Як ви здогадалися, тут теж не обійшлося без вправної думки копірайтера. В результаті історія про засновника та команду Profi Make вийшла простою, діловою та стриманою:
FAQ
Блок часто задаваних питань буває часто недооцінений. Так, цей розділ був відсутній і в попередньому проєкті нашого клієнта. Дуже дарма, адже насправді він є обов’язковим для сайтів, що пропонують складні послуги. А Profi Make — один із таких.
Наші копірайтери доступно, конкретно та лаконічно сформулювали відповіді на найчастіші запитання клієнтів, і тепер розділ FAQ повністю відповідає своїм завданням — наближає клієнта до цільової дії, закриває заперечення, знижує завантаження консультантів і дозволяє досягти підвищення юзабіліті сайту в майбутньому.
Даний блок ми реалізували у вигляді списку, що розкривається, з ефектом наведення:
Сторінки з описом вілл
Як і весь сайт, вони виконані в найкращих традиціях мінімалізму: фотокартка, основні характеристики в інфографіці та кнопка, що викликає вікно з формою заявки. Нижче — галерея фотографій, опис і детальна характеристика апартаментів.
І поки копірайтери писали надихаючі тексти, наш розробник теж дещо написав — кастомний js-скрипт, що дозволяє відкривати сторінку вілли при натисканні на її картку (а не на посилання):
Конверсійним вінцем оформлення сторінки виступає лаконічна форма зворотного зв’язку. Далі зупинимося на ній докладніше.
Форма зворотнього зв’язку
Представлена в статичному вигляді наприкінці головної сторінки сайту та окремих сторінок з описом вілл. Такий тип форми простий і ненав’язливий, до того ж ліміт на один динамічний елемент у вигляді спливного вікна ми вже вичерпали.
Крім обов’язкових полів для імені та контактного номера форма передбачає додаткові поля для дат бронювання вілли. Але навіть не дивлячись на це, віконце вийшло зрозумілим і лаконічним:
Адаптивність сайту
Всі блоки та елементи Бітрікс-платформи повністю адаптивні, а це означає, що сайт ідеально підлаштовується під різні роздільні здатності екранів та однаково зручний з усіх мобільних пристроїв — від підбору до бронювання апартаментів:
Анімації
Бітрікс-платформа надає широкі можливості для анімації без застосування сторонніх бібліотек. У цьому проєкті ми зробили ставку на прості ефекти появи та віддалення, підйому та зсуву елементів у центр екрану, зміни кольору при наведенні курсору (на кнопки, посилання, пункти списку та фото вілл), а також пульсуюча кнопка онлайн-чату.
Підсумки
У зв’язці розробників і копірайтерів нам вдалося створити зручний мінімалістичний сайт із продуманою структурою, надихаючими текстами та ненав’язливими анімаційними ефектами. Акуратний, переконливий і солідний сайт якнайкраще відображає діяльність компанії з оренди елітної нерухомості.
