Верховна Рада України

Проєкт

Новий дизайн сайту для Верховної ради України

Завдання

Створити сучасний дизайн для сайту та поліпшити досвід користувачів

Аналіз

Перед розробкою дизайну ми провели аналіз і виокремили такі факти:

  • На початку року близько 40% українців відвідало існуючий сайт Парламенту з мобільних пристроїв. Це на 130% більше ніж рік тому і з огляду, що стара версія сайту не адаптується до різних пристроїв.
  • Тільки 57% користувачів заходять на сайт через головну сторінку, інші 43% приходять на решту сторінок. Цей показник буде вищим, якщо врахувати суміжні сайти. Це говорить про те, що немає потреби перевантажувати головну сторінку надмірною інформацією.
  • Більш ніж половина користувачів приходять з пошукових сервісів. Натомість переходів через соціальні мережі відносно мало.
  • Близько 300 мільйонів людей мають проблеми з зором, 43% з них страждають порушеннями рефракції (дані ВООЗ за 2010 рік). Відповідно, близько півтора мільйони українців мають порушення зору.

Аналіз головної сторінки старого сайту виявив 51 суттєве порушення принципів доступності відповідно до рекомендацій стандарту WCAG 2.1, крім того ще 86 зауважень та 33 рекомендації згідно з вищезазначеним стандартом.

Концепція

Сайт Верховної Ради України – це зручне першоджерело новин про діяльність законодавчого органу. Дизайн створено відповідно до сучасних технологій та звичок користувачів та 3-ох головних принципів: зручності, актуальності та максимальної інклюзивності:

  • Функціональність – головна сторінка активно відображає роботу парламенту, а решта інформації структурована у відповідні розділи;
  • Адаптивність до мобільних, пошукових алгоритмів та зручність поділитися новиною в соцмережах;
  • Інклюзивність як стандарт. Коли ми кажемо, про інклюзивність, маємо на увазі доступність, повагу, безпеку. Тому у новому дизайні ми подбали про контрастність, розміри, відсутність яскравих елементів.

Ці рішення відповідають стандартам Дизайн-системи для державних сайтів України, яка була затверджена постановою КМУ у 2019 році.

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

〈 Немає бути особливих потреб, а мають бути особливі рішення. Новий дизайн допоможе на сайті забути про особливі потреби 〉

Лигін Артем, Senior Designer

Реалізація

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

На головній сторінці ми сфокусували увагу на перших трьох екранах. З них користувач отримає найважливішу інформацію про роботу парламенту.

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

У стрічці голосувань наочно представлені результати та структура голосування.

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

Блок результатів електронної реєстрації відразу дає зрозуміти, наскільки заповнена парламентська зала.

Календар подій (раніше називався «анонсами»), спроєктований таким чином, щоб він був однаково зручний як на десктопі, так і на мобільних пристроях та технологічно залишався одним елементом інтерфейсу.

Новинний блок розділили на групи:

  1. Топ – до п’яти матеріалів, що розміщені на першому екрані.
  2. «Новини та публікації» – блок з двох головних та 3-4-х інших новин.

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

Інший контент. Сайт парламенту наповнений великою кількістю посилань на сторонні ресурси, різні матеріали та документи, архіви та каталоги, тощо. В старій версій ці посилання містяться у вигляді пунктів та підпунктів навігаційного меню. Це перевантажує сайт та погано впливає на оптимізацію під пошукові сервіси. А головне, в такому вигляді користувачеві складно пояснити контекст та зорієнтувати його.

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

Результат

mportal.rada.gov.ua

Надалі ми будемо аналізувати статистику та поліпшувати досвід користувачів.