HCC Service — преміум-СТО для топових авто у Черкасах
Лендинг · Custom HTML · 2025

HCC Service — преміум-СТО для топових авто у Черкасах

Лендинг автосервісу для авто середнього і преміум-класу: чіп-тюнінг, ремонт двигунів, турбін і екологічних систем. Слайдер-обкладинка, відгуки, заявка з 3 полями.

HCC Service (Himpas Coast Customs) — автосервіс для середнього і преміум-класу у Черкасах. Спеціалізація: чіп-тюнінг Stage1/Stage2, ремонт двигунів і турбін, екологічні системи (видалення EGR, DPF, AdBlue) і діагностика електроніки. Для запуску потрібен був односторінковий лендинг, який вкладе позиціонування, послуги, соц-доказ і кваліфікацію команди в один скрол і виведе ліда у коротку форму заявки.

Hero-обкладинка зі слайдером і брендованим лого-знаком

Hero — 6-слайдовий Slick-карусель з затемненим градієнт-фоном, на якому «пливе» гігантський каліграфічний watermark «НСС» у фірмових bg-blue тонах. Перший слайд несе ключове позиціонування (топовий сервіс для топових авто) і CTA-кнопку на форму, наступні фокусуються на чіп-тюнінгу, екологічних системах, команді і обладнанні. Стрілки і пагінатор слайдера зафіксовані під каруселлю; автопрогрес — slick.js 1.8.1.

Hero HCC Service з Porsche Panamera
Hero-слайд: Porsche Panamera, «НСС»-каліграфія на тлі, headline і CTA «Замовити дзвінок».

Команда і лічильники досвіду

Блок «Ми — команда експертів» збирає в одному екрані позиціонування для premium-сегменту і три ключові цифри: 3+ роки досвіду, 3300+ виконаних робіт, 97% задоволених клієнтів. Кожна цифра — окрема картка з підписом і ілюстрацією зі СТО (діагностика бортових систем, гальмівні супорти Brembo, сход-розвал). Праворуч — велике фото механіка у фірмовому джинсовому костюмі з вишивкою «НСС» на спині.

Команда HCC і лічильники
Лічильники запускаються інкрементом від 0 до цільового значення при scroll-in; костюм механіка з фірмовою вишивкою — частина візуальної ідентифікації бренду.

Сітка переваг із реальними робочими сценами

Секція «Чому обирають нас?» — 5 карток у асиметричній сітці: сучасне діагностичне обладнання (FLEX-сканер на ноутбуку), глибока спеціалізація на складних випадках (механік під капотом з фонариком), якісні запчастини і ПЗ (турбіна крупним планом у руках майстра), індивідуальний підхід (клієнтка з майстром у боксі), досвідчені фахівці і нестандартні задачі (іскри від болгарки). Усі фото — з власного СТО, без стоків.

Сітка переваг HCC Service
Дві великі картки задають горизонтальний ритм, три менші внизу закривають grid із збереженням ієрархії «перше враження → деталі».

Каталог послуг навколо рентген-силуету авто

«Наші послуги» — центральний x-ray-силует седана BMW 5-Series у блакитному світінні, а навколо нього розкидані 6 послуг-флажків з тонкими лініями-конекторами до агрегатів: чіп-тюнінг (з двигуна), ремонт двигунів і турбін, екологічні системи (з вихлопу), діагностика електроніки, сервісне обслуговування, рішення нестандартних задач. Композиція пояснює «хто ми і що ремонтуємо» без жодного скріншоту меню.

Каталог послуг навколо рентген-авто
Карта послуг візуально мапиться на агрегати авто — клієнт відразу бачить, що покривається сервісом.

Галерея — 3×3 grid із 8 реальних фото зі СТО (заміна супорта, шиномонтаж, форсунка-стенд Launch, очищення EGR, перевірка систем кондиціонера, ремонт ходової) і центральним медальйоном-логотипом «Himpas Coast Customs». Клік по фото відкриває Fancybox 3.5.7 з повноекранним переглядом. Композиція робить два корисні діла одночасно: показує реальні руки за роботою і вдруге нав’язує лого посеред основного контентного простору.

Галерея робіт HCC Service
Центральний медальйон у grid — оригінальний прийом, щоб лого бренду читалося не тільки у хедері, а в самому контентному ядрі.

Соц-доказ: 6 відгуків з оцінками

Відгуки — 3×2 grid у яскравих темно-блакитних картках, кожна несе одне ім’я (Віталій, Петро, Валерія, Луїза), п’ятизіркову оцінку і живий текст із конкретикою: Skoda Octavia A7 з відмовою кондиціонера, заміна клапанної кришки і прокладки вакуумного насосу, мастило Motul на розлив, ремонт авто VAG-групи. Тон — розмовний, без редактирування у «правильний українській» — і це працює на довіру швидше за стерильні відгуки.

Відгуки клієнтів HCC
Картки однакового розміру, відсутність аватарок не заважає — основна вага на тексті і п’ятизірковій оцінці.

Коротка форма заявки і Instagram-блок

Форма «Залиште заявку i ми вам передзвонимо» — 3 поля (ім’я, телефон, коментар) + CTA-кнопка. Праворуч — генеративне зображення седана з неоновими «схемами всередині» як натяк на чіп-тюнінг і діагностику. У сусідньому блоці контактів — графік роботи, адреса, телефони і фірмовий QR-код переходу в Instagram @hcc_service, який паралельно служить лід-каналом і вітриною свіжих робіт.

Форма заявки HCC
3 поля — компроміс між кваліфікацією ліда і трінням; коментар не обов’язковий, але часто дає корисні деталі від клієнта на дзвінок менеджера.

Стек

HTML5 + чистий CSS3 з кастомними змінними, jQuery 3.6.1 для всієї інтерактиви, Slick 1.8.1 (hero-карусель, відгуки, мобільна галерея), Fancybox 3.5.7 (lightbox у галереї), Google Maps JavaScript API (вбудована карта на адресу СТО), Google Fonts (Oswald + Russo One для заголовків, Open Sans для тексту). Без CMS — статичний HTML, який LiteSpeed-сервер віддає миттєво.

Готові обговорити реліз?

Відповідаємо протягом 60 хвилин у робочий час — з оцінкою бюджету, орієнтовним графіком і складом команди під вашу задачу.

Залишити запит