Алтайгражданпроект — старейший и крупнейший проектный институт Алтайского края. Ведет свою историю с 1938 года. Проекты самых известных зданий города, таких как Театр Драмы, Дворец Спорта, Гостиница Алтай, ТЦ Первомайский, и целые кварталы — Невский, Дружный, Лазурный, Квартал 2000, были созданы инженерами Алтайгражданпроекта.
К 75 летию организации были приурочены разработка нового фирменного стиля и сайта. Это наша очередная совместная работа с Дизайн студией ИД Алтапресс. Они взяли на себя дизайн, а Let’s Rock — производство. Проект получился по-настоящему инженерным, ниже описаны ключевые вехи строительства.
.png)
Крутятся диски, кубики вращаются
Один из самых объемных блоков работ — реализация нами анимации на главной странице. Объекты сменяют друг друга подобно вращающимся кубикам. Эта идея появилась неспроста — аналогичный стенд (физический) стоит на входе в институт. Задача была усложнена тем, что у главной страницы есть два слоя: в каждом слое объекты могут занимать 1, 2, 4, 6 условных «элементарных частиц» — самых мелких кубиков, переходя из слоя в слой два двойных элемента могут превращаться в один четверной, менять границы — в общем трехмерное Лего в чистом виде.
Несмотря на сложность скриптов сайт успешно масштабируется под разные разрешения, корректно отображается в современных браузерах и мобильных в том числе. Пользователи IE увидят облегченную версию:-)
Портфолио
Попасть на страницу желанного объекта можно тремя способами:
– с главной страницы, тыкнув по понравившемуся кубику;
– из меню Портфолио, в котором можно просмотреть все объекты без блуждания по категориям;
– из поиска, работающего по методу autocomplete.
Каждый объект может содержать 3, 5, 7, 9 фото в главном слайдере. От этого зависит дизайн страницы — анонсы выстраиваются по предусмотренным схемам для разного количества. Все это происходит автоматически — администратору не надо долго думать, просто загружает столько фото сколько есть. Подгонять по размерам также не надо: все картинки масштабируются без потери качества скриптами сайта.
По клику на значок «Информация» выезжает текстовое описание — слайдер с анонсами перестраивается в соответствии с нужным дизайном, чтобы освободить место.
.png)
Кубики, вакансии и история
Текстовые страницы реализованы без потери общей геометричности проекта: справа находится управляемый слайдер, слева — кубики-анонсы, управляющие им. На странице История изображениями управляет еще и текст — по мере прокрутки текста сменяются и обрамляющие его картинки.
.png)
Обязательно зайдите на www.agp22.ru — необычный сайт компании, внесшей значительный вклад в облик города.
Источник: blog.letsrock.pro