Концепт 1
«Держава, якій довіряєш»
Світлий, чистий, багато повітря. Дух Дії та gov.uk: доступність, впевненість, без «магазинного» вигляду. Найбезпечніший вибір для держпідприємства.
#0057B7
#F2A900
#1E8E5A
#F7F8FA
#1C1F26
#0057B7 · #F2A900 · #1E8E5A · #F7F8FA · #1C1F26
ШрифтиGolos Text + InterТемасвітлаАнімаціїстримані, елегантні
- Hero з відео та заголовком, що проявляється через градієнт
- Плитки «швидких дій» напрямів, як у Дії
- Блок довіри: лічильники фактів + бейдж ISO 9001
- Бічний drawer заявки з прогрес-баром
- Банер найближчого семінару, таби фінзвітності по роках
- Пошук Ctrl+K, FAQ-акордеон, карусель партнерів
Підходить, якщо головне — довіра, зрозумілість і «державний» вигляд без ризику.
Відкрити концепт 1 →
Концепт 2
«Темний техно-корпоративний»
Преміальна темна тема, скло та глибина. Серйозна інженерна інституція рівня TÜV/DEKRA з сучасним IT-обличчям. Є перемикач світла/темна.
#0B0E14
#3D8BFF
#FFB020
#E7EAF0
#8B93A7
#0B0E14 · #3D8BFF · #FFB020 · #E7EAF0 · #8B93A7
ШрифтиManrope + OnestТематемна (+ світла)АнімаціїGSAP, Lenis, насичені
- Живий mesh-градієнт і відео у glass-рамці з підсвіткою
- Bento-grid напрямів з 3D-tilt на hover
- Magnetic-кнопка «Подати заявку», glass-модалки
- Pin-секція «як проходить навчання» з горизонтальним скролом
- Command palette Ctrl+K з клавіатурною навігацією
- Marquee партнерів, lightbox, toast-система
Підходить, якщо хочеться «дорого і технологічно» та виділитись серед держсайтів.
Відкрити концепт 2 →
Концепт 3
«Сміливий editorial»
Журнальна подача: теплий «папір», великий шрифт, сигнальний оранж каски. Найбільш іммерсивний і незвичний, але тема лишається серйозною.
#FAF6EF
#FF4B1F
#0E1A2B
#141414
#D9D2C5
#FAF6EF · #FF4B1F · #0E1A2B · #141414 · #D9D2C5
ШрифтиUnbounded + Montserrat Alternates + ManropeТемасвітла з темними секціямиАнімаціїкінетичні, максимум
- Кінетичний hero-заголовок, що збирається посимвольно
- Кастомний курсор-лінза на desktop
- Горизонтальна стрічка новин на pin-скролі
- Напрями як нумерований editorial-список 01–05
- Факти гігантською типографікою, marquee між секціями
- Full-screen меню з фото-превʼю, плаваюча CTA → drawer заявки
Підходить, якщо треба справді вразити на презентації. Для щоденних B2B-заявок — менш звичний.
Відкрити концепт 3 →
Концепт 4
«Еволюція нинішньої гами»
Той самий впізнаваний синій ГНМЦ і структура старої головної, але переосмислені по-сучасному. «Це той самий центр, тільки 2026 року».
#0072DD
#005AC8
#FFD500
#ED1C24
#EDEDED
#0072DD · #005AC8 · #FFD500 · #ED1C24 · #EDEDED
ШрифтиManrope + InterТемасвітла, синяАнімаціїпомірні, з «вау» на головній
- Hero-відео з синім градієнтом і заголовком по словах
- Синє меню, що при скролі стає компактним glass-хедером
- Плитки напрямів з заливкою синім градієнтом на hover
- Синя смуга ISO з паралакс-фоном і бейджем
- Лічильники статистики, marquee партнерів
- Синій мобільний drawer, жовта лінія прогресу читання новини
Підходить, якщо важливо зберегти впізнаваність і не лякати аудиторію різкою зміною.
Відкрити концепт 4 →
Концепт 5
«Промбезпека»
Сайт виглядає як сама тема охорони праці: сигнальна hazard-графіка, каска-оранж, графіт, інженерна точність креслення. Преміально, без «стройсайту».
#FFC400 · #1A1D21 · #FF6A00 · #F1F2F4 · #00A651
ШрифтиIBM Plex Sans + IBM Plex MonoТемасвітла з графітовими секціямиАнімаціїтехнічні, «креслення малюється»
- Жовто-чорна hazard-стрічка, що рухається в hero, заголовок-«штамп»
- Blueprint-сітка і лінії, що малюються на скролі; line-drawing іконок
- Факти як табло з моношрифтом, картки-таблички з кутовими маркерами
- «Як пройти навчання» — чек-лист з галочками, що ставляться при скролі
- Заявка як «наряд-допуск»: бланк зі штампом «ПРИЙНЯТО»
- Піктограми у стилі ISO 7010, hazard-прогрес скролу в хедері
Підходить, якщо хочеться максимально тематичний і запамʼятовуваний образ «центру з охорони праці».
Відкрити концепт 5 →
Концепт 6
«Освітня платформа»
Не візитка установи, а продукт як Prometheus/Coursera: підприємство за 3 кліки знаходить програму, бачить дати, рахує вартість і подає заявку. Фокус на B2B-конверсію.
#4F46E5 · #14B8A6 · #F97316 · #FAFAFC · #111827
ШрифтиOnest + InterТемасвітла, пастельнаАнімаціїпродуктові, дружні
- Hero з пошуком «Яке навчання шукаєте?» і чіпами-підказками
- Каталог програм з фільтрами (формат, тривалість, для кого, дата)
- Інтерактивний календар семінарів 2026 з реєстрацією по кліку
- Калькулятор вартості: слайдер співробітників → анімована сума
- Мок «Кабінету підприємства»: заявки, рахунки, сертифікати
- Bottom-sheet меню на телефоні, конфеті при відправці заявки
Підходить, якщо головна мета сайту — заявки від юросіб і зручний онлайн-запис, а не представницька функція.
Відкрити концепт 6 →
Усі концепти — прототипи: форми не відправляють дані, файли документів ведуть на нинішній сайт. Після вибору концепт розкатується у повноцінний сайт з адмінкою. Поточний сайт: gnmc.kiev.ua.
