Vizualizace dat ve webovém designu: 12 úžasných příkladů
Data, data, všude. Ale co s tím uděláš? Dnes jsme shromáždili 12 ohromujících příkladů vizualizace dat v designu webových stránek, abychom mohli začít přemýšlet o tom, jak pracovat s daty.
Žijeme v době, kdy schopnost předvádět data novými a zajímavými způsoby může být pro designéry obrovským přínosem.
Ať už máte rozsáhlou sbírku čísel nebo jen informace, které chcete předvést, tento styl designu může být skvělým nástrojem v sadě.
Prozkoumejte prvky Envato
1. Historie NFL
S desetiletími dat pokrývajících 32 týmů je v NFL k dispozici spousta informací o hrách. FiveThirtyEight to vše vařilo do řady interaktivních grafů, které si můžete prohlédnout týmem a uvidíte přílivy a toky fotbalové historie.
Nejlepší věc na této vizualizaci dat je, že je super jednoduchá. Řádky ukazují výhry a ztráty. S klikáním a vznášením se však data dostanou k životu: Můžete získat skóre, data a záznamy pro každou jednotlivou hru překrytou na mapě průměrů pro celou ligu. (Takže můžete vidět, zda je váš tým před nebo za smečkou.)
2. Selfiecity
Selfies jsou víc než jen zábavná sada fotografií. Selfiecity využívá multimediální vizualizace k sestavení tisíců fotografií k nalezení demografických informací o lidech, kteří je pořizují.
Co je v pohodě na této sadě dat je, že i když je vše vizuální - tisíce fotografií - můžete začít vidět vzory, jako je styl selfie, který lidé pořizují na různých místech, ať už ženy nebo muži pořizují více fotografií a věk selfie- odběratelé. I když zde jsou nějaké statistiky a čísla, tato data jsou vykreslena pomocí fotografií v obří mřížce.
3. Největší slovní zásoba v hip hopu
Tento projekt ThePudding ukazuje, že data nemusí být vždy očíslovaná. Analyzuje počet jedinečných slov používaných v hip hopových textech a vykresluje největší slovníky podle počtu slov s obrázky umělce.
Funguje to takto: „Srovnává počet jedinečných slov používaných některými z nejznámějších umělců v hip hopu (to je příklad kvantitativního pohledu na lyricismus, jakmile jej navrhl Tahir Hemphill). Použil jsem prvních 35 000 textů každého umělce. Tímto způsobem lze plodné umělce, jako je Jay-Z, srovnávat s novějšími umělci, jako je Drake. “
Jednoduchý černobílý design vykresleného grafu je vizuálně zajímavý a umožňuje snadno zjistit, kteří umělci jsou před smečkou. (Nebo můžete použít interaktivnější nástroje a hledat konkrétní umělce.) Můžete také třídit podle doby, přičemž dva tisíce let byly nejvíce lyricky robustní.
4. Nakupujte rok v recenzi
Koření sadu ročních dat s webem zakořeněným v tom, aby bylo vše vizuální. Shopify's 2016 in Review je kolekce dat výroční zprávy ve snadno čitelném balíčku.
Stránka se posouvá v blocích podobných stránkám s informacemi a informacemi. Vizualizace stylu časové osy se posouvá hlouběji do propojení s grafy a dalšími číselnými grafy. Tento web ukazuje, že i s mnoha čísly můžete vytvořit něco úžasného a trendy.
5. Denní rutiny slavných kreativních lidí
Nenechte se zmást do myšlení baru nebo liniové grafy jsou nudné. Tato úžasná sada řádků ukazuje skvělá data, která ukazují, jak někteří docela slavní tvůrci strávili své dny. (A tam je spousta jídla a volného času.)
To, co tuto vizualizaci dat funguje, je barva. Každá řádka znamená něco. Každá barva kontrastuje s barvami kolem ní, takže každý kousek informací je snadno vidět a pochopitelný.
6. Propadávání mezerou
Tato interaktivní vizualizace dat z BBC je skvělá. Sada animovaných změn teček při posouvání zobrazuje na první pohled komplexní informace.
Animace a myšlenka této interaktivní infographic jsou dobře naplánované a provedené.
7. Každé úplné zatmění Slunce
Tato vizualizace dat kombinuje trochu chladného čarodějnictví, animace a vědeckých dat, aby poskytla přizpůsobené informace o tom, kdy (a zda) byste mohli vidět zatmění Slunce.
Začíná vaším rokem narození pro vlastní zprávu. Zde je můj (všimněte si, že datový tah je z roku 2017): „Pokud jste se narodili v roce 1980, jste (nebo budou) 37 letos. Pokud budete žít na 100, za celý život bude na celém světě ještě 43 úplných zatmění Slunce. Mnoho bude po Jižní Americe. Jeden se zatmění nad vodou. “
Data se dále rozšiřují o vysvětlení toho, jak zatmění funguje a cesty pro událost 2017.
8. Vítrová mapa
Kde fouká vítr?
Tato mapa ukazuje rychlosti větru a průměry pro Spojené státy v reálném čase. Údaje o počasí jsou přeneseny do jednoduché černobílé mapy, která ukazuje pohybující se větrné vzorce napříč národem. (Musím přiznat, že sledování animace je docela návykové ... a uklidňující.)
9. Jak se každý člen dostal na kongres
Mapování dat je vyčerpávající a vysoce informativní zážitek. Tato interaktivní datová mapa ukazuje cestu každého kongresmana a kongresmanky v USA
Můžete sledovat vzdělání, zaměstnání a další politické zkušenosti. (Je to docela úžasné, kolik podobných cest existuje.) Ponořte se hlouběji do údajů pohledem a jednotlivými cestami politiků.
10. Největší porušení a hackování dat na světě
Pokud hledáte data, která vypadají skvěle, je dobré začít s Information is Beautiful. Tento kruhový graf vykresluje porušení dat 30 000 nebo více záznamů od roku 2008 do současnosti.
Velikosti kruhů představují, jak velké porušení došlo, a je snadné zjistit, kde se vaše informace mohly zachytit v datovém hacku. Umístěním kurzoru na libovolný kruh získáte další informace o porušení. Design stylu časové osy také ukazuje něco jiného - naprostý nárůst porušení ročně.
11. Proč váš chytrý telefon způsobuje syndrom „textového krku“
Některé z nejlepších vizualizací dat spojují fakta a příběh dohromady, aby poskytovaly úplnější obraz informací. To je případ tohoto průvodce „textovým krkem“.
Malé datové grafy - využívající fakta a čísla - se mísí s animovanými daty, která ukazují změny držení těla, aby ukázaly (neřekly) přesně to, co se děje v tomto jevu, který začal čísly případů „textového krku“. Je to skvělý způsob, jak vizuálně vysvětlit něco, co by jinak nedávalo smysl.
12. Ilustrovaný průvodce po 2 339 úmrtích ve hře „Hra o trůny“
Pomocí ilustrací vytvořte poutavou vizualizaci dat. The Washington Post dokumentoval každou smrt v populární show „Hra o trůny“ pomocí ilustrovaného průvodce.
Ilustrace a kódování ikon zobrazují úmrtí na první pohled pomocí akcí kliknutí, které jdou do ještě podrobnějších detailů. Navíc je vše organizováno podle sezóny (a umístění a typu charakteru, pokud máte zájem). Abychom dokázali, že je to víc než jen zábava, existuje úplná metodologie toho, jak to funguje a co „se počítá“ jako smrt.
Závěr
Využití vizualizace dat je prakticky všude. Žijeme ve věku založeném na údajích, kde jsou lidé přitahováni k informacím a znalostem.
Schopnost vařit velké množství dat do použitelného designu je cenná dovednost, která vám může pomoci v řadě projektů. A pokud jste o to ještě nebyli požádáni, je pravděpodobné, že budete brzy.
