Закрыть
E-mail:
Пароль:
Забыли пароль?
В каталоге проекта: 14 864 веб-студии, 998 CMS, 264 211 сайт.
РегистрацияCMS MagazineВход
CMS Magazine CMS Magazine

Государственные интернет-сервисы: принципы дизайна

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

1Начните с потребностей*

*потребностей пользователя, а не государства

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

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Статья только началась, а фраза "дизайн создается исходя из потребностей пользователя" - все уже сказала.

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

Мне десятки раз приходилось пользоваться такими ресурсами. Это мучение. И поэтому сегодня, хотя бы в своих комментариях к статье, я буду рассерженым гражданином.

Пример

Хороший пример того, как дизайн создается исходя из потребностей пользователя, — это страница об НДС.

Большинство пользователей попадает на нее после поиска по словосочетанию «ставка НДС». Поэтому мы сделали ответ на этот вопрос самым большим и заметным элементом на странице. Таким образом, пользователь моментально находит ответ на свой вопрос. Если же пользователь ошибся с запросом, то справа от основного содержания мы расположили ссылки на похожие материалы.

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

Мнение:
Dalee
В России на сайте московской управы Зябликово на самом видном месте расположена та информация, которую надо донести в рамках общемосковских проектов: программа комплексного развития, субсидии для предпринимателей и т.д. Она не имеет ничего общего с реальными интересами пользователя, заходящего на сайт управы.

 


 

 

2Избавьтесь от календаря и прогноза погоды

Государство должно делать только то, что оно умеет лучше всего. Если кто-то делает что-то лучше – поделитесь этим с пользователем. Если мы можем предоставить ресурсы (например, API), которые помогут другим людям решить их проблемы – сделайте это. Мы должны сконцентрироваться на основе основ.

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Часы, опросы и им подобные инфоблоки еще с начала нулевых помогают отвлечь посетителя от скудной сетки, отсутствия реально полезной информации и удачно маскируют дыры в макете. Уберете их. Лучше всего сразу вместе с сайтами на которых они сохранились.

Пример

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

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

Мнение:
Dalee
В России. Это сайт московской управы Тропарево-Никулино. В правой колонке никому не нужные часы, прогноз погоды и опрос, в котором за полгода приняло участие 69 человек. Та справочная информация, которая реально нужна пользователю, находится в левой колонке, занимающей не более 20% видимого места на экране.

 


 

 

3Сначала анализ, потом дизайн

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

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Хорошо сказано. В русском варианте это звучало бы не так красиво:
"Обычно мы не начинаем с чистого листа - у нас есть 400 страниц ненужного Технического Задания сделанного по устаревшему ГОСТу"...
"Мы должны понять желания начальника"...
"мы можем наблюдать за поведением чиновников и создавать систему, которая удовлетворяет их потребности и позволит нам быстрее сдать проект".

Интересный факт: в Техническом Задании, которое написано по ГОСТу вы никогда не найдете пользовательские пути и сценарии работы с сайтом. Итог: вы сделаете сайт, на котором не можете управлять потоками посетителей и не сможете предложить им нужные варианты действий.

Пример

Проследить путь пользователя сайту – это прекрасный способ понять, что пользователю реально нужно от вашего сервиса. В этом вам помогут такие сервисы, как Google Analytics. Также мы используем А/В тестирование, чтобы понять, как цвет элементов меню влияет на поведение пользователя.
Мнение:
Dalee
В России, глядя на количество отделов, которые отвечают за создание и поддержку сайта Государственной Думы РФ, верится с трудом, что там кто-то ведет сбор и анализ информации о посетителях.

 


 

 

4Упрощайте работу пользователя

Сделать что-то сложное выглядящим просто – легко. Сделать что-то сложное простым в использовании намного сложнее – особенно, когда в основе лежит сложная система. Но именно это мы и должны делать!

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Автор статьи подобрался к самому ценному. Вы - потребитель услуги. И для вас интерфейс взаимодействия с этой услугой важнее любой другой информации. Вам все-равно какой герб у этого органа, какой логотип и сколько в нем цветов. Вам совсем не нужно, чтобы вам доказывали силу и мощь этой организации. Вам просто хочется по-скорее закончить с каким-то важным делом. Gov.uk отличный пример, когда интерфейс не забивается бесполезной информацией о структуре, а кратко и четко дает возможность сделать нужный выбор.

Пример

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

  • Кстати, код этой формы доступен на GitHub.
Мнение:
Dalee
В России вот такую форму с огромным количеством полей нужно заполнить, чтобы подать заявление в органы внутренних дел РФ.

 


 

 

Мнение:
Dalee
А вот с помощью такой лаконичной формы вы можете пожаловаться на действия сотрудников полиции Ставропольского края РФ.

 


 

 

5Быстрее запустите, быстрее улучшите

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

