Современный и интерактивный: новый городской портал Улан-Удэ 3 в 1

Заказчик
МКУ «Управление информатизации и информационных ресурсов Администрации г. Улан-Удэ», город Улан-Удэ.
Задача
Модернизация официального сайта органов местного самоуправления г. Улан-Удэ - создание городского портала, состоящего из трёх ресурсов.

Городской портал должен состоять из следующих ресурсов:

  1. Официального сайта органов местного самоуправления (с информацией, обязательной к размещению в соответствии с действующими нормативно-правовыми актами)
  2. Информационного сайта Улан-Удэ (со справочной информацией об основных сферах жизнедеятельности).
  3. Интерактивного сервиса «Активный горожанин» (работы по вёрстке и дизайну сайта).

Задачи проекта:

  • Создать концепции дизайна для сайтов, учитывающие современные решения и тенденции в области веб-разработки, а также отвечающие принципам внедряемого в РФ стандарта государственных сайтов.
  • Разработать структуру сайтов, в которой маршрут поиска необходимой информации в подразделах будет максимально коротким и простым, начиная с главных страниц.
  • Обеспечить удобное и понятное для пользователей представление информации.
  • Создать удобную и функциональную систему поиска по сайтам Портала.
  • Разработать два сайта, располагающиеся на разных доменах, объединенные единой информационной базой, а также создать интерактивный сервис «Активный горожанин» (дизайн и вёрстка)

В текущем кейсе мы рассмотрим этапы 6-месячной работы по модернизации городского портала Улан-Удэ, состоящего из трёх ресурсов.

Для начала

На прежнем сайте наблюдалась перезагруженность материалами, сложность внутренней структуры разделов и неудобство навигации, устаревший дизайн.

Новый информационный сайт города Улан-Удэ разрабатывался с целью создания удобного и востребованного населением многофункционального информационного комплекса, объединяющего в себе площадку для публикации официальной информации и новостных материалов, различные сервисы, интерактивные справочники и многопрофильную пользовательскую среду.

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

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

Что было сделано?

Итак, в настоящее время реализованы 3 полноценных ресурса: два сайта, функционирующих абсолютно автономно на одной платформе 1С-Битрикс - информационный и официальный, а также интерактивный сервис «Активный горожанин» (вёрстка и дизайн).

В качестве системы управления сайтом используется система «1С-Битрикс: Управление сайтом» – редакция «Бизнес». С целью выполнения требований заказчика функционал стандартных компонентов Битрикса был кастомизирован.

В ходе работ были решены следующие задачи:

1. Созданы два полноценных сайта на одной платформе + произведены работы по вёрстке и дизайну интерактивного сервиса «Активный горожанин».

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

На информационном сайте представлены новости города, полезная информация для его жителей, ссылки на сервисы и информационные ресурсы, афиши мероприятий и другая информация.

 

«Активный горожанин» - это интерактивный сервис жителей Улан-Удэ. С его помощью любой гражданин может сообщить об увиденных проблемах, требующих устранения со стороны городских ведомств (подразделений администрации города и муниципальных служб).

2. Созданы версии дизайна для сайтов, учитывающие современные решения и тенденции в области веб-разработок, а также отвечающие принципам внедряемого в РФ стандарта государственных сайтов.

Наш путь к созданию удобного и полезного ресурса начался с разработки прототипа и структуры сайта. Мы тщательно разработали первоначальный дизайн интерфейса (прототипы с ux-элементами) и подготовили ui-кит, которые наглядно демонстрируют основные информационные элементы и блоки обоих сайтов:

Вот так выглядел прежний сайт:

 

Городской портал в новой версии, состоящий из 3-х ресурсов, сейчас выглядит следующим образом:

При сравнении версий «до» и «после» можно заметить, что концепция текущего дизайна новых сайтов выполнена в минималистичном стиле. За основу были взяты принципы приоритета потребностей пользователей, удобного чтения, эргономичности и общедоступности. Шаблоны страниц и расположение блоков детально проработаны в целях наилучшего восприятия. Основу дизайна формируют информационные блоки, а также типографика, наборы идеограмм и иконок.

При разработке дизайна сайтов г. Улан-Удэ мы ориентировались на стандарты и рекомендации проекта «Дизайн государственных систем России»:

Учитывая это, были разработаны разные по оформлению варианты дизайна, но в общей стилистике.

