Одностраничный вебсайт компании, разрабатывающей пилотируемые подводные аппараты, с динамической симуляцией погружения во время скроллинга.
Основная задача: Техническая презентация услуг и характеристик подводных аппаратов с привлечением пользователя через интерактивный визуальный опыт погружения на глубину до 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