Разработка корпоративного сайта научной организации

Старт работы - февраль 2018

Проблема:
- устаревший сайт с неудобной навигацией и юзабилити

Задачи

Реализация

1. обновить дизайн сайта, сделать его современным, стильным, понятным;
2. обновить функционал сайта – добавить внутреннюю часть для сотрудников, сделать привязку сотрудников к институтам, добавить фильтры в новости (их просто очень много),
3. сделать понятную навигацию. Сайт большой, поэтому нужно все было уместить, сделать интуитивно понятный интерфейс и при этом учесть требования к федеральным бюджет учреждениям.

1. Для управления сайтом выбрали CMS 1С Битрикс. Это было пожелание Клиента и, в целом, это вполне обоснованный выбор для государственной организации. Система русская, поэтому вопросов в будущем к используемому ПО быть не должно.

2. Приступили к работе над макетами. Основная сложность – это долгий процесс согласования. Очень много руководителей, которые хотят, чтобы их мнение учитывалось.

При проектировании макетов нужно было учесть, что это большая научная и государственная организация, поэтому будет очень много вкладок. Вопрос с реализацией меню встал очень остро: мы перепробовали множество вариантов. В итоге остановились на двух меню. При чем раскрывающееся меню включало в себя еще и выпадающие списки. Был даже вариант с большим меню на весь экран, но в силу особенностей целевой аудитории пришлось делать что-то более привычное.

Необходимо было учесть, что ФИЦ – это организация, где проходят регулярные мероприятия, поэтому нужно было наглядно оформить новости.
Также на главной странице нужно было выделить место под все научные подразделения. Сделали это аккуратными плитками с использованием иконок, которые мы отрисовывали в рамках работы над фирменным стилем. Кроме иконок институтов для документов мы тоже подготовили иконки. По ним можно понять, какой документ подгружен и его объем.

Также необходимо было учесть, что ФИЦ ведет научную деятельность и у них есть научные публикации, а также мероприятия.
Согласование главной страницы сайта заняло довольно много времени, так нужно было учесть все нюансы. Но уже на этом этапе мы предусмотрели аккуратные тени у блоков, небольшие закругления, эффекты при наведении, а также стильно оформили пагинацию для разных блоков.

Шрифт на сайте Rubik. Он довольно приятный и легко воспринимается глазом. Плюс есть разные виды начертания – можно себя не сдерживать.
Далее самым трудоемким было сделать страницы Институтов. Во-первых, нужно было предложить единую структуру, чтобы можно было легко наполнять и никого не выделять. Во-вторых, нужно было вместить все важную информацию. В-третьих, каждый институт имеет свои особенности – надо было это отразить. Мы решили сделать на каждой странице параллакс с элементами, которые олицетворяют каждый Институт. Для Горного – это камни, для Экологии – ягоды Севера. Получилось довольно эффектно.

Отдельная история была связана с Новостями. Их много, они от разных подразделений, у них разный объем. Предложили аккуратные карточки с возможностью добавлять/убирать фотографии. Предусмотрели большой фильтр.

Еще одна страница, которую стоит отметить – это контакты. Тут надо было компактно собрать все ключевые контакты ФИЦ. А их ого-го как много. Тут использовали аккордеон – он позволяет собирать информацию в удобный формат.

ФИЦ КНЦ РАН - это крупнейший научный центр за полярным кругом. Сегодня в его структуре 7 институтов и 4 Центра. У Центра богатая история, которая началась еще во времена освоения Севера. Сегодня ФИЦ тоже старается идти в ногу со временем, поэтому обновление фирменного стиля и сайта были закономерными процессами.

Цель

Обновление сайта учреждения

Большое внимание на этом проекте мы уделили деталям. Например, пагинации. Она очень стильная, аккуратная в стилистике сайта

Еще одним тонким моментом стали карточки сотрудников. Тут мы тоже повозились. Нужно было сделать их красивыми, удобными и функциональными. Нельзя было просто написать должность и телефон. У некоторых сотрудников множество регалий – их тоже нужно указывать. Карточка должна была быть универсальной и вставать одинаково хорошо на любой странице сайта. С карточки должна быть возможность перейти на полноценное описание сотрудника. Для сотрудников без фотографии нужно было предусмотреть заглушку.

В целом, дизайн получился очень легким, приятным, с очень пристальным вниманием к деталям. Даже сейчас этот дизайн выглядит современно

3. Интеграция верстки и проработка функционала. В целом интеграция на Битрикс проходила штатно. Но с некоторыми вещами пришлось повозиться. При этом пожелания Клиента были – не сильно менять логику Битрикса. В процессе работы активно использовались инфоблоки – главная сущность этого движка.
Из сложного функционала можно выделить поиск по новостям, поиск по сотрудникам, организация доступа в личный кабинет для сотрудников.

4. Перенос контента. Вместе с Клиентом мы переносили информацию. Этот процесс тоже оказался продолжительным по времени, так как информации очень-очень много. Нужно было аккуратно все перенести, отметить где и чего не хватает, проверить корректность отображения.

Примеры оформления страниц