Andmete visualiseerimine veebidisainis: 12 suurepärast näidet
Andmed, andmed, kõikjal. Aga mida sa sellega teed? Täna oleme kokku kogunud 12 hämmastavat näidet veebisaidi kujunduse andmete visualiseerimisest, et alustada mõttega, kuidas andmetega töötada.
Me elame ajal, kus võimalus näidata andmeid uuel ja huvitaval viisil võib olla disainerina tohutu eelis.
Ükskõik, kas teil on tohutu numbrikogu või lihtsalt teave, mida soovite tutvustada, võib see kujundusstiil olla teie komplektis suurepärane tööriist.
Uurige Envato elemente
1. NFL-i ajalugu
Kuna aastakümnete pikkune teave hõlmab 32 meeskonda, on NFL-i mängude kohta saadaval palju teavet. FiveThirtyEight pani selle kõik kokku interaktiivseteks graafikuteks, mida saate meeskondade kaupa vaadata, et näha jalgpalliajaloo eboobe ja vooge.
Parim asi selle andmete visualiseerimise juures on see, et see on ülilihtne. Ridad näitavad võite ja kaotusi. Kuid klõpsude ja hõljumitega elavneb teave: saate kogu liiga keskmiste kaartide kattega mängude kohta punkte, kuupäevi ja kirjeid iga mängu kohta. (Nii et näete, kas teie meeskond on pakist ees või taga.)
2. Iseeneslikkus
Selfid on midagi enamat kui lihtsalt lõbus fotode komplekt. Selfiecity kasutab rikasmeedia visuaale, et koondada tuhandeid fotosid, et leida demograafilist teavet inimeste kohta, kes neid pildistavad.
Mis on selle andmestiku jaoks lahe, on see, et kuigi see on kõik visuaalne - tuhandeid fotosid -, võite hakata nägema mustreid, näiteks selfie-stiili, mida inimesed eri kohtades teevad, kas naised või mehed teevad rohkem fotosid ja selfie-vanus võtjad. Ehkki siin on statistikat ja numbreid, joonistatakse need andmed hiiglaslikus ruudus olevate fotode abil.
3. Suurim sõnavara hiphopis
See ThePuddingi projekt näitab, et andmeid ei pea alati nummerdama. See analüüsib hiphop-sõnades kasutatavate ainulaadsete sõnade arvu ja joonistab kõige suuremad sõnavarad sõnade arvu järgi koos kunstniku piltidega.
Kuidas see töötab: „See võrdleb hiphopis mõne kuulsama kunstniku kasutatud ainulaadsete sõnade arvu (see on näide lüürilisuse kvantitatiivsest vaatenurgast, mille on kunagi välja pakkunud Tahir Hemphill). Kasutasin iga artisti esimest 35 000 laulusõna. Nii saab viljakaid kunstnikke, näiteks Jay-Z, võrrelda uuemate kunstnikega, näiteks Drake. ”
Joonistatud graafiku lihtne mustvalge kujundus on visuaalselt huvitav ja võimaldab hõlpsalt näha, millised kunstnikud on pakist ees. (Või võite kasutada interaktiivsemaid tööriistu ja otsida konkreetseid kunstnikke.) Saate sortida ka ajastu järgi, kusjuures 2000ndad on lüüriliselt kõige jõulisemad.
4. Shopify aasta ülevaade
Vürtsitage iga-aastaste andmete kogumit veebisaidiga, mille juurutamine muudab selle kõik visuaalseks. Shopify 2016. aasta ülevaade on majandusaasta aruande andmete kogumik hõlpsasti loetavas pakendis.
Sait kerib lehetaoliste plokkidena koos faktide ja teabega. Ajaskaala stiili visualiseerimine kerib sügavamale linkideks graafikute ja muude numbriliste diagrammidega. See sait näitab, et isegi paljude numbrite korral saate luua midagi uimastavat ja trendikat.
5. Kuulsate loomeinimeste igapäevane rutiin
Ärge laske end petta mõtlemisribale või joonekaardid on igavad. See hämmastav ridade komplekt näitab lahedaid andmeid, mis näitavad, kuidas mõni päris kuulus looja oma päevi veetis. (Ja seal on palju toitu ja vaba aega.)
Mis paneb selle andmete visualiseerimise toimima, on värv. Iga rida tähendab midagi. Kõik värvid on teravalt kontrastiks ümbritsevate värvidega, nii et igasugune teave on hõlpsasti nähtav ja arusaadav.
6. Lünga läbi kukkumine
See interaktiivne andmete visualiseerimine BBC-st on hiilgav. Animeeritud punktide komplekt kerimistoimingus näitab lühidalt keerulist teavet.
Selle interaktiivse infograafika animatsioonid ja idee on hästi kavandatud ja teostatud.
7. Iga päikesevarjutuse täielik juhtumine
Selles andmete visualiseerimises on segatud pisut lahedaid nõustamisi, animatsioone ja teaduslikke andmeid, et saada kohandatud teavet selle kohta, millal (ja kui) võite päikesevarjutust näha.
Kohandatud aruande jaoks algab see teie sünniaastaga. Siin on minu oma (pange tähele, et andmed on pärit aastast 2017): “Kui olete sündinud 1980. aastal, olete (või saate) sel aastal 37-aastane. Kui elate 100-aastaseks, on teie elu jooksul kogu maailmas veel 43 päikesevarjutust. Paljud on Lõuna-Ameerika kohal. Üks varjab ainult veega. ”
Andmed laienevad veelgi selgitusteks, kuidas eclipse töötab ja mis kulgeb 2017. aasta sündmuse jaoks.
8. Tuulekaart
Kus tuul puhub?
See kaart näitab Ameerika Ühendriikide reaalajas tuule kiirust ja keskmisi väärtusi. Ilmaandmed kantakse lihtsasse must-valgesse kaarti, mis näitab liikuvaid tuuleharjumusi kogu rahvas. (Pean tunnistama, lihtsalt animatsiooni vaatamine on päris sõltuvust tekitav ... ja rahustav.)
9. Kuidas sai iga liige kongressile
Andmete kaardistamine on ammendav ja väga informatiivne kogemus. Sellel interaktiivsel andmekaardil on näidatud iga USA kongressi liikme ja kongresmendi tee
Saate jälgida haridust, töökohti ja muid poliitilisi kogemusi. (See on omamoodi hämmastav, kui palju sarnaseid teid on.) Poliitikute otsimise ja üksikute radade kaudu sukelduge andmetesse sügavamale.
10. Maailma suurimad andmerikkumised ja häkked
Kui otsite suurepärase väljanägemisega andmeid, on teabe alustamiseks hea teave. See ringdiagramm kajastab andmete rikkumisi alates 2008. aastast kuni tänapäevani vähemalt 30 000 kirjet.
Suhtlusringide suurused tähistavad rikkumiste ulatust ja on lihtne aru saada, kuhu teie teave on sattunud. Hõljutage rikkumise kohta kursorit ükskõik millise ringi kohal. Ajaskaala stiilikujundus näitab ka midagi muud - rikkumiste järsk suurenemine igal aastal.
11. Miks põhjustab teie nutitelefon teile tekstikaela sündroomi
Mõned parimatest andmete visualiseerimistest koondavad faktid ja loo kokku, et saada teabe terviklikum pilt. Nii on ka selle teksti kaela juhendi puhul.
Väikesed andmehulgad - kasutades fakte ja numbreid - segatakse animeeritud andmetega, mis näitavad kehahoiakumuutusi, et näidata (mitte öelda) täpselt, mis toimub selles nähtuses, mis algas arvukate „teksti kaela” juhtudega. See on suurepärane võimalus seletada visuaalselt midagi, mis võib-olla pole muidu eriti mõistlik.
12. „Troonide mängu” 2339 surmajuhtumi illustreeritud juhend
Kasutage illustratsioone ka kaasahaarava andmete visualiseerimiseks. Washington Post dokumenteeris iga surma populaarses saates “Troonide mäng” illustreeritud juhendiga.
Illustratsioonid ja ikoonide kodeerimine näitavad surmajuhtumeid ühe nupuvajutusega, mis lähevad veelgi üksikasjalikumaks. Lisaks on kõik korraldatud vastavalt aastaajale (kui olete huvitatud, siis asukoha ja tegelase tüübi järgi). Selle tõestuseks, et see pole midagi enamat kui lihtsalt lõbus, on olemas täielik metoodika, kuidas see toimib ja mis surmaga „arvestatakse“.
Järeldus
Andmete visualiseerimist kasutatakse praktiliselt kõikjal. Me elame andmekesksel ajastul, kus inimesi tõmbab ligi teave ja teadmised.
Suutlikkus keerata suures koguses andmeid kasutatavaks kujunduseks on väärtuslik oskus, mis aitab teid mitmetes projektides. Ja kui teil pole seda veel palutud, on tõenäoline, et olete varsti.
