7 июля на просторах интернета распространилась новость о том, что из фонда борьбы с COVID-19 планируют выделить 3,5 миллиона гривен на создание сайта для Уполномоченного Верховной Рады Украины. Эта новость стала предметом активных обсуждений.
В противовес этой истории хотим напомнить о кейсе, который произошел в конце января 2020 года в Чехии. Группа программистов-энтузиастов бесплатно разработала сайт для госадминистрации, сэкономив государству 16 миллионов евро.
В 2020 тренд "отдавать" становится все более актуальным. Мы не остались в стороне, и решили подарить украинским пользователям положительный опыт работы с сайтами городских и областных администраций, разработав и выложив в открытый доступ UI kit.
UI kit - это комплект веб-интерфейса. В нем собраны компоненты интерфейса: иконки, виджеты, флажки, индикаторы прогресса и кнопки навигации. Это готовый набор макетов и компонентов, которым может воспользоваться дизайнер или верстальщик для переработки и переиспользования готового материала под свои запросы и задачи.
С недавних пор у нас в государстве есть универсальный стиль, который рекомендован Министерством Цифровой Трансформации. Это значит, что есть возможность создать универсальные шаблоны, которые подойдут практически любому государственному учреждению. Более того, общий курс страны на диджитализацию предполагает также разумное использование ресурсов. Нам пришла в голову идея создать универсальные шаблоны, которые могла бы использовать любая государственная структура.
Руководствовались подходом Mobile First - все страницы создавались изначально под отображение на мобильном гаджете.
(Mobile First и набор дизайн-шаблонов для отображения на мобильных)
Мы проработали следующие страницы (для мобайл и веб отображения):
- Главная страница
- Лента статей (новостей)
- Страница одной статьи (новости)
- Раздел с работниками администрации
- Страница с информацией об одном работнике
- Страница с контактами администрации
- Проработан GUI - то есть активные состояния элементов
(Набор готовых дизайн-шаблонов для веб-версии сайтов)
Кроме того, мы проработали около 50 иконок, которыми можно воспользоваться, а также зафиксировали руководство по стилю (шрифты, цвета, кнопки, поля) и основные компоненты (цитаты, аккордеон и хлебные крошки).
(Набор готовых иконок)
В чем ценность открытого UI kit?
- Готовый шаблон. Городскому совету или областной администрации не нужно будет тратить время и ресурсы специалистов на то, чтобы продумать структуру и логику будущего сайта. Она уже разработана опытной командой по интерфейсам, и её можно просто брать и внедрять
- Решения в UI kit проработаны согласно требованиям министерства цифровой трансформации. Это значит, что единый стиль цифрового государства соблюден.
- В разработке UI kit принимали участие специалисты с 14-летним опытом разработки сайтов. Кроме того, при создании опирались на текущие тренды в веб-дизайне.
- Готовый UI-kit - быстрый старт по проекту. Грамотный UX/UI закрывает самый первый этап разработки проекта, и позволяет быстро перейти к разработке. Мы собрали воедино все, что может понадобиться веб-мастеру: компоненты, макеты, виджеты, ховерные состояния, а также мобильную версию.
- Решение можно получить совершенно бесплатно. Следовательно, не нужно тратить бюджетные деньги на разработку дорогостоящего сайта. Тем более что сейчас не лучшее время, чтобы вкладывать сотни тысяч бюджетных гривен на разработку государственных порталов.
Кто сможет использовать UI kit?
С точки зрения государства, ключевые пользователи UI kit – службы, которые используют сайты для информирования граждан, а также сбора обратной связи. Среди них: пресс-службы, CTO государственных служб, а также профильные департаменты.
В последнее время они нацелились на обновление парка своих ресурсов. Мы уверены, что это отличная возможность обновлять сайты государственных администраций бесплатно, или же сократить бюджет в десятки раз. С точки зрения жителей страны пользователи UI kit – это каждый из нас, кто получает информацию из государственных органов, использует сервисы, а также дает обратную связь, жалобы или предложения.
Ключевая задача – повысить скорость модернизации информационных государственных ресурсов. Сделать это быстрым, эффективным и бесплатным процессом.
Почему было выбрано такое дизайнерское решение?
Мы более 8 лет работаем с государственными учреждениями разного профиля, поэтому у нас сформировалась довольно сильная экспертиза в рамках понимания того, что должно быть на подобных сайтах. Мы знаем, что на 90% эти ресурсы решают одну и ту же задачу - информирование пользователей о новостях, а также сбор обратной связи от жителей. Некоторые ресурсы, созданные нашей командой для городских администраций были разработаны 5 лет назад, но не теряют актуальности и сегодня.
Посоветовавшись с горсоветом Харькова, мы приняли решение выложить в открытый доступ UI kit, собранный на основании сайта Харьковской Городской Администрации.
Говоря о стилистике сайта, мы исходили от логотипа и фирменного стиля Харьковского горсовета, а также брали за основу гайдлайны для гоструктур от Дiя.
Основными задачами, которыми мы руководствовались при разработке дизайна для UI kit стали:
- упростить структуру сайта и сделать удобное меню;
- обеспечить доступность блока новостей, так как это самый популярный раздел сайта;
- сделать быстрый доступ к контактам и формам обратной связи;
- проследить за сохранением чистоты и упорядоченностью информации;
- обеспечить гибкость структуры для обновления и масштабирования;
- соответствие дизайн системе государственных сайтов Украины.
UI-kit - помощник для старта разработки сайта госструктурам. Наша идея - поделиться своими наработками. Мы будем рады, если наша работа будет использована. Надеемся, что сайты госструктур станут упорядоченнее и удобнее для поиска информации и связи.
UI Kit и инструкцию к нему можно найти по ссылке.
