Ui Design

Визуализация на данни - най-добри практики и основи

„Претрупаността и объркването не са атрибути на данните - те са недостатъци на дизайна.“ - Едуард Туфте

Какво е визуализация на данни?

Майкъл приятелски определя визуализацията на данните „като информация, която е била абстрахирана в някаква схематична форма, включително атрибути или променливи за единиците информация.“ С други думи, това е последователен начин за визуална комуникация на количествено съдържание. В зависимост от атрибутите си данните могат да бъдат представени по много различни начини, като линейна графика, стълбовидна диаграма, кръгова диаграма, разпръснат парцел или карта.

c++ заглавка и изходни файлове

Важно е за графични дизайнери да се придържате към най-добрите практики за визуализация на данни и да определите най-добрия начин за визуално представяне на набор от данни. Визуализациите на данни трябва да бъдат полезни, привлекателни и визуално никога не подвежда . Особено при работа с много големи набори от данни, разработването на сплотен формат е жизненоважно за създаването на визуализации, които са едновременно полезни и привлекателни за визуално.

Показването на данни визуално улеснява разбирането в този пример за най-добра практика за визуализация на данни

Wall Street Journal визуализация на данни за цифрите за безработица в САЩ. (от WSJ )

Защо да използвам визуализация на данни

Според IBM , Всеки ден се създават 2,5 квинтилионни байта данни. The Ученият Андрю Макафи и професор Ерик Бриньолфсон от MIT посочват, че „повече данни пресичат интернет всяка секунда, отколкото са били съхранявани в целия интернет само преди 20 години.“

Тъй като светът става все по-свързан с нарастващия брой електронни устройства, обемът на данните ще продължи да нараства експоненциално. IDC прогнозира, че ще има 163 зетабайта (163 трилиона гигабайта) данни до 2025 г.

Всички тези данни са трудни за разбиране от човешкия мозък - всъщност е трудно за човешкия мозък да ги разбере числа по-големи от пет без да се прави някаква аналогия или абстракция. Дизайнери за визуализация на данни може да играе жизненоважна роля при създаването на тези абстракции.

В крайна сметка големите данни са безполезни, ако не могат да бъдат разбрани и консумирани по полезен начин. Ето защо визуализацията на данните играе важна роля във всичко - от икономиката до науката и технологиите, до здравеопазването и човешките услуги. Чрез превръщането на сложни числа и друга информация в графики, съдържанието става по-лесно за разбиране и използване.

Визуалните диаграми са особено полезни при дизайна на таблото

Кога да го използвате

Тъй като големият брой е толкова труден за разбиране по някакъв смислен начин и много от най-полезните набори от данни съдържат огромни количества ценни данни, визуализацията на данните се превърна в жизненоважен ресурс за взимащите решения. За да се възползват от всички тези данни, много фирми виждат стойността на визуализациите на данните в ясното и ефективно разбиране на важна информация, което позволява на вземащите решения да разбират трудни концепции, да идентифицират нови модели и да получат данни, управлявани от данните, за да направят по-добри решения.

Струва си да се харчат ресурси дизайнерски решения за визуализация на данни . Разбирането на големи масиви от данни е необходимо за вземане на информирано решение - било то в бизнеса, технологиите, науката или друга област. Ясните визуализации правят сложните данни по-лесни за разбиране и следователно по-лесни за предприемане на действия.

Най-добри практики за визуализация на данни за потребителски приложения

Принципи

Определете ясна цел

Визуализацията на данните трябва да отговори на жизненоважни стратегически въпроси, да осигури реална стойност и да помогне за решаването на реални проблеми. Може да се използва например за проследяване на ефективността, наблюдение на поведението на клиентите и измерване на ефективността на процесите. Отделянето на време в началото на проект за визуализация на данни за ясно определяне на целта и приоритетите ще направи крайния резултат по-полезен и ще предотврати загубата на време за създаване на визуални изображения, които са ненужни.

Познайте публиката

Визуализацията на данни е безполезна, ако не е предназначена да комуникира ясно с целевата аудитория. Той трябва да е съвместим с експертния опит на аудиторията и да позволява на зрителите да преглеждат и обработват данни лесно и бързо. Вземете под внимание доколко аудиторията е запозната с основните принципи, представени от данните, както и дали има вероятност да имат предистория в STEM полета, където диаграмите и графиките са по-склонни да се гледат редовно.

Искаха американски дизайнери на свободна практика на свободна практика, базирани в САЩ

Използвайте визуални функции, за да показвате данните правилно

Има толкова много различни видове диаграми. Решението кой тип е най-подходящ за визуализиране на представените данни е изкуство за себе си. Правилната диаграма не само ще направи данните по-лесни за разбиране, но и ще ги представи в най-точната светлина. За да направите правилния избор, помислете какъв тип данни трябва да предадете и на кого се предават.

