Головний hero-екран
Заміський відпочинок
Сайт заміського гостьового об’єкта з акцентом на атмосферу, презентацію будинків і прямий контакт для бронювання.
РольProduct Designer & Fullstack Developer
ТипСайт для будинків відпочинку
ЛокаціяУкраїна
ФокусСтворити спокійний, зрозумілий шлях користувача, який веде від перегляду об’єкта до прямого контакту.
СтекNext.js, TypeScript, CSS Modules
Тривалість3 тижні (1 тиждень дизайн, 2 тижні розробка)
Коротко про проєкт
- Тип проєкту
- Сайт для будинків відпочинку
- Ціль
- Показати будинки, умови, галерею і контактні опції для заміського об’єкта відпочинку.
- Ключові функції
- Список будинків
- Детальні сторінки будинків
- Галерея
- Контактні CTA
- SEO-готова структура
- Моя роль
- Frontend-реалізація, контентна структура, адаптивний UI, базове SEO і підтримка запуску.
- Стек
- Next.js
- React
- TypeScript
- CSS Modules
- Результат
- Готовий до запуску сайт для будинків відпочинку зі структурованими сторінками, чіткою мобільною навігацією і контактом, орієнтованим на бронювання.
Проблема
Клієнт мав застарілий сайт, який не передавав рівень об’єкта й не давав простого шляху до контакту.
Рішення
Я створив сайт із фокусом на атмосферу та чітку структуру. Контент підводить користувача до ключової інформації, а шлях бронювання побудований через прямий дзвінок без зайвих кроків.
Ефект
Новий сайт покращив презентацію об’єкта і спростив для гостей перехід до контакту та бронювання.
Що я зробив
- Спроєктував повний UI/UX з нуля
- Реалізував повністю адаптивні екрани
- Побудував структуру карток і сторінок будинків
- Реалізував прямий шлях бронювання через дзвінок
- Оформив галерею та візуальний контент
- Зібрав контактний блок із картою та контекстом локації
Hero
Головний візуал із атмосферою об’єкта та CTA до дзвінка.
Адаптивність
Як головна сторінка адаптується між десктопом і мобільним.
Десктопний вигляд
Мобільний вигляд
Концепція
Блок, який пояснює ідею місця та позиціонування об’єкта.
Блок про концепцію і атмосферу
Огляд будинків
Попередній перегляд варіантів проживання з переходом на детальні сторінки.
Картки будинків
Галерея
Фотогалерея, що показує об’єкт, будинки та оточення.
Фотогалерея
CTA-секція
Фінальний блок, який переводить від перегляду до прямої дії.
Фінальний CTA-блок
Контакт і локація
Контактні дані, номер телефону, карта і контекст місця.
Контактний блок
Деталі будинку
Сторінка будинку з фото, характеристиками, ціною та дією.
Детальна сторінка будинку
Потрібен сайт, який спрощує контакт із клієнтами?
Підготую зрозумілий сайт із простим шляхом до заявки, бронювання або розмови.