01Бенто-
сітка
сітка
Бенто-сітка
Сторінка розкладена на картки, кожна — одна думка: послуга, фото, переваги, кнопка. Людина бачить усе одразу й читає лише потрібне.
Живий сайт — гортайте просто тут
Кейс · 2026 · редизайн і стиль з нуля
Customs Logistics Group
Новий сайт і весь стиль логістичної компанії з нуля, а потім реклама, розсилка й презентація в тому ж стилі.
Один стиль.
Чотири канали.
Почали з нуля: шаблон, суцільний текст і біла презентація
Стилю не було: шаблонний конструктор, полотна тексту, біла презентація. Я перебудувала структуру й придумала стиль для всіх каналів.
Сайт із телефона
Клікабельний прототип
СтруктураСуцільний текст розібраний на блоки, кроки, картки й питання
СтильБірюза й золото, шрифти, власні 3D-ілюстрації
РухПроцес перевезення — в анімаціях
01
Стиль з нуля
Подано так само, як послуги на сайті CLG: наведіть на карткунатисніть на картку — вона розкриється.
02Кольори
Петрольфон реклами
#001D1C Бірюзаголовний
#347C7D Сірийфон сайту
#E4E4E4 Жовтийкнопки
#FCC55E Золотореклама
#001D1C Бірюзаголовний
#347C7D Сірийфон сайту
#E4E4E4 Жовтийкнопки
#FCC55E Золотореклама
Кольори
Сайт на спокійному сірому, бірюза — головний колір, жовтий — лише для дій. Петроль і золото — для реклами й презентації, де потрібна глибина й преміальність.
03Шрифти
Шрифти
- Bebas Neue — заголовки. Вузький і високий: у рядок влазить «Морські контейнерні перевезення», і читається з першого погляду.
- Arial — текст. Спокійний і звичний, уже є в кожному пристрої — сторінка не чекає на завантаження шрифту.
- Разом. Виразний заголовок і нейтральний текст не сперечаються: акцент там, де треба.
04Фото з нейромережі
Фото з нейромережі
Замість стокових фото, які є в кожного конкурента, — яскраві кадри з нейромережі: бірюзовий літак, вантажівка, контейнеровоз, чисте небо. Вони тримають атмосферу й збігаються з кольорами бренду.
05Швидкість
1,4 сдо першого контенту на телефоні
Швидкість
- 0,9 сголовний блок на компʼютері
- 1,5 МБвага головної з 3D й анімаціями
- 97доступність
- 100SEO
Google Lighthouse, головна сторінка. Продуктивність: 81–86 на телефоні, 88 на компʼютері.
02
Сайт
Сайт
замість
шаблону
Задача — сайт, який продає послуги бізнесу. Я перебудувала структуру: кожна послуга отримала свою сторінку, текст — кроки, картки й відповіді на питання, а головне виділено так, щоб його було видно з першого погляду.
Рух, який пояснює
без слів
На сайті CLG анімація — не прикраса: контейнер, літак і вантажівка розповідають про доставку ще до того, як людина прочитала текст. І все це — без втрати швидкості.
Подивитися на сайтіЩо ще під капотом
Без абонплати
Власний код на Vercel: компанія не платить щомісяця за конструктор.
UA / EN
Англійська версія всіх сторінок і перемикач мови. Google знає, яка сторінка якою мовою.
Заявки на пошту
Форма відправляє заявку просто на пошту компанії, без посередників.
SEO
Розмітка компанії й послуг для Google, FAQ-розмітка, карта сайту, превʼю посилань у месенджерах.
Пошук нейромережами
Файл llms.txt — довідка про компанію для ChatGPT
і Perplexity, щоб вони відповідали про CLG правильно.
Дрібниці, які видно
Політика конфіденційності й умови використання. Прийменники не висять у кінці рядка.
03
Креативи для таргету
17 / 33
33 сторіс для реклами — теж з нуля. Яскраві, щоб зупинити палець у стрічці: біль у заголовку, вигода й кнопка дії. І в тому ж стилі, що й сайт: після кліку людина одразу впізнає компанію.
Email-розсилка
Вісім листів — по одному на послугу. Усі зібрані за однією схемою: шапка з логотипом, привітання, картка з 3D-ілюстрацією, ціни й кнопка — тож лист CLG впізнають ще до того, як прочитали тему.
04
- 01
Швидше за море. Дешевше за авіа
- 02
Доставка «під ключ»
- 03
Авіадоставка через Варшаву
- 04
Збірні вантажі з Азії та США
- 05
Перевезення без ризиків
- 06
Морські контейнери з Китаю
- 07
Митне оформлення по всій Україні
- 08
Морські LCL-перевезення
05
Презентація
для продажів
Замість білого шаблону — десять слайдів у стилі сайту: та сама бірюза, 3D і нейрофото.
Наведіть на презентацію й гортайте внизГортайте презентацію вниз
06
Що отримала компанія
- 1
Сайт
Новий дизайн і структура замість шаблону: бенто-картки, 3D, анімації, дві мови. Головна відкривається за 1,4 с.
- 2
Креативи для соцмереж
33 сторіс для таргету: біль у заголовку, вигода, кнопка — і той самий стиль, що на сайті.
- 3
Email-розсилка
Вісім листів за однією схемою — по одному на кожну послугу, з цінами й кнопкою.
- 4
Презентація
Десять слайдів замість білого шаблону: компанія, послуги й контакти в одному стилі з сайтом.
Потрібна така ж система?
Сайт, рекламу, розсилку й презентацію роблю в одному стилі — для бізнесу, якому треба продавати послугу, а не просто мати сайт.