Повторение снижает риск грубых ошибок и превращает небольшие ошибки в уроки. Это позволяет избежать 200-страничного документа, который может стать «узким местом». Это опять же одно из ключевых преимуществ digital-среды: мы не строим мосты – можно создавать продукт недоделанным.

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
"Быстрее запустите, быстрее улучшите" - хороший совет, но не для тех, кто работает в системе гос. закупок. В основном у вас только один шанс сделать проект. Сырая опубликованная бета-версия станет не попыткой быстрого старта, а страшным сном разработчика, когда к проекту придется возвращаться снова и снова за свой счет. До сих пор вспоминаются нашумевшие статьи про тендеры, в которых огромные порталы должны были быть созданы за месяц, а к ним должен был полагаться год бесплатной поддержки.

Пример

Мы выпустили альфа-версию GOV.UK в прошлом году, а бета-версию в январе этого года. Похоже, такой формат постепенно запуска оказался удачным, и представители власти взяли его себе на вооружение: посмотрите на сайт правительства Шотландии.
Мнение:
Dalee
В России разработчики сайта Госуслуг не стали полностью удалять старую версию, а дали пользователям время, чтобы можно было адаптироваться к новой.

 


 

 

6Используйте то, что работает

Доступный дизайн – это хороший дизайн. Мы должны создавать продукт, который будет как можно более интегрированный, понятный и читабельный. Если для этого нужно будет пожертвовать красотой – да будет так! Мы не должны бояться очевидных решений. Придумать что-то новое в веб-дизайне – это не самоцель нашей работы. Наоборот, мы должны очень четко представлять ожидания пользователей от сервиса.

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Тут я буду мягок. Сайты государственных структур чуть ли не единственные, кто думает о посетителях с ограниченными возможностями. И речь идет вовсе не о владельцах мониторов с разрешением 800х600.

Пример

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

 


 

 

7Учитывайте контекст

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

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Боюсь что "риск сделать визуально привлекательный сервис, который противоречит потребностями пользователей" в нашем случае отсутствует. Наличие мобильных версий не спасает сайт, на котором нет удобной навигации и продуманного содержания ля каждой целевой группы.

Пример

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

  • Помните, что мы организуем информацию, а не расставляем пиксели по экрану.
Мнение:
Dalee
В России наличием мобильной версии может похвастаться большинство сайтов федеральных органов власти. Так, можете почитать новости с мобильной версии сайта МВД. А вот мобильной версии на сайте Госуслуг еще нет.

 


 

 

8Создавайте услуги, а не сайты

Наш сервис не начинается и не заканчивается на сайте. Он может начинаться с поисковика и заканчиваться в почтовом отделении. Мы должны учитывать это в дизайне, даже если не можем это контролировать. И мы должны иметь в виду, что в какой-то момент эта ситуация может измениться.

Еще раз: мы должны думать не о сайте, а об услугах, которые пользователи получают с его помощью. На данный момент интернет – это один из лучших способов оказания услуг, но это может измениться. И намного быстрее, чем мы думаем.

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
"Создавайте услуги, а не сайты", создавайте цепочку в логистике услуги, втягивайте в этот процесс как можно больше потребителей, масштабируйте свои силы, выходите за рамки офисного пространства. Пока это просто слова. В 2009 мы сделали проект для одной гос.компании. Ресурс провисел в сети всего месяц. Мы не учли важный момент: опубликованный перед новым годом, сайт активно обсуждался директором и айтишником этой компании в бане. Как финал, сайт переделала команда этого айтишника (сделали очень быстро и поэтому явно хуже) за пару недель. Директора через полгода уволили, айтишник скрылся, по второму сайту у службы безопасности возникло много вопросов. Очевидно, что логистика есть, но работает она пока не в ту сторону.

Пример

Один из пользователей сделал плагин для CMS-платформы WordPress, который позволяет использовать информацию с сайта GOV.UK в любом посте или странице на WordPress.

Мнение:
Dalee
В России сайт государственных услуг Москвы демонстрирует один из лучших примеров решения проблем пользователей, а не просто создания сайтов. Спасибо департаменту информационных технологий Москвы!

 


 

 

9Будьте последовательными

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

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Привести все сайты к одному простому и понятному решению, это титаническая работа. Создание единого интерактивного стиля, общих принципов навигации... эти задачи пугают своим масштабом. Чем раньше этот процесс начнется, тем лучше. Будем ждать.

Пример

На данный момент мы выпустили два сервиса: GOV.UK и «Внутри правительства». Сравнив страницы этих двух сервисов, вы легко поймете, что мы имели в виду под последовательностью в дизайне.
Мнение:
Dalee
В России сайты министерства транспорта РФ и министерства обороны РФ красноречиво демонстрируют отсутствие даже намека на последовательность.

 


 

 

10Обратная связь улучшает сервис

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

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