Ето най-популярните видове диаграми за визуализация на данни:

Линейни диаграми: Линейните диаграми трябва да се използват за сравняване на стойностите във времето и са отлични за показване както на големи, така и на малки промени. Те могат да се използват и за сравняване на промените с повече от една група данни.

Линейните диаграми са пример за добри техники за визуализация на данни

(Източник: UNEP )

Бар диаграми: Стълбовидните диаграми трябва да се използват за сравняване на количествени данни от няколко категории. Те могат да се използват и за проследяване на промените във времето, но най-добре се използват само когато тези промени са значителни.

Стълбовите диаграми са добър начин за визуално представяне на определени данни

(Източник: Нашият свят в данните )

Скатерни парцели: Разпръснатите графики трябва да се използват за показване на стойности за две променливи за набор от данни. Те са отлични за изследване на връзките между двата комплекта.

партньорски срещу корпоративни данъчни предимства

Най-добри практики за визуализация на данни от разпръснати диаграми

(Източник: Нашият свят в данните )

Кръгови диаграми: Кръговите диаграми трябва да се използват за показване на части от едно цяло. Те не могат да показват неща като промени с течение на времето.

Кръговите диаграми са чудесни за дизайн на визуализация на данни.

Поддържайте го организирано и последователно

Съгласуваността е особено важна при компилиране на голям набор от данни във визуализация. Кохерентният дизайн ефективно ще изчезне на заден план, което ще позволи на потребителите лесно да обработват информация. Най-добрите визуализации помагат на зрителите да стигнат до заключения относно представяните данни, без да са „в лицето си“ или да привличат по друг начин вниманието върху себе си. Те просто показват данните по най-добрия възможен начин.

Създаването на йерархия от данни показва различните точки от данни по подходящ начин за вземащите решения. Можете да сортирате от най-високо до най-ниско, за да подчертаете най-големите стойности или да покажете категория, която е по-важна за потребителите по виден начин.

Дори реда, в който се показват данните, използваните цветове (като по-ярки цветове за най-важните точки или сивото за базовите данни) и размера на различни елементи на диаграма (като разширяване на определени филийки на кръгова диаграма отвъд правилната граница на диаграмата) може да помогне на потребителите да интерпретират данните по-лесно. Пазете се от създаване на пристрастия там, където не трябва да има такива, когато използвате тези техники.

Най-добри практики за интерактивна визуализация на данни

Интерактивните визуализации на данни също са отличен начин да помогнете на хората да интерпретират данните.

Направете визуализацията на данните включваща

Цвят се използва широко като начин за представяне и диференциране на информация. Според скорошно проучване, проведено от Salesforce , той също е ключов фактор за решенията на потребителите.

в повечето случаи това не трябва да се включва, защото заобикаля много важна функция за сигурност.

Те анализираха как хората реагираха на различни цветови комбинации, използвани в диаграмите, предполагайки, че ще имат по-силни предпочитания към палитри, които имат фини цветови вариации, тъй като това би било по-привлекателно от естетическа гледна точка.

Те обаче откриха, че макар и привлекателни, фините палитри правят графиките по-трудни за анализ и получаване на прозрения. Това напълно унищожава целта на създаването на визуализация за показване на данни.

Абонирайте се за блога за дизайн на ApeeScape и получете нашата електронна книга

Ако диаграмите с подобни цветове - и по-малко контраст - са трудни за четене за обикновения човек, те са още по-трудни за хора, които нямат перфектна визия - и те представляват значителна част от населението. Според СЗО около 253 милиона души живеят с влошаване на зрението .

За щастие има налични инструменти за проверка как дадено изображение ще се визуализира от хора с тези увреждания, като например проверка на цветна слепота във Photoshop и Илюстратор . Други неща като използването на достатъчно големи размери на шрифта и адекватен контраст между типа и фона също са полезни.

Ако инструментите за симулация разкрият проблеми с цветовата палитра, има техники, които могат да подобрят четливостта на графиката:

Използвайте цветове с висок контраст.
Допълнете използването на цвят с шарка или текстура, за да предадете различни видове информация.
Използвайте текст или икони за етикетиране на елементи.

Чудесен пример за добри цветови комбинации при визуализация на данни

Дори когато визуализацията на данни използва мащабен модел, е възможно да се използва достатъчен цветен контраст между всяка стъпка. Интерактивната версия на тази графика включва етикети, когато потребителите прелитат над всяка държава. (Източник: Нашият свят в данните )

Изборът на шрифт може да повлияе на четливостта на текста, да подобри или отклони предвиденото значение. Поради това е по-добре да избягвате дисплейните шрифтове и да се придържате към по-елементарни шрифтове със серифи или без серифи.

Уверете се, че визуализацията на данните има четлив размер на шрифта за носителя си. Smashing Magazine предлага „16 пиксела по принцип трябва да са минималният размер на основния текст в съвременния уеб дизайн.“

