Дизайн портала Администрации Волгоградской области

Администрция области обратилась к нам с просьбой о помощи. Помощи в разработке Официального информационного портала Губернатора и Правительства Волгоградской области. Звучит? Большой шкаф громко падает, скажу вам. Ниже история о нашей работе, результате и выводах.

Актуальность

Портал губернатора и правительства области www.volganet.ru является ресурсом, аккумулирующим в себе несколько десятков подсайтов, поддоменов, разделов, информационных баз и прочее-прочее. Каждое ведомство имеет если не целый сайт на поддомене, то страничку точно. Везде формы, запись на прием, двадцатиуровневая навигация вглубь, и прочие прелести. Мысленно натяните на этот базар эклектики дизайн и табличную верстку бородатых годов, и вы поймете, с чем нам предстояло столкнуться. Для тех, кому лень представлять, зайдите на портал. Он до сих пор такой)

Текущая версия портала скрипит байтами на OpenCMS — свободно распространяемой платформе для разработки сайтов [http://www.opencms.ru/ru/]. Внутри нее суровые Java и XML, а снаружи отсутствие хороших специалистов-разработчиков и внятной технической поддержки. Как следствие, проблемы с развитием портала. Каждый новый раздел на сайте добавляет седых волос специалистам, которые его обслуживают. Комитет информационных технологий Волгоградской области устал тратить время и средства на доработки системы и решил перевести сайт на рельсы Битрикса.

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

Мы с коллегами, Алексеем и Степаном, начали с выявления текущих проблем портала. Вот они, повторим:

  • Неудобная навигация — три меню, в каждом по три подменю. Как в русских сказках.
  • «Каша» из баннеров и другие проблемы дизайна. Например, одни страницы тянутся по ширине на весь экран, другие, на соседней кнопке — нет
  • Отсутствие единообразия на подчиненных сайтах
  • Низкие позиции в рейтинге гос. сайтов

Три проблемы иллюстрирует скриншот типичной страницы портала. Это страница, на которой вместо текста опять размещено меню, а слева можно заметить первые два из пяти баннеров.

Портал Правительства области

Перед собой мы поставили следующие задачи:

  1. Сделать сайт лучше: удобнее, красивее, технологически современнее.
  2. Повысить места в рейтингах.
  3. Обеспечить “запас прочности”, чтобы сайт выдержал любые разумные изменения.

Для того, чтобы понять, кому нужен сайт, мы выделили целевые аудитории — основных посетителей сайта:

1. Власть (администрация, дочерние структуры, Государство, проверяющие, Дума). Им нужно, чтобы сайт соответствовал требованиям ФЗ и приказам Минэкономразвития России, и, кроме того, красиво рассказывал об их работе.

2. Население (пенсионеры, многодетные, ветераны, потребители госуслуг и тп). Так называемые, “Просящие”. Хотят найти контакт/закон/ответ на простой вопрос, кроме того, должны получить хорошее впечатление от величия и великодушия власти.

3. Специалисты (юристы, застройщики, журналисты, участники тендеров, кандидаты). “Требующие”. Ищут документ/человека/ответ на сложный вопрос. Должны получить хорошее впечатление от дизайна, навигации, контента.

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

Дизайн

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

  • Плохо предсказуемая структура навигации. В любой момент в любом разделе могут появиться 100500 подразделов и подстраниц.
  • Длинные пункты меню. Реальный пример — «Конкурсы для включения в кадровый резерв и на замещение вакантных должностей государственной гражданской службы Волгоградской области в органах исполнительной власти Волгоградской области»
  • Неглубокая, но очень широкая навигация. Десятки пунктов на каждом уровне.
  • Графика различного происхождения и в основном плохого качества. Относится к баннерам, присланным свыше, таблицам, бесконечным спискам документов.

Кроме того, мы утвердили некоторые требования к стойкости дизайна, и сайта в целом:

  • Сайт должен проработать минимум 5 лет
  • Сайт должен выдержать любое изменение структуры Администрации
  • Сайт должен выдержать количественное увеличение каждого меню в 2 раза
  • Сайт должен быть готов к вставке новых блоков в дизайн как на главную, так и на внутренние страницы без потери его визуального качества.

Обязательные элементы главной страницы:

  • Три-пять самых важных новостей с картинками
  • Десять-двадцать новостей. За день пресс-центр администрации генерирует их несколько десятков.
  • Губернатор и ссылка на его портал.
  • Баннеры, баннеры, БАННЕРЫ!!
  • Парочка меню, на все случаи жизни.

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

1. GOVERNMENT-стайл. По мотивам портала Правительства РФ. На текущий момент government.ru — лучший сайт органа власти в рунете.

Прототип дизайна - 1

2. Классический вариант Г-дизайна. «Г-дизайн» - это верхнее и левое меню в форме буквы Г, а не то, что вы подумали.

Прототип дизайна - 2

3. Мой любимый вариант. Называется газетный стиль. Главная страница несет мало текстовой информации и является, по сути, одним большим меню сайта. Исполняет роль передовицы, или оглавления.

Прототип дизайна - 3

Мы должны были выбрать два из трех, чтобы нарисовать два разных макета дизайна. Да-да, дорогие слушатели этого интересного, если вы хотите получить два разных дизайна, делайте два прототипа. Из одной модульной сетки получается один и тот же дизайн. Цвета-шрифты могут быт разными, структура — нет. Выбрали первый и третий. На это была ставка, мы выиграли и перешли непосредственно к фотошопированию.

Вот результат:

1. GOVERNMENT-стайл.

Дизайн портала - Вариант 1

2. Дизайн — оглавление.

Дизайн портала - Вариант 2

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

Вдруг… Знаете, как это в книгах бывает — «ничего не предвещало беды». Администрация славного города Санкт-Петербурга обновила свой портал [ http://gov.spb.ru/ ]. Вот-вот, они там быстрее реагируют. И что бы вы думали? Через пару часов нам позвонили из “нашей” администрации и сказали: «Ребят, вы чего там, с дуба рухнули что ли? Почему наш дизайн такой же, как у северной столицы?». Нда, бывает. Дуракам умные мысли в голову одновременно приходит. Вот он, кстати, этот сайт. Судите сами, похож или нет. Похож, да. Но мы же не виноваты.

Администрация СПб

Уникальность дизайна. Доказательство от противного.

Следующая неделя или две прошли в доработке дизайна. Обычно просят «сделайте, как у них». У нас было наоборот — мы делали, не как у них. Нам однозначно дали понять, что с текущим дизайном проект жить не будет. В результате нескольких дней игр со шрифтами и цветами родилась единственная и неповторимая версия дизайна главной страницы портала администрации области. Вот она.

Дизайн портала Правительства

Есть мнение, что мы поступили неправильно, и пошли на поводу у заказчика. Мы убеждали себя, что еще одна маленькая поправулечка, и больше не будем. Не очень много изменений произошло, фактически мы собрали обновленный дизайн из двух предыдущих. Заказчики утвердили и приняли работу.

Мы вздохнули с облегчением и начали готовиться к аукциону.

АукцИон

Что тут говорить? Это так весело — торговаться вслепую. Не буду описывать подробности. Скажу лишь, что мы не выиграли. Оппонент выставил цену ниже, и 25 декабря должен должен был предоставить готовый сайт. Протокол аукциона, кому интересно — http://etp.zakazrf.ru/DFile.ashx?guid=133d2ee8-2e3d-4d6a-856c-588c68f46557

Что дальше?

Честно говоря, мы затаили обиду и ждем, когда оппонент облажается, и заказчик вернется к нам. Если это и случится, то только в 2014 году.

Комментарии (8)

...
  • Роман Петров
  • 29.12.2013 11:19:24
Погодите - так это был тендерный этап, без оплаты? Или при чем тут аукцион?
...
Дизайн и еще некоторые работы делались без аукциона, по отдельным договорам. Закон и бюджет позволили. А основной блок -- через аукцион.

Забавно, что выигравший исполнитель получил сделанный нами дизайн. Делает. Что выйдет -- ждем с нетерпением.
...
  • Роман Петров
  • 29.12.2013 13:11:26
Сделает, уверен. А что внутри будет - другой вопрос.
...
  • Ивченко Андрей
  • 29.12.2013 20:47:00
Кто выиграл тендер-то? Неужели айти-центр? Или упаси б*г Циколия?
...
Все интереснее. Аукцион-то глобальный, не только местные. Выиграла некая питерская контора.
...
  • Vitaliy
  • 01.01.2014 16:25:17
Скорее большинство госсайтов создаются под влиянием/вдохновением 1-2 самых известных, и вероятность сделать «похожий» очень большая. С другой стороны — это не плохо.
...
  • Антон
  • 06.01.2014 15:49:55
Начальная цена 1 325 000 руб
Конечная цена 296 375 руб
Падение от первоначальной цены - практически 78%

Даже если та студия сольется, то если я не ошибаюсь, Интереволга будет делать этот сайт за 303 000 руб, падение от первоначальной цены тоже существенное, поэтому в этой ситуации могу только посочувствовать
...
  • Alex
  • 07.07.2015 21:49:35
Как пользователь (а сайт администрации и других органов власти, предназначен для такой категории людей) сравнивая предыдущую версию портала и текущую "битриксовую" можно наглядно сделать выводы, что лучше и не стало. Наоборот все усложнилось. Разве что фоновые тона стали более мягкими плавными.
Непонятно почему в битриксе сделаны большие поля-отступы. Очень неудобно и "съедает" достаточно полезного пространства.
Сложное меню навигации по под разделам, подразделов и т.д.... Всё-таки боковое раскрывающееся меню было намного удобнее.