.png)
Команда Evergreen розробила новий формат інформаційного порталу Національної Поліції України. У нас уже був досвід взаємодії з державною службою України та Консультативної Місією Європейського Союзу. Однак даний проект зайняв у нашому портфоліо особливе місце, оскільки довелося враховувати ряд непростих технічних моментів:
Клієнт & Замовник
Крім складнощів технічного характеру, в цьому проекті був адміністративний нюанс: клієнт ≠ замовник. Тому для затвердження багатьох пунктів проекту були потрібні десятки дозвільних підписів різних інстанцій обох суб’єктів взаємодії.
Клієнт проекту: державна служба, Національна Поліція України.
Вимога клієнта: створити цікавий, інтуїтивно зрозумілий сайт – інформаційний портал національної поліції та всіх її регіональних відділень.
Замовник проекту, він же спонсор: Консультаційна місія Європейського Союзу, EUAM (The European Union Advisory Mission).
Мета EUAM в Україні: підтримати реформування сектора громадянської безпеки в цілому. Національної Поліції, в тому числі.
Джерело фінансування: КМЕС із бюджету ЄС.
Цілі й задачі проекту
ЦІЛІ ПРОЕКТА
 |
 |
|
Створити сайт Національної поліції України. Зробити його зручним і зрозумілим |
Покращити імідж поліції, підвищити рівень довіри серед українців |
ЗАДАЧІ
 |
Вирішити всі технічні проблеми та незручності, які були притаманні старому веб-сайту:
|
 |
Реструктурувати розділи сайтів для: a. більш швидкого пошуку; |
 |
Продумати новий дизайн згідно з Брендбукм Нової Поліції та її потребами. |
 |
