Як робився класний редизайн сайту Одеської облдержадміністрації

Минулого тижня DesignTalk.club розповідав про класний ребрединг сайту Одеської облдержадміністрації. Наша новина викликала неабиякий резонас, і тому ми вирішили поспілкуватися із дизайнером, який доклав рук до цього приємного перетворення 😉

Отже, зустрічайте наше інтерв’ю з Марією Зайцевоюдизайнером продуктів Kitsoft, компанії яка займалася редизайном вищезазначенного сайту.

Як взагалі з’явилася ідея для такої перебудови сайту?

Ми розпочали співпрацю з Одеською ОДА три місяці тому. Голова адміністрації поставив перед нами завдання розробити сучасний та корисний для мешканців Одещини портал, який буде не тільки інформативним, але й дозволить налагодити двосторонню комунікацію між обласною адміністрацією та громадянами.

По-перше, ми вивчили досвід розвинених зарубіжних міст і переконались: найкращі ресурси ставлять за мету допомогти користувачам у вирішенні їх проблем замість хизування успіхами влади. Серед вдалих прикладів – Барселона, Амстердам та Лондон, але справжнім взірцем став Манчестер.

Далі, ми проаналізували запити, які надходять в якості звернень громадян до обладміністрації та гугл-аналітику, щоб дізнатись, якими питаннями мешканці області переймаються найбільше. Виявилось, що людей цікавлять досить звичайні та поширенні запитання, наприклад, які тарифи по будинку або яким чином зареєструвати земельну ділянку.

Щоб відповісти на такі питання, ми поділили портал на 16 розділів, що охоплюють основні сфери життя. Окрім авторських текстів, які готувала команда копірайтерів разом зі спеціалістами ОДА, на порталі розміщено багато посилань на інші корисні ресурси, які стануть у нагоді мешканцям. Ідея порталу – стати своєрідним інформаційним хабом, довідником.

Окрім статей та посилань, ми реалізували зручний принцип подання динамічної інформації: новини, події, офіційні документи тощо позначаються відповідними тегами та формують хронологічні стрічки по кожній темі.

Ми помітили що багато уваги приділяється активній двосторонній комунікації “влада-громадяни”

Так, власне окрім інформаційного порталу, створено низку інструментів для активної комунікації. Так, сервіс звернень громадян дозволяє надавати скарги та пропозиції в електронному вигляді, відслідковувати виконання і отримувати відповідь.

Також запущено важливий інструмент електронної демократії –  сервіс колективних звернень, аналогічний петиціям, які будуть розглядатись, якщо наберуть 1000 голосів. Ми маємо досвід розробки та просування такого ресурсу в Києві – він найуспішніший серед аналогічних проектів.

Ще один важливий інструмент – інформування про події в області: громадяни отримуватимуть повідомлення у вигляді смс та емейлів згідно зі своїми вподобаннями.

Усі сервіси інтегруються в єдиний особистий кабінет з єдиним аккаунтом. Згідно сучасних тенденцій, авторизуватись можна не тільки за логіном та паролем, а й за допомогою соціальних мереж. Для деяких сервісів передбачено посилену авторизацію через електронний цифровий ключ або BankID.

Які були особливості цього процесу?

Головне, завдяки чому цей проект успішно стартував – це рішучість керівництва ОДА, бажання створювати нове, якісне та сучасне. Обговорення та затвердження кожного етапу роботи проходило дуже конструктивно, що дозволило вкластися у мінімальні строки.

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

Розкажіть більше про особливости дизайну для такого замовника

Дизайн державних ресурсів також має свої особливості, адже цільова аудиторія дуже широка і має різний рівень користувацького досвіду. Ключовими принципами стали зрозумілість усіх елементів, простота використання на будь-яких пристроях та акцент на вмісті. На порталі відсутні фотографії, миготливі банери, а в шапці передбачено перехід на висококонтрастну версію для людей з вадами зору.

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

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

Ми прагнемо говорити з користувачами простою, доступною мовою, лаконічно та інформативно. Саме тому, наприклад, замість назви “Житлово-комунальне господарство” розділ називається “Будинок та комунальні послуги”, замість “Транспортна інфраструктура” – “Дороги, порти та транспорт” тощо.

Як довго тривала реалізація всіх дизайнерських задумок?

Звісно, Одеській області личать морські кольори, тому вибір кольорової гами не викликав суперечок. Щодо мінімалістичного та легкого стилю всі сторони також одразу дійшли згоди. В цілому, процес дизайну та вдосконалення інтерфейсу тривав паралельно із розробкою протягом усього проекту.

Які цікаві історії трапилися під час цього?

Цікавим є те, що за навесні ми реалізували аналогічний інформаційно-сервісний портал для Київської міської державної адміністрації, який наразі проходить обговорення в колі експертної групи.

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

Але це вже інша історія! 😉

One Comment

  1. Елена

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

Залишити відповідь