Деякі ідеї щодо покращення представлення даних

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

1. Розподіліть дані симетрично при використанні позитивних і негативних значень

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

Приклад : Розміщуйте від’ємні значення ліворуч, а додатні – праворуч від осі ординат під час використання вертикальної гістограми. Щоб уникнути неправильного тлумачення вашого графіка, не розміщуйте додатні та від’ємні значення з однієї сторони осі.

2. Почніть осі сітки з 0 для стовпчастих діаграм

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

3. Припасуйте дані осі Y для лінійних діаграм

На відміну від стовпчастих діаграм, лінійні діаграми потребують спеціальної адаптації. Дійсно, завжди існує ризик зробити цей тип графіка «плоским», коли осі починаються з 0. Лінійні графіки призначені для представлення трендів, і тому важливо, щоб осі були чітко видимими. Для цього значення осей повинні бути адаптовані відповідно до набору даних, щоб крива займала 2⁄3 осі ординат.

4. Використовуйте стовпчасті діаграми під час представлення даних часових рядів

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

5. Зупиніть плавні криві!

Плавні криві, хоч і приємніші для ока, ніж криві з гострими точками, «ховають» за собою реальні числа та можуть спонукати користувача неправильно тлумачити дані.

6. Уникайте двовісних діаграм

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

7. Обмежте кількість частин «кругової діаграми»

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

● Не використовуйте більше 5-7 частин на одній таблиці

● Згрупуйте менші частини в одну та назвіть її «Інші»

8. Розмістіть мітки перед частинами «кругової діаграми».

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

Розміщувати мітки безпосередньо на спільних ресурсах також не дуже гарна ідея, оскільки також може ускладнити читання результатів.

Під час використання кругових діаграм найкращим рішенням є використання чорного шрифту для відображення даних і розміщення його перед відповідними сегментами.

9. Розкладіть скибочки камамбера в порядку убування

Найбільшу частину розмістіть на 12 годині, а наступні в порядку спадання за годинниковою стрілкою.

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

Дослідження не одностайні щодо впливу цього шрифту на пам’ять, тож чи справді це гарна ідея чи ні... продовження буде!

10. Уникайте безладу

Ця рекомендація застосовна майже для всіх типів діаграм. Не сортуйте дані за алфавітом. Розмістіть більше значення у верхній частині сітки (для горизонтальних гістограм) або ліворуч (для вертикальних гістограм). Вищі значення повинні займати більше місця в сітці діаграми. Ця техніка полягає в тому, щоб зробити рухи очей більш плавними та скоротити час, необхідний для читання результатів.

11. Зверніть увагу на поля круглої діаграми

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

12. Виберіть палітру кольорів, яка правильно відображає ваші дані

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

Якісний : ця колірна палітра має влучну назву, оскільки вона ідеально підходить для відображення якісних змінних. Обов’язково використовуйте чіткі кольори, щоб забезпечити найкраще сприйняття даних.

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

Розбіжні : це поєднання 2 послідовних палітр з різними колірними відтінками. Його часто використовують для розрізнення позитивних і негативних значень

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

 

 

 


Поліна ХАЙС, UX-дизайнер @UX-Republic


Наші наступні тренування