О клиенте
kemerovo.ru – официальный сайт Администрации города Кемерово. Он был разработан 15 лет назад. За это время объём информации на нём увеличился в несколько раз, а структура сайта разрослась так сильно, что в итоге он стал сложным и запутанным. Например, некоторые разделы дублировались, а часть была так глубоко спрятана, что найти их могли только сами создатели.
Кроме того, за последние годы полностью изменились требования общества к госсайтам. Сейчас граждане хотят не только читать тексты, а ещё и видеть полезные сервисы, которые решают их проблемы онлайн и экономят время.
Было очевидно, что сайт устарел и требует полной перезагрузки.
Задачи проекта
Заказчик поставил перед нами следующие задачи:
- Реструктурировать контент и структуру сайта таким образом, чтобы на первом плане была полезная для людей информация, получение услуг, участие в жизни города.
- Сделать анализ российских муниципальных и областных сайтов и предложить удобные для граждан сервисы, которые можно внедрить на kemerovo.ru.
- Спроектировать интерфейс сайта, простой и понятный для всех групп жителей города – от школьников до пенсионеров. Описать технические требования его разработки.
- Оформить работу в техническое задание, на основании которого будет проведен тендер на разработку сайта.
О процессе работы
Заказчиком проекта выступал отдел информационных технологий города Кемерово, но людей, заинтересованных в разработке нового сайта было намного больше. Поэтому администрация создала комиссию, в которую входило 13-15 человек. Она состояла из пресс-службы, специалистов по работе с населением, соцзащиты, обращениями граждан и др. Помимо комиссии была создана рабочая группа из трёх сотрудников отдела ИТ.
Процесс работы происходил так:
- Мы проектировали один или несколько разделов сайта.
- Обсуждали идеи и интерфейсы с отделом ИТ.
- При необходимости дорабатывали их.
- Согласовывали правки с отделом ИТ.
- Выносили наработки на обсуждение большой комиссии.
Финальную версию концепции и технического задания сайта согласовал глава города.
Концепция сайта
В основе концепции сайта мы определили следующие принципы:
- Простота и доступность. Сайт должен быть прост и доступен для восприятия абсолютному большинству жителей города – и школьнику, и бабушке, и человеку с ограниченными возможностями. Мы отказываемся от замысловатых решений, интерфейс должен быть понятным – несколько шагов для совершения любого действия.
- Отзывчивость. Весь функционал сайта должен быть доступен на всех экранах и платформах без потери качества. Эти требования мы отразили в техническом задании.
- Сервисный подход. На сайте должна быть не просто информация, он должен предоставлять услуги, которые решают проблемы жителей города.
- Гибкость. Мы не делаем проект на века. Сайт решает множество задач и они постоянно меняются, поэтому он должен динамично без больших временных затрат подстраиваться под них.
Контент и структура сайта
Информация, размещаемая на сайте любого государственного органа и органа муниципального управления строго регламентирована законами РФ: N8-ФЗ от 09.02.2009, N 149-ФЗ от 27.07.2006, ГОСТ Р 52872-2007 и другими. Благодаря им обеспечивается доступность и открытость информации о деятельности госорганов. Для разработчиков это значит, что с госсайта нельзя просто так выкинуть половину разделов, потому что они слишком громоздкие или устарели. Здесь требуется более кропотливая работа.
Мы с заказчиком прошлись по всем страницам сайта и буквально тыкали на экран и спрашивали: «А это что? Почему обязательно должно быть? Давайте смотреть закон». Так нам удалось не переносить в новую структуру ворох ненужных неактуальных данных, которые кто-то когда-то разместил, а потом все боялись удалять.
Благодаря проведению этой работы структура нового сайта по сравнению со старым уменьшилась в полтора раза.
Проектирование интерфейса сайта
Для сайта был разработан динамический прототип. Мы спроектировали все страницы, на которых есть функционал (взаимодействие с пользователем).
Навигация и главная страница
При проектировании меню сайта исходили из простых потребностей жителей города – найти телефон для связи, ФИО нужного специалиста, почитать новости и посмотреть афишу на выходные. Укрупненно распределили информацию о деятельности администрации по разделам «Власть», «Отрасли», «Общество», «Обратная связь граждан» и «Городские проекты». Отдельно разместили новости и афишу города. В итоге количество пунктов меню с 21 уменьшилось до 5.
Главная страница построена на основе блоков, которые в короткие сроки можно менять местами – поднимать одни, перемещать вниз другие. Эти блоки универсальны – в них можно размещать любую информацию. Например, перед выборами на первом экране поставить баннер со ссылкой на страницу избирательной комиссии, а летом разместить график отключения горячей воды.
На внутренних страницах сайта мы сделали боковую навигацию с раскрывающимися списками. Это решение позволило добавлять сколько угодно подразделов и страниц в них.
Структура Администрации
Администрация Кемерово имеет разветвленную структуру, которая часто меняется. Было очевидно, что древовидная структура, которая размещена на старом сайте, здесь не подходит – она слишком перегружена и не адаптируется на мобильных устройствах. Мы предложили гибкое решение – разместить представителей власти в виде списка. При увеличении количества заместителей достаточно добавить в список новую карточку.
Тут же в карточках заместителей главы города размещены контакты руководителей управлений и комитетов, которые находятся у него в подчинении. При клике на карточку открывается отдельная страница с подробной информацией.
Сферы деятельности
На старом сайте все разделы сфер деятельности отличались друг от друга – в одном было несколько подразделов и десятки страниц, в другом скудный набор данных из контактов и фото. Найти нужную информацию в таком хаосе было крайне сложно.
Мы предложили единую структуру для всех сфер деятельности, сгруппировав информацию в следующие блоки: структура управления, муниципальные услуги, деятельность, документы, новости. Если в какой-то из сфер деятельности нет информации для одного из блоков, он автоматически скрывается. Порядок и единообразие упрощают работу с данными и экономят время пользователей на поиск нужной информации.
Новости и афиша города
Новости на сайте представлены в виде списка, поскольку подавляющее большинство новостей не имеют фото. Мы вместе с пресс-службой решили, что если у новости будут фотографии, то они будут размещены на странице новости, а не в списке.
В разделе предусмотрен рубрикатор новостей, мы перенесли его со старого сайта, удалив неактуальные рубрики. Помимо рубрик пользователи могут отфильтровать новости по диапазону дат публикации. Также доступен текстовый поиск по сайту.
События в городские афише сгруппированы по районам. Изначально мы предполагали, что у каждого события будет отдельная страница (как в новостях), но из-за специфики наполнения этого раздела остановились на простых текстовых страницах.
Сервисы для граждан
Помимо проектирования интерфейса заказчик ожидал от нас получить предложение по модернизации текущего сайта: какие сервисы нужно добавить, чтобы улучшить взаимодействие администрации с жителями города.
Мы составили список из десяти идей, но, увы, в бюджет сайта вошли только три из них, причем два уже в том или ином виде были на сайте. Эти три раздела решили внедрить на текущем этапе разработки сайта, остальные отложили на неопределенный срок.
Виртуальная приёмная
Улучшили аналогичный раздел старого сайта: убрали лишние поля в форме подачи обращения и внесли другие правки, упростив её заполнение, добавили ответы на часто задаваемые вопросы.
Запись на прием к специалистам
Новый раздел сайта. Мы определили жизненные ситуации, в которых человеку может потребоваться личный прием специалиста администрации и сгруппировали специалистов по ним. Саму форму записи разбили на три этапа, на которых пользователь последовательно выбирает тип вопроса, удобную дату и время из доступных в расписании, а также заполняет контактные данные. После заполнения формы на email пользователя автоматически отправляется информация о дате, времени и адресе приёма.
Опросы жителей города
Сменили механику голосования и отображения результатов опросов.
Техническое задание
Итоговым документом проекта стало техническое задание на разработку сайта. В него были включены информационная структура и прототипы интерфейса, а также описание технических требований к разработке сайта.
Были описаны следующие требования:
- требования к программному обеспечению сайта, front-end и вёрстке сайта
- требования к системе управления и хост-площадке сайта
- требования к специальной версии для слабовидящих
- требования безопасности сайта и защите информации от несанкционированного доступа
- требования интеграции сайта со смежными информационными системам
- требования к обеспечению стабильности функционирования сайта
- перспективы развития, модернизации нового сайта
- требования к приёмке работ и вводу системы в эксплуатацию
- документация, предоставляемая заказчику