Односторінковий вебсайт компанії, що розробляє пілотовані підводні апарати, із динамічною симуляцією занурення під час скролінгу.
Основна задача: Технічна презентація послуг та характеристик підводних апаратів із залученням користувача через інтерактивний візуальний досвід занурення на глибину до 10 935 метрів.
Що реалізовано:
- Динамічна зміна кольору фону та ефекту віньєтування залежно від позиції скролу (симуляція тиску та освітлення).
- Генерація візуальних ефектів товщі води та часток у реальному часі за допомогою Canvas API.
Інтерактивний HUD-інтерфейс (Head-Up Display) із фіксованим лічильником поточної глибини.
- Адаптивна grid/flex-верстка інформаційних блоків (специфікації судна, наукові місії).
- Анімації поступової появи контенту (reveal) та безперервної прокрутки тексту (ticker).
- Кастомний лоадер екрану старту із прогрес-баром "підготовки до занурення".
Технології: HTML5, CSS3, Vanilla JavaScript, Canvas API
Основна задача: Технічна презентація послуг та характеристик підводних апаратів із залученням користувача через інтерактивний візуальний досвід занурення на глибину до 10 935 метрів.
Що реалізовано:
- Динамічна зміна кольору фону та ефекту віньєтування залежно від позиції скролу (симуляція тиску та освітлення).
- Генерація візуальних ефектів товщі води та часток у реальному часі за допомогою Canvas API.
Інтерактивний HUD-інтерфейс (Head-Up Display) із фіксованим лічильником поточної глибини.
- Адаптивна grid/flex-верстка інформаційних блоків (специфікації судна, наукові місії).
- Анімації поступової появи контенту (reveal) та безперервної прокрутки тексту (ticker).
- Кастомний лоадер екрану старту із прогрес-баром "підготовки до занурення".
Технології: HTML5, CSS3, Vanilla JavaScript, Canvas API