Комплекс защитных сооружений

Сайт государственной организации ФКП «Дирекция КЗС г. Санкт-Петербурга Минстроя России». Жители города традиционно называют этот комплекс дамбой, хотя на самом деле в его систему входит 11 защитных дамб, а также многочисленные водо- и судопропускные сооружения, скоростная автодорога и автотранспортный тоннель.

дизайн, вёрстка и программирование проекта

1 место в  конкурсе «Золотой сайт» 2015 г. в номинации «Государственные органы, власть»

Заказать сайт
Комплекс защитных
сооружений
Санкт-Петербург

Комплекс защитных сооружений Санкт-Петербурга от наводнений жители города традиционно называют дамбой, хотя на самом деле в систему комплекса входит 11 защитных дамб, 6 водопропускных сооружений,
2 судопропускных сооружения, автомагистраль с 3 развязками и 7 мостами,
а также автомобильный тоннель.

01 задачи проекта
Официальная

Государственному предприятию необходимо иметь презентационный сайт, содержащий данные о компании, бухгалтерскую отчётность, контактную информацию.

Образовательная

За годы строительства и эксплуатации дамбы накопился большой объём информации, которая может быть интересна петербуржцам и гостям города. На сайте необходимо представить эти данные в простом и понятном пользователям виде.

Гидрощит
Санкт-Петербурга
Спутниковая карта
с динамическими
точками
Судопропускное сооружение С-1

Является частью северного морского канала. Предназначен для пропуска судов класса «река-море» с осадкой до 5,3 м.

Является частью северного морского канала. Выполняет вспомогательную роль по отношению к главному корабельному фарватеру. Предназначен для пропуска судов класса «река-море» с осадкой до 5,3 м. Сооружение оснащено подъёмным мостом и плоским подъёмно-опускным защитным затвором.

c1 c2
Реакция на
наведение
и нажатие
Изменение
масштаба
02 внимание к дизайну

Этот проект — яркий пример того, что сайт государственной организации не обязательно должен быть сухим и скучным с точки зрения как визуального оформления, так и контента.

Меню

Чёткая проработка меню и продуманная анимация исключают случайное нажатие и демонстрируют прекрасную реакцию при наведении на пункты меню.

Иконки

Разработан набор индивидуальных иконок для быстрой навигации по сайту.

Цвета

Подобрана основная холодная цветовая гамма и дополнительная группа цветов для расстановки акцентов и выделений.

#044379
#00abc9
#16c872
#d80400
03 отрисованные страницы
16
уникальных
страниц
3
промо
страницы
Промостраницы
Изюминкой сайта стала интерактивная схема комплекса защитных сооружений на главной странице, а также разработанные нами промостраницы.

Обзорная карта комплекса — это не просто вид на дамбу с высоты птичьего полёта. Это настоящая мини-экскурсия для посетителей сайта. Благодаря интерактивным элементам вы можете увидеть расположение основных частей комплекса, их фотографии и краткую информацию о дамбах, водо- и судопропускных сооружениях, скоростной автодороге и автомобильном тоннеле.
История наводнений
Это могли бы быть несколько абзацев скупого текста, но вместо них вы видите атмосферную страницу с эффектами параллакса и анимации.
В каком-то смысле эту страницу можно назвать метафоричной: переходя от даты к дате, вы все глубже погружаетесь под воду, как некогда и жители Петербурга, испытавшие на себе все ужасы наводнений.
История строительства
Историческая сводка об основных вехах строительства комплекса представлена в
чёрно-белых тонах. На этой странице также присутствуют анимационные эффекты: перемещаются элементы, «бегут» годы. Фотографии времён СССР были предоставлены заказчиком и обработаны нашим дизайнером. Продуманы и эффекты параллакса при прокрутке страницы.
Экология
Этот раздел сайта рассказывает о политике предприятия в области поддержания благоприятной экологической обстановки в акватории Невской губы и Балтийского моря. При подготовке дизайна мы сфокусировались на ярких чистых цветах, большом количестве воздуха. Схемы очистных сооружений и фотографии птиц и рыб подбирались дизайнером специально для этой страницы. Со своей стороны заказчик предоставил изображение с закатом и видом на залив.
04 мобильная ориентация
Корректное отображение проекта на различных устройствах

Инга Таирова
Менеджер проектов
Этот проект — яркий пример того, что сайт государственной организации не обязательно должен быть сухим и скучным с точки зрения как визуального оформления, так и контента. Мы рады, что нам удалось найти общий язык с заказчиком и сделать действительно достойный, интересный и очень выразительный сайт.

Закажите сайт прямо сейчас!
Нажимая на кнопку «Отправить», Вы даете согласие на обработку своих персональных данных и принимаете условия Политики конфиденциальности