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

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

Аналіз

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

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

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

Концепція

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

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

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

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

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

Реалізація

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

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

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

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

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

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

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

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

Законопроекти винесли на головну сторінку і упорядкували за датою прийняття. 

Інший контент. Сайт парламенту наповнений великою кількістю посилань на сторонні ресурси, різні матеріали та документи, архіви та каталоги, тощо.

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

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

Результат

19 червня 2020 новий дизайн перейшов на основний домен: https://www.rada.gov.ua

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

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

Сергій Щербаков, ВРУ

Корисні посилання

Дизайн-система державних сайтів України

Урядовий портал