Мнение:
Александр Ковальский
Руководитель и креативный директор
CreativePeople
Не важно каким способом получен отзыв с сайта. Важно как вы на него реагируете. Пожалуйста, просто реагируйте.

Пример

  • Это пример страницы, которая иллюстрирует множество из этих принципов в действии.

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

Мнение:
Dalee
В России, если вы хотите направить свои предложения по улучшению дизайна сайта Государственной Думы РФ, то для начала вам нужно войти в раздел «Разработка и сопровождение сайта». И только там в самом низу есть волшебный электронный адрес design@duma.gov.ru, на который вряд ли кто-нибудь когда-нибудь ответит.

 

 

Оригинал: http://www.cossa.ru/

Комментарии экспертов

Дмитрий Бороздин

Компания: Интаро
Должность: Генеральный директор

Как представитель компании-разработчика duma.gov.ru скажу, что действительно есть такая проблема как несовпадение потребностей пользователей сайта и требований нормативных документов. Т.е. на практике первое, что мы сделали перед проектированием сайта — проанализировали 4 массива информации:

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

В результате мы составили итоговый рейтинг востребованности пользователями категорий данных на сайте. Кстати, эта информацию не закрытая, здесь в кратце представлена http://intaro.ru/portfolio/gosduma/. Далее, когда мы анализировали содержание нормативных документов, то увидели 2 проблемы: во-первых, требования к сайту нормативных документов далеко не всегда совпадают с интересами пользователей; во-вторых, требования к формулировкам и структуре делали их громоздкими и сложными для восприятия.

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

Иван Бегтин

Компания: "Информационная культура"
Должность: Директор

На сегодняшний день развитие электронного и открытого государства в Великобритании поражает, их инициативы и проекты цитируются многими моими коллегами и я сам часто привожу их в пример. Однако очень важно помнить что эти предложения, безусловно правильные могут применяться на практике лишь при наличии среды позволяющей их реализовать. И один из ключевых вопросов здесь — это открытость государственных данных для разработчиков. В Великобритании это уже настолько норма что они об этом могут не писать специально, но без открытости информации у людей обладающих профессионализмом и желанием что-то делать — просто нет того «топлива» на которых они могли бы запустить свои проекты. Поэтому я хочу напомнить про проект data.gov.uk благодаря появлению которого и огромным объемам данных и могут появлятся современные сервисные государственные, коммерческие и общественные проекты.

Максим Павлов

Компания: Notamedia
Должность: Арт-директор

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

В последние несколько лет ситуация начинает улучшаться. kremlin.ru — приятно выделяется на все еще убогом фоне большинства госсайтов, и задает правильный вектор. Многие госструктуры заказывают себе сайты, и они выглядят значительно приличнее, чем примеры в статье. Но проблема остается. Большинство госсайтов по структуре и подаче информации — это проекция бюрократического аппарата в сеть.
 

Роман Павленко

Компания: Leo Burnett Group Russia
Должность: Digital Creative Director

На самом деле, я даже не очень понимаю, что здесь можно прокомментировать. На мой взгляд, все очевидно. Приведу такой пример: о каком дружелюбии и удобстве пользования можно говорить, если у нас существует организация, которая официально называется «Совет Федерации Федерального Собрания Российской Федерации»? Не верите, съездите на Большую Дмитровку, 26, там золотом по серому так и написано.

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

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

Хотя то, что на масленицу было сделано в Москве (в том числе и с сайтом), и исходило, насколько я понимаю от Комитета культуры Московского правительства, если и не было идеально, то, по крайней мере, приятно контрастировало с тем, что у нас обычно исходит от госструктур.

Григорий Коченов

Компания: AGIMA
Должность: Креативный директор

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

Я имел достаточно долгий и печальный опыт работы с госструктурами, например с Союзом Малых Городов России. Врагу не пожелаешь иметь такого неадекватного клиента. Жуткая вкусовщина и полное непонимание того, для чего вообще делается сайт. Клиента надо образовывать, но в случае с чиновниками все сложнее. Обычно у них нет мотивации учиться и желания слушать чье-либо мнение. Возможно мне просто сильно не повезло и я хочу верить в то, что ситуация меняется к лучшему. Эта статья нам в этом поможет.

Спасибо.

Илья Авдеев

Компания: Progression
Должность: Арт-директор

Спасибо за статью. Было интересно ознакомиться с примерами британских сайтов.
Хотелось бы начать с какой-то позитивной оценки наших госсайтов, но как-то язык не поворачивается. :) Уж больно плачевная с ними ситуация.

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

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

Если Вы хотите дать экспертный комментарий к статьям, публикуемым на CMS Magazine, следите за анонсами материалов в нашей группе в Facebook.

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


CMS Magazine CMS Magazine
Реклама
RSS-подписка
CMS Magazine CMS Magazine
CMS Magazine