Дизайн сайтов соответствует основным критериям и требованиям адаптивности и логики подхода «mobile-first». Содержимое страниц корректно отображается на различных устройствах.

Лендинг пейдж

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

Редактор может самостоятельно устанавливать последовательность блоков по требованию (реализован конструктор с возможностью собирать страницу проекта из готовых блоков и шаблонов).

3. Разработана структура сайтов с максимально коротким и простым маршрутом поиска необходимой информации в подразделах.

Особое внимание уделено навигации по сайту и поиску нужных разделов. Структура новых сайтов собрана таким образом, чтобы к основным разделам можно было перейти не более, чем в три клика. На старом сайте новостные разделы находились достаточно глубоко в структуре; теперь же разделы районов вынесены в основное меню, а их новости попадают в общую ленту.

Таким образом, благодаря соблюдению «правила 3 кликов», пользователь быстрее может найти то, что ему нужно, а значит и продлить свое пребывание на сайте. Это также благоприятно повлияет на рейтинг разработанных сайтов в поисковой выдаче, поскольку юзабилити для пользователя - один из важнейших факторов ранжирования в поисковых системах.

В рамках работ по базовой оптимизации были сформированы динамически формирующиеся карты сайтов в формате .xml (файл sitemap.xml). Однако стандартный механизм формирования карты сайта, имеющийся на платформе 1С-Битрикс, был не способен корректно формировать sitemap.xml из-за особенностей структуры разработанных сайтов.

Для создания sitemap.xml был разработан собственный механизм, учитывающий особенности структуры сайтов, обеспечивающий автоматическое построение sitemap.xml и его обновление при изменении структуры любого из сайтов (добавление/удаление страниц и разделов).

4. Обеспечено удобное и понятное для пользователей представление информации.

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

Предусмотрен удобный просмотр медиаматериалов: фотоальбомов, видеозаписей, документов.

Добавлены новые разделы, в частности, «Гостям города» - раздел для приезжих, содержащий сведения о памятниках, транспорте, гостиницах и телефоны экстренных служб:

Появился раздел «Электронная библиотека», в котором можно ознакомиться с книгами разных лет о городе Улан-Удэ:

 

Впервые появилась интерактивная карта, на которую нанесены метки по различным объектам категорий «Городское хозяйство», «Культура», «Образование», «Туризм» и «Спорт»:

 

Объекты и категории можно фильтровать:

По клику на метку открывается информация о конкретном объекте:

 

На официальный сайт внедрена интерактивная карта, с помощью которой пользователи могут ознакомиться со схемой избирательных округов и найти свой избирательный участок. Редактор может указать границы и задать цвет области избирательного округа в Административной части сайта (такого типа свойства нет в стандартном функционале Битрикса, мы самостоятельно разрабатывали этот тип).

 

Также на официальном сайте реализована интерактивная карта районов города с подробной детализацией - ссылками на паспорт района, сведения об Администрации, полезную информацию и др.

 

Отдельно обозначены предстоящие мероприятия и важные объявления:

 

Внедрены «инструкции по применению» (от «Как получит разрешение на полет над городом?» до «Как оформить участок для садоводства?»)

 

Для удобства посетителей нашими специалистами было добавлено свойство «Контент официальный/информационный сайт», позволяющее делать перекрестный контент между разделами официального и информационного сайтов, если они содержат идентичную информацию. Таким образом пользователи могут получать ключевые сведения о городе, находясь на любом из двух сайтов. Кроме того, это существенно сокращает время наполнения портала контентом.

 

 

Требования заказчика к функционалу портала отличались от типового функционала Битрикса и в краткий период платформа была кастомизирована до требуемого уровня.

5. Создать удобную и функциональную систему поиска по сайтам Портала.

Новый городской портал имеет улучшенный поиск внутри разделов c подсказками и «умными» фильтрами:

Помимо стандартного окна поиска, здесь реализован поиск по тегу и блок наиболее частых запросов.

Чего же удалось добиться?

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

Все требуемые работы были выполнены в полном объеме и с надлежащим качеством, а главное, результатом довольны все!

Еще больше кейсов и полезных материалов ищите на нашем сайте: RuNetSoft


Перейти на сайт

В карточку агентства
Пользуйтесь реальным опытом в IT и следите за успехами потенциальных подрядчиков и конкурентов

Читайте также

Кейсы по теме#Государство и политика