Сайт Николаевского областного краеведческого музея
Это как раз тот случай, когда радует само название проекта, которое говорит о невероятной стойкости украинской культуры перед лицом войны. С чувством невыразимой гордости к жителям прифронтового Николаева представляем новый сайт одного из крупнейших областных краеведческих музеев Украины.
Расположенный на территории памятника архитектуры национального значения «Старофлотские казармы», музей неоднократно подвергался ракетному террору, в результате которого было повреждено 15 выставочных залов. После годового перерыва музей начал не просто восстанавливать экспозицию, но и организовывать новые выставки, оцифровывать экспонаты и создавать айдентику, которая впоследствии была воссоздана на страницах нового сайта, к разработке которого приложила руки команда Webnauts.
Вёрстка сайта по фирменному дизайну
Теперь областной краеведческий музей могут посетить не только жители и гости Николаева, но и каждый жаждущий культуры и истории украинец. Для этого достаточно вбить в поиск адрес и ознакомиться с филиалами, коллекциями, событиями и новостями музея.
Новый дизайн сайта, вдохновлённый цветами природы и древних артефактов Николаевщины, мы реализовали с помощью современных технологий:
- языка разметки HTML5, чтобы отобразить структуру и контент сайта в браузере,
- языки стилизации CSS и препроцессора SCSS, чтобы воссоздать дизайн страниц в точности с макетами,
- языка программирования JavaScript, чтобы добавить щепотку ненавязчивых анимаций.
Согласно новой айдентике музея, главную скрипку в минималистическом дизайне играют массивные типографика и фото экспонатов. Несмотря на насыщенность контентом, страницы выглядят аккуратными, структурированными и выразительными благодаря свободному пространству и линиям сетки, применимым к цветным карточкам.
Анимации на сайте
Свёрстанные страницы мы приправили микроанимацией, призванной не отвлекать внимание от основного контента, а сосредотачивать её на главных элементах интерфейса, с которыми взаимодействует пользователь. Это классические ховер-эффекты, написанные на нативном языке JavaScript, такие как подчеркивание ссылок и заливка кнопок цветом:
Эффект смены слайдов на главном экране сайта мы реализовали с помощью библиотеки Swiper.js.
Кроссбраузерность и адаптивность сайта
Автоматизировать рутинный процесс разработки и сборки сайта нам помог инструмент Gulp.js, а добиться корректного запуска сайта во всех, даже устаревших, браузерах — транскомпилятор Babel.js, который превращает современный код в более поздний стандарт JavaScript.
Чтобы сайт Николаевского музея хорошо отображался и работал на всех устройствах — от смартфона до стационарного компьютера, мы сверстали адаптивный интерфейс. В результате сайт автоматически «подстраивается» под формат и разрешение того дисплея, с которого он просматривается.
Разработка сайта на WordPress
Когда дизайн преобразован в код, пора «натягивать» его на CMS WordPress, то есть устанавливать на платформу. Так рождаются сайты с уникальным внешним видом, удобной админ-панелью для управления контентом и нужным функционалом. В случае с музеем — это двуязычие и система продажи билетов.
Чтобы расширить функциональность сайта, мы обошлись 9 плагинами, благодаря чему сохранили оптимальную скорость загрузки страниц:
Администрирование сайта без программиста
Каждый сайт должен быть удобен не только для посетителей, но и администраторов, которые заботятся об актуальном контенте.
Чтобы сотрудникам музея было просто управлять сайтом, мы построили удобный интерфейс админ-панели с помощью плагина Advanced Custom Fields (ACF) PRO. Этот инструмент позволяет не только легко редактировать контент, но и добавлять поля в админке без помощи разработчика.
События музея:
Выставки музея:
Новости музея:
Мультиязычность сайта
Если интернет-магазин нуждается в мультиязычном сайте, чтобы привлечь покупателей на международном рынке, то сайт музея должен быть готов сам «принимать» иностранных посетителей.
Надеемся, что Украине скоро воцарится мир, и Николаев снова станет туристическим магнитом. С верой в победу и восстановление туризма мы обеспечили функционирование сайта на двух языках — украинском и английском. Переключатель языка доступен в привычном для пользователей меню навигации сайта.
Мультиязычность была достигнута с помощью WordPress плагина Polylang, который позволяет переводить интерфейс админ-панели и страниц сайта.
Система продажи билетов на сайте музея
На перспективу мы заложили возможность продажи билетов на музейные выставки, экспозиции, экскурсии и другие события. Сайт готов к интеграции с платёжным сервисом и подключению функции оплаты билетов в любой момент.
Результат
Николаевский областной краеведческий музей развивается не ради, а вопреки, и благодаря современным веб-технологиям стал ещё ближе к украинцам. В 2023 году музей возобновил работу, отметил своё 110-летие и обновил айдентику, визуальным элементам которой подчиняется новоиспечённый сайт на WordPress.
Наша команда рада быть причастной к возрождению николаевской культуры в самое сложное для страны время, и удачно репрезентовать музей в онлайне именно тогда, когда это чрезмерно важно. Теперь копилка Николаевского музея, хранящая более 400 тыс. артефактов со времён палеолита, пополнилась современным минималистическим сайтом.
На своих страницах, выполненных в духе швейцарского стиля, музей знакомит пользователей с популярными экспонатами и новостями, приглашает на выставки и экскурсии, а также предлагает — чтобы популяризировать культурное наследие и собрать средства на восстановление музейного помещения и обустройство бомбоубежища для детей.
Комментарии