Забезпечити можливість наповнення сайтів наступними видами медіаконтенту:
|
РІШЕННЯ ВІД EVERGREEN: СТВОРЕННЯ САЙТУ, ЗРОЗУМІЛОГО І ЗРУЧНОГО ДЛЯ ВСІХ КОРИСТУВАЧІВ
Функціональний і мобільний сайт. 24 сайти – одна адмінка
Для зручності співробітників НПУ ми змінили ПО адміністрування сайту на просту у використанні CMS. Вона відмінно підходить під сайти з великими обсягами інформації та об’єднує регіональні сайти з головним (npu.gov.ua). Систему управління базами даних (СКБД) Oracle ми замінили на MySQL, яка значно простіше у використанні.
Була створена базова модель регіональних сайтів, від якої успадковується кожен наступний регіональний сайт. Обласні сайти ми розмістили на піддоменах, наприклад: hk.npu.gov.ua (Харківська область). В рамках створеної системи адміністратор порталу може створити новий сайт, призначити регіонального адміністратора і контент-менеджерів. Платформа розмежовує сферу діяльності регіональних менеджеровов і регламентує їхні права. Кожен із них бачить і править тільки свій сайт, який дозволяє керувати контентом сайту будь-якої області із загальної адмінпанелі. Новий сайт створюється з адмін-панелі лише кількома кліками мишки.
Кожен із сайтів доступний українською, російською і англійською мовами.
Всі регіональні версії сайту НПУ мають ідентичний дизайн і структуру, але різний контент. Для оперативного наповнення сайту з місця події ми створили автономну мобільну версію. Співробітники прес-служб різних областей мають можливість заходити в адміністративну панель із мобільного телефону й оперативно оновлювати інформацію. Новини можна швидко експортувати з Word і перетворювати в редакторі на html або text формат.
Всі сайти, що входять у портал, адаптовані під будь-які десктоп і мобільні пристрої. Після створення “версії для слабозорих” сайт можна повною мірою охарактеризувати як доступний кожному користувачеві.
Зручний сайт, спрощена структура, зрозуміла навігація, продуманий ux дизайн
Старий сайт був гранично перевантажений зайвими категоріями і пунктами меню, що неймовірно ускладнювало навігацію. Ми змінили структуру сайту, спростили, розставили категорії по пріоритетності. Тепер основна інформація доступна за кілька кліків.
Результат:
- меню з 6 категорій замість 12
- 41 пункт замість 63
- 3 секунди замість 10 для знаходження потрібного пункту
Важно
У хедері головної сторінки
- контактний телефон гарячої лінії
- кнопка швидкої подачі заяви
- карта для переходу на регіональний сайт.
Дуже важливо
|
Мета більшості користувачів – подать заяву.
|
Ці елементи дублюються в нижній частині сайту. Також у футері:
|
Імідж поліції та довіра українців: забезпечуємо приємним UI
Дизайн розроблено згідно Guideline нової поліції. Він містить ті ж стилі, кольори та шрифтові пари, які присутні на всіх знаках відмінності, бордах і документах.
Основа естетики нового дизайну – простота й лаконічність. Для покращення сприйняття інформації використовується мікроанімація. Важливі текстові блоки оптимізовані й подані у вигляді інфографіки.
Архітектурне рішення UI дозволяє ергономічно розташувати величезну кількість статей, новин, фото/відео матеріалів. Це легко консолідує новини з 24 регіонів у новинну стрічку головного сайту.
У стрічці новин у порівнянні з попередньою версією додані:
- категорії новин
- пошук по даті
- підказки у вигляді тегів
- іконки, які вказують на наявність фото/відео матеріалів у статті.
ТЕХ-СТЕК
- Open source CMS + multidomain modules
- MySQL
- NodeJS
- Gulp
ЮЗАБІЛІТІ АУДИТ - UX, ПЕРЕВІРЕНИЙ ЛЮДЬМИ
Команді Evergreen удалося створити простий і зручний сайт для 3-х категорій користувачів:
Кожен пункт меню було затверджено й перевірено на зручність відповідним департаментом. Меню та вся навігація сайта кілька разів тестувалась на користувачах і покращувалась.
Основні тести та їхні результати:
Чи легко знайти сайт поліції в іншій області
Завдання: знайти сайт поліції в Вінницькій області. Історія пошуку по клікам:
Будь-який із цих варіантів приводить до потрібного посилання.
Висновок: проблем зі знаходженням сайта іншої області не знайдено.
Чи зрозуміло як написати скаргу на поліцейського
Завдання: “Ви хочете поскаржитися на поліцейського, написавши заяву просто на сайті. Ваші кроки…”
Результат: за результатами кліків у відкритому меню стовпчик “Звернення” було перенесено в ліву частину екрану, оскільки читати пункти меню починають зліва направо. Цей пункт дуже важливий, відповідно, він має пріоритетність у розташуванні.
Опитування дало нам розуміння, що назва розділу в попередній версії “Звернення громадян” сприймалась користувачами невірно. Вони припускали, що це – текстова сторінка з законами. Пункт було перейменовано на “Подати звернення”. Ця назва зрозуміла й містить у собі заклик до дії.
Як повернутися на головний сайт поліції
Завдання: повернутися з регіонального на головний сайт поліції.
Висновок: жодних ускладнень не виявлено
Чи можна звести нанівець зусилля розробників UX некоректним внесенням контенту?
P.S. Після здачі проекту працівники прес-служби, які не мали досвіду роботи з новим сайтом, розмістили інформацію в тому вигляді, в якому вона була розміщена в попередній версії. У результаті було порушено дизайн сайту і утруднене його функціонування. Команда Evergreen провела з працівниками прес-служби інструктажі та тренінги по наповненню сторінок. На сьогоднішній день є недопрацьовані моменти, але в цілому сайт виглядає практично так, як було задумано дизайнерами.
Ми надаємо консультативну підтримку прес-службі НПУ і раді, що наша співпраця допомагає підтримувати і розвивати сайт.
У наступному проекті ми реалізували для сайту Національної Поліції версію для слабозорих. Про це – у кейсі “Адаптація сайту для людей із вадами зору“
Потрібно створити масштабний портал або сайт зі складною архітектурою? Структурувати велику кількість розділів? Або ви бажаєте мобільне управління сайтом прямо з телефону? Пишіть, ми можемо це, і багато іншого.