Не изкривявайте данните

Страхотната визуализация на данни трябва да разказва историята ясно, като се избягват изкривявания. Избягвайте използването на визуални изображения, които не представят точно набора от данни, като кръгови диаграми в 3D.

Лош дизайн за визуализация на данни

3D кръгови диаграми като тази затрудняват действителното визуализиране на пропорциите на всеки парче. (от PSDграфика )

се нарича неефективността, създадена от все повече хора, работещи заедно

Визуализациите на данни могат да доведат зрителите до определени заключения, без да изкривяват самите данни. Това може да бъде особено полезно при проектирането на неща като инфографика за обществено потребление, обикновено създадена в подкрепа на конкретно заключение, а не просто за предаване на данни. Неща като избор на цвят и извикване на конкретни точки от данни могат да бъдат използвани за тази цел, без да се създават подвеждащи графики (което потенциално би могло да постави под въпрос достоверността на дизайнера).

Примери за лоши визуализации на данни

Пример за лош дизайн на визуализация на данни

Не стартирането на оста Y на нула може да накара данните да изглеждат с по-големи печалби, отколкото са в действителност. Това прави визуализацията подвеждаща и не изяснява представените данни.

Подвеждащ пример за визуализация на данни

Друг пример за диаграма, която не стартира оста Y на нула, изкривявайки начина, по който се показват резултатите.

Пример за лоша комбинация от цвят и мащаб при лоша визуализация на данни

Тази стълбовидна диаграма на основна марка е подвеждаща по мащаб, тъй като няма ос Y. Въпреки че има само малка разлика по-малка от 1%, голямата синя лента се увеличава непропорционално.

Подвеждащ пример за визуализация на данни за 70% увеличение на живота на батерията

Когато Apple се опита да илюстрира, че новата батерия на iPad има 70% по-дълъг живот на батерията, те увеличиха височината със 70%, но и общия мащаб, което направи батерията да изглежда значително по-голяма от батерията на предишния iPad. (чрез Gizmodo )

Примери за добри визуализации на данни

Добрите цветови комбинации включват достатъчен цветен контраст при тази визуализация на данните

Стълбовидна диаграма като тази е фантастичен начин за показване на разлики между наборите от данни, въпреки че повишеният цветен контраст би направил това изображение по-достъпно за потребители с увредено зрение. (от Петдесет и тридесет и двадесет )

Представянето на данни визуално може да направи таблата по-лесни за разбиране

Това табло за продажби използва няколко различни формата за визуализация, за да представи съответните данни в лесни за разбиране формати, които имат смисъл само с един поглед. Данните също са добре обозначени, допълнително изясняват нещата. (от Добър Фикри )

Пример за табло за добра визуализация на данни

Комбинирането на изчистен, претрупан дизайн с лесна за интерпретация визуализация на данни с прости диаграми прави страхотен UX. (от Miklos Philips )

Google Audience Insights е добър пример за най-добрите практики за интерактивно визуализиране на данни

Audience Insights на Google се справя добре със своя интерактивен пакет за анализ на данни, което прави данните лесно разбираеми.

Заключение

Добрата визуализация на данните трябва да съобщава набора от данни ясно и ефективно чрез използване на графики. Най-добрите визуализации улесняват разбирането на данни с един поглед. Те вземат сложна информация и я разбиват по начин, който улеснява разбирането на целевата аудитория и въз основа на която да вземат решения.

Както отбеляза Едуард Р. Туфте, „основният тест на дизайна е колко добре подпомага разбирането на съдържанието, а не колко стилно е то“. Визуализациите на данни, особено, трябва да се придържат към тази идея. Целта е да се подобрят данните чрез проектиране, а не да се привлича вниманието към самия дизайн.

Като се имат предвид тези най-добри практики за визуализация на данни опростява процеса на проектиране на инфографики, които са наистина полезни за тяхната аудитория.

•••

Допълнителна информация:

Разбиране на основите

Какво е визуализация на данните и защо е важно?

Визуализацията на данни е вид визуална комуникация, която осигурява последователен начин за представяне на количествено съдържание, включително големи масиви от данни. Това прави сложните данни по-достъпни и по-лесни за разбиране и използване.

Какво означава цветовете да контрастират?

Контрастните цветове имат значителна разлика в яркостта или оттенъка, което ги прави различими един от друг. Например, бялото и черното са в противоположните краища на спектъра на яркост и следователно са с висок контраст. Синьото и оранжевото са от противоположните страни на цветното колело и освен това имат висок контраст.

Защо цветовият контраст е важен в мрежата?

Достатъчният цветен контраст в мрежата улеснява потребителите да различават обекти или елементи на дизайна, подобрявайки потребителското изживяване. Адекватният цветен контраст също е от ключово значение за създаването на уебсайтове, достъпни за потребители с увредено зрение.