Najlepsze przykłady wykorzystania interaktywnych infografik na stronach docelowych. Infografiki: rodzaje, przykłady pracy, przyszłość Jak umierają Amerykanie

W ciągu ostatnich kilku lat infografiki ewoluowały od statycznych obrazów do bogatych interaktywnych doświadczeń z animacjami i filmami dostosowanymi do unikalnych treści. Nie ogranicza się już do gotowych, uniwersalne szablony. A dzisiejsza kompilacja zawiera najlepsze infografiki, które pokazują, jak wygląda ciekawe i pouczające doświadczenie.

Większość infografik na tej liście została wybrana do wyświetlenia różne drogi, z jakim projektanci podchodzą do wizualizacji danych. Jednak jest tu również kilka hybryd, ilustrujących zacieranie się granic między infografikami a bogatymi doświadczeniami multimedialnymi przy jednoczesnym tworzeniu angażujących treści i fascynujących historii na stronach docelowych. Odejście od tradycyjnych form oznacza, że ​​wkraczamy na bardziej wyrafinowane terytorium mediów i to właśnie tego rodzaju eksperymenty z technologią i narracją będą miały kluczowe znaczenie dla kształtowania przyszłości projektowania graficznego.

1. Mapa wiatrów

Mapa wiatru to zapierający dech w piersiach projekt, który pokazuje kierunek i prędkość wiatru nad Stanami Zjednoczonymi. Ten projekt ma raczej cel artystyczny niż użytkowy, co jest świetne: bardzo miło jest po prostu usiąść i patrzeć, jak cienkie, cienkie nici owijają się wokół mapy. Prosty, ale dobrze przemyślany przykład tego, jak infografika pokazująca ścieżki kształtów może skorzystać z animacji i ruchomych obrazów.

2. W locie

W 2014 roku The Guardian uruchomił infografikę In Flight, pokazującą dane lotów komercyjnych w czasie rzeczywistym (wydaje się, że nie jest teraz aktualizowana, a szkoda), a także lekcję historii lotnictwa. Ciche rozmowy między załogami samolotów na początku interaktywnego pokazu tworzą wyjątkową atmosferę. Wygląda na to, że infografiki powoli zamieniają się w kinowe wrażenia. Przynajmniej „W locie” wskazuje w tym kierunku…

3. Wybierz Księżyc

Niewiele dzieje się w infografice Dial A Moon, ale całkiem dobrze spełnia swoje zadanie. W 2015 roku dzięki NASA infografika faz księżyca była aktualizowana co godzinę i nie można było przejść do Google w poszukiwaniu tej tajemniczej informacji. Teraz możesz przeglądać zdjęcia, ręcznie wprowadzając miesiąc, dzień i godzinę.

4. Dzień z Plutonem

Magazyn Nature publikuje wiele interesujących infografik dla swoich odbiorców o poglądach naukowych. Wśród nich był jeden o słynnym przelocie statku kosmicznego w pobliżu Plutona (24 Hours Of Pluto). Infografika zawierała wiele informacje tekstowe, ale wizualizacje zapewniły łatwe zrozumienie najciekawszych, od struktury planety karłowatej po formowanie się jej księżyców. Teraz w Internecie dostępna jest część tekstowa, a także dwa animowane filmy z infografiki.

5. Jak zmieniły się amerykańskie domy

Wybierz się w podróż przez wielki amerykański sen, odzwierciedlony w ewolucji stylów domu. Ta dobrze ilustrowana infografika pozwala zasiąść za kierownicą samochodu (również zmieniającego się podczas przewijania, aby nadążyć za epoką) i przemieścić się od 1900 do 2000, mijając budynki popularne od dziesięcioleci. Po drodze natkniesz się na wiele przydatnych materiałów (m.in. ówczesne uwarunkowania społeczno-polityczne, a także trendy w modzie), a wszystko kończy się pytaniem, które zachęca do wyobrażenia sobie przyszłości amerykańskiego domu . Infografika Decades Of American Homes jest doskonałym przykładem przewijania w poziomie i idealnie pasuje tutaj.

6. Ewolucja analityki marketingowej

W swojej infografice Evolution of Insight, firma Vision Critical zajmująca się badaniem użytkowników, śledzi ewolucję rynku technologii marketingowych na całym świecie od lat 90. XIX wieku do dnia dzisiejszego. Działa podobnie do infografiki How American Homes Changed, a tym samym pozwala porównać efektywność wykorzystania interaktywnej osi czasu dla dwóch bardzo różnych historii. Infografika Decades Of American Homes ma tę zaletę, że przeglądanie domów podczas jazdy jest znacznie bardziej intuicyjne niż przeglądanie świetnych amerykańskich analiz. Dobre infografiki powstają wokół treści, a nie wokół niej.

7. Prawa społeczności LGBT na świecie

The Guardian zajmuje kolejne miejsce na naszej liście z tą elegancką infografiką wyjaśniającą sytuację prawną dotyczącą praw LGBT w szeregu kwestii (małżeństwo, dyskryminacja w miejscu pracy, przestępstwa z nienawiści itp.) w każdym kraju na świecie. Poruszanie się po półokręgu zapewnia szybki i łatwy sposób porównywania statystyk z różnych krajów, a kompozycja infografiki utrzymuje globalny status z przodu iw centrum. Istnieje również potężne wezwanie do działania, które ma na celu wypełnienie luki między zwykłą świadomością a aktywizmem.

8. Nierówność można naprawić

Inny wspaniały przykład interaktywnej infografiki, Nierówność można naprawić, zaprasza widzów do zagłębienia się w problem w bardzo osobisty sposób. Widz ma gwarancję, że nie straci zainteresowania materiałem, który powie mu, ile jego szef płaci za mało i dlaczego. Tworząc użytkownika jako część historii, programiści podsycają ciekawość i prowadzą użytkownika przez wszystkie niezbędne kroki, aż do wezwania do działania na końcu.

„Pozwoliliśmy na to – jak możemy to teraz naprawić?”

9. Narysuj siebie: jak dochód gospodarstwa domowego przewiduje szanse twojego dziecka na pójście na studia

Wiele infografik na tej liście wykorzystuje animację i interaktywność, aby zapewnić bogate wrażenia. Wizualnie ta infografika z New York Times (You Draw It: How Family Income Predicts Children's College Chances) jest zgodna z klasycznym formatem diagramu, ale wykorzystuje również zrozumienie zachowań użytkowników, aby rozszerzyć zakres projektowania infografik, takich jak proaktywne i interaktywne wyobrażanie sobie. Prosząc czytelników o narysowanie własnej krzywej, wprowadzają element własnego interesu, a tym samym dostarczają ludziom naprawdę cennych informacji.

Nie najgorszy wynik! Oś pionowa Odsetek dzieci idących na studia. Oś pozioma to percentyl dochodu rodziców

10 Jak umierają Amerykanie

Z wyjątkiem obrazu tytułowego, ten przykład wykorzystuje głównie dobre, staromodne wykresy do renderowania treści. Ale to wcale nie jest nudne, ponieważ użytkownicy mogą samodzielnie poruszać się po danych, przesuwając kursor wzdłuż wykresów. To sprawia, że ​​znacznie łatwiej jest porównać, na przykład, liczbę zgonów związanych z samobójstwami w latach 70. z dzisiejszą (wskazówka: teraz rośnie), statyczny wykres nie zrobiłby tego tak starannie.

11.

Odkąd Snowfall zadebiutował na całym świecie i zyskał uznanie, The New York Times utrzymuje swoją reputację najnowocześniejszego dziennikarstwa multimedialnego. Zespół publikujący wykorzystuje połączenie projektu infografiki i dogłębnej narracji, aby stworzyć imponująco interesujące doświadczenie. Mają bardziej uderzające przykłady, ale The Russia Left Behind jest dziełem, które wywołało pewien rezonans. Infografika funkcjonuje jak interaktywna podróż po Rosji (nawigujesz po mapie).

12. Samochody Bonda

Jeśli kiedykolwiek chcesz poznać historię Jamesa Bonda, patrząc na jego samochody, podziękuj brytyjskiemu dealerowi samochodowemu Evansowi Halshawowi – dał ci taką szansę. Interaktywna infografika Bond Cars pozwala poznać markę i projekt każdego z samochodów Bonda oraz kilka dodatków. interesujące fakty. Korzystając z wszechobecnej taktyki slidera, możesz też „odsłonić” samochód w całej jego metalicznej okazałości (domyślnie podany jest tylko jeden kolor). Autorzy więc twórczo rozwiązali problem konieczności zamieszczania zdjęć, które nie do końca pasują do estetyki infografik.

13. Kolory ruchu

The Colours Of Motion to seria infografik, która analizuje filmy na podstawie samej palety kolorów, wywodzącej się z kombinacji wszystkich klatek. Jeśli kiedykolwiek zastanawiałeś się, teraz masz odpowiedź. Nie możesz znaleźć tytułu w bazie danych? Po prostu wyślij wiadomość do programistów - akceptują prośby.

14. Królewski grobowiec w Peru

National Geographic ma dość imponującą kolekcję tak zwanej „interaktywnej grafiki” (większości z nich towarzyszą szczegółowe opisy tekstowe, jak w przypadku np. Kolumny Trajana), ale ten stosunkowo prosty przykład wybraliśmy, aby podkreślić, które metody są naprawdę skuteczne w interaktywnych infografikach. „Królewski grobowiec w Peru” (Peru's Royal Wari Tomb) ujawnia cechy pochówku ówczesnej szlachcianki. Punkt ciężkości przesuwa się z opakowania mumii na jej dekoracje i pozycję. Dzieląc informacje na mniejsze fragmenty i umożliwiając użytkownikowi poruszanie się między nimi, interaktywne grafiki pozwalają uniknąć najbardziej podstępnych pułapek: nadmiaru danych i efektów wizualnych. Co więcej, każda kolejna interakcja poszerza doświadczenie, czyniąc je znacznie bardziej satysfakcjonującym, niż gdyby wszystko zostało zaprezentowane na raz. Nasz mózg ma mechanizm, który odrzuca hamujące bodźce i dany typ interakcja staje się świetnym rozwiązaniem dla użytkownika, ułatwiającym przyswajanie informacji.

15. Czym jest „szkockie referendum”? Wyjaśnienie dla osób niebędących Brytyjczykami

The Guardian, podobnie jak New York Times, opiera się na dziennikarstwie multimedialnym, a ich wideo świetnie spełnia jedną z głównych funkcji infografik: nadać nieporęcznym informacjom akceptowalną formę. Dla wielu z nas spoza Wielkiej Brytanii referendum jest bardzo mylącym tematem. Na szczęście ten film (Wyjaśnienie szkockiego referendum dla osób niebędących Brytyjczykami) pomoże ci szybko poznać jego ważne aspekty bez konieczności zagłębiania się w historię.

16. Zdrowie publiczne

Zadaniem stojącym przed The Atlantic było opracowanie koncepcji poprawy zdrowia społeczeństwa. Zleciła Truth Labs napisanie 3-częściowej serii na temat zdrowia populacji jako narracji cyfrowej. Głównym celem performera było zachowanie naturalnego przewijania dokumentu i zwykłych warunków czytania użytkownika, przy jednoczesnym stworzeniu doświadczenia różniącego się od perspektywy wizualnej. Aby urzeczywistnić swoją wizję, zapożyczyli narzędzia i strategie z kina, ale także oparli się na zbiorze zasad projektowania, aby zapewnić czytelność jako kluczową zasadę.

17. Ziarna Joho

Austriacki producent kawy Joho's stworzył imponujące multimedialne doświadczenie Joho's Bean, aby opowiedzieć historię pochodzenia ziaren kawy, śpiew ptaków, dźwięk palonych ziaren kawy pakowanych w worki oraz hałas ruchliwych ulic i ruchu ulicznego w mieście.

Joho's zabierze Cię w podróż wyjaśniającą pochodzenie ich ziaren kawy

18. Pierwotna droga

„Dzika ścieżka” jest eksperyment interaktywny, dziennik podróży stworzony za pomocą Canvas. Głównym elementem jest mapa, która animuje ścieżkę na mapie podczas przewijania strony. Projekt może nie działać we wszystkich przeglądarkach. Zawiera jednak towarzyszący artykuł wyjaśniający całą zakulisową technologię infograficzną.

19.

Relacja The Guardian (wyniki wyborów na żywo) z wyborów prezydenckich w USA w 2016 r. wniosła zabawny element do poważnego interesu i lokali wyborczych. Interaktywna infografika śledzi głosy w czterech stanach. Domyślnie wykres pokazywał wyniki dla całego kraju, a jeśli użytkownik najechał kursorem na dowolny obszar na mapie, pokazywał, jakie liczby zdobyli tam kandydaci. Kandydaci na prezydenta zostali przedstawieni jako zabawne pikselowe awatary. Gdy infografiki były aktualizowane na żywo, mali ludzie zabarwili stany, w których wygrali. Co jakiś czas obok kandydata pojawiał się cytat w dymku.

Odzwierciedlenie wyników wyborów w czasie rzeczywistym

Być może zauważyłeś masową zmianę świat online od treści tekstowych do treści wizualnych.

Nie można zaprzeczyć sile grafiki w Internecie iw naszym codziennym życiu. YouTube i Instagram są zdominowane przez treści wizualne; YouTube jest trzecią najczęściej odwiedzaną witryną w sieci, a Instagram codziennie przesyła ponad 80 milionów zdjęć.

Posty i artykuły na blogach są o 80% bardziej „konsumpcyjne”, jeśli zawierają kolorowe obrazy, nagłówki lub miniatury, a ludzie nie spędzą na stronie więcej niż 15 sekund, jeśli nie przyciągnie ona ich uwagi od pierwszych sekund.

Infografiki są ulubieńcem odbiorców i sprzedawców, a ludzie są nimi zainteresowani o 800% bardziej niż w 2012 roku.

Co więcej, treści powstają w zastraszającym tempie – 60% marketerów tworzy codziennie przynajmniej niewielką porcję nowych treści! Możesz dowiedzieć się więcej w artykule przeglądowym.

Ponieważ coraz więcej osób zaczyna tworzyć treści, coś staje się jasne: aby zostać zauważonym, musisz się wyróżniać.

Oczywiście marketerzy treści już myślą o przyszłości treści wizualnych, patrząc na to, co mogą teraz zrobić, co mogą wdrożyć i jakie nowe technologie są na horyzoncie. To przyszłościowe myślenie jest tym, co może zrujnować wszystkie Twoje działania związane z marketingiem treści; musisz się dostosować albo utoniesz.

Dzięki treściom wizualnym, takim jak infografiki, marketerzy mają do dyspozycji niepowtarzalna okazja zobaczyć przyszłość, która się zbliża. Firmy, graficy i marketerzy zaczynają wykorzystywać infografiki, aby aktualizować je, aby były jeszcze bardziej atrakcyjne dla odbiorców. Nawet jeśli już „dopiero publikujesz” infografiki regularnie, nigdy nie jest za wcześnie, aby dowiedzieć się o trendach, które dopiero zaczynają się rozwijać, tak jak nigdy nie jest za wcześnie, aby dowiedzieć się, jak włączyć je do swoich strategii marketingu treści.

Jeśli chcesz rzucić okiem w przyszłość, a może nawet nauczyć się kilku sztuczek przed wszystkimi innymi, nadszedł czas!

Oto trzy rodzaje infografik, które będą najpopularniejsze w (niedalekiej) przyszłości.

Jeśli szukasz fajnego narzędzia do infografiki, polecam Visme. Na początek oferują darmowe konto i wspaniałe udogodnienia dla osób niebędących projektantami. Już teraz możesz założyć darmowe konto.

1. Interaktywna infografika

Chociaż widzimy piękno interaktywnych stron internetowych i łatwych w użyciu gier, interaktywne infografiki są wciąż całkiem nowe w swojej dziedzinie. Podobnie jak infografiki, zawierają one oczywiście pewne informacje i zazwyczaj są dynamiczne. Ale korzystanie z elementów interaktywnych daje użytkownikom możliwość łączenia się z informacjami i tworzenia własnych.

Bez względu na to, jaka jest Twoja firma, produkt, usługa lub przekaz, możesz tworzyć interaktywne infografiki, które pozwolą użytkownikom ocenić samych siebie (np. „oblicz tutaj swoje BMI”). Użytkownicy mogą również kliknąć odpowiednie informacje, które przeniosą ich do bardziej szczegółowego zasobu lub z powrotem wstęp generując w ten sposób ruch. To bardzo elastyczny i zabawny sposób na zaangażowanie odbiorców.

Wielu marketerów przystosowało się już do tego rodzaju infografik i szybko się przenosi. Ale jednocześnie wielu bierze za podstawę prosta infografika:

…wyobraź sobie, co jeszcze możesz zrobić z interaktywną infografiką.

Możesz spróbować:

  • Korzystanie z technik przewijania, które sprawiają, że obrazy lub kształty wyróżniają się z tła
  • Tworzenie „wyskakujących okienek”, które rozszerzają obszary tekstowe
  • Wyskakujące obrazy lub statystyki po kliknięciu na nie
  • Przekształcanie infografik w wiele stron, które użytkownicy mogą przeglądać

Po więcej szczegółowy przykład interaktywna infografika, spójrz na tę:

Aby infografiki były wysoce interaktywne (z przewijaniem, wyskakującymi okienkami itp.), musisz dowiedzieć się trochę o HTML5 lub CSS lub zatrudnić kogoś, kto to dla ciebie wymyśli.

Pomimo dodatkowego wysiłku zostaniesz nagrodzony fragmentem treści, który jest wyjątkowy, wciągający i skuteczny.

Dlaczego warto w najbliższym czasie spróbować wdrożyć infografiki?

  • Inspiruje odbiorców do angażowania się i udostępniania treści
  • Generuje ruch (poprzez linki)
  • Dowodzi to Twoim odbiorcom, że jesteś innowacyjny, zaradny i zaangażowany w dostarczanie aktualnych i interesujących treści.
  • Istnieją poziomy interaktywnych infografik, które umożliwiają zarządzanie ich rozwojem.

2. Osadzone wideo i GIF

To inny rodzaj infografiki, którą spotykamy dzisiaj coraz częściej. Infografiki zawierające krótkie filmy lub nawet pliki GIF (Graphic Data Interchange Format) to świetny sposób na przyciągnięcie uwagi i wyróżnienie infografiki z tłumu. Chociaż ogranicza to platformy, możesz udostępniać swoje infografiki w czasie rzeczywistym.

Wiele prostych narzędzi do tworzenia infografik, takich jak Easel.ly, oferuje opcję „Osadzone wideo z YouTube” lub możesz dodać wideo do infografiki utworzonej w programie Photoshop za pomocą warstwy wideo. Możesz nawet dodać wideo do slajdu Powerpoint, który możesz również przekształcić w infografikę.

Co więcej, możesz znaleźć miliony GIF-ów w sieci i wkleić je w ten sam sposób. Haczyk polega na tym, że musisz rozpowszechnić swoją infografikę jako adres URL, aby upewnić się, że jest ona prawidłowo osadzona w Twojej witrynie. Nie możesz rozpowszechniać ani zapisywać takich infografik w formacie .jpeg lub PDF. Niewątpliwie, w miarę jak staje się coraz bardziej popularny, pojawią się inne narzędzia do wstawiania wideo i GIF, które jeszcze bardziej ułatwią ten proces.

Ale jeśli chcesz użyć tego typu infografiki, zanim wszyscy inni, nawet ich psy, nauczą się, jak to zrobić, zacznij już teraz od narzędzi, które znajdziesz w Internecie.

Jeśli chcesz przenieść to na wyższy poziom, możesz zrobić film z infografiki, którą już masz. To świetna okazja, aby pokazać się na YouTube, Instagramie, a nawet na platformach wideo, takich jak Vimeo, Snapchat i nie tylko. Poniższy film jest doskonałym przykładem tego, jak zamienić infografikę w wideo.

Po co osadzać wideo lub GIF w infografice?

  • Daje to element zaskoczenia — ludzie nie spodziewają się, że obraz się poruszy!
  • Jest to bardzo zabawne i oryginalne, co zwiększa szansę, że ludzie będą wchodzić w interakcje i udostępniać Twoją infografikę.
  • Ten dobry sposób pokaż wszystkim wyjątkowość swojej marki

3. Animowana infografika

Animowane infografiki mają ogromną liczbę wzorców wizualnych i wymagają dużej uwagi. Kiedy użytkownik przegląda stronę, zwykle nie spodziewa się, że coś się poruszy, więc dobrze jest nauczyć się wszystkich tych technik, zanim zrobią to inni.

Ponieważ wiele animowanych infografik jest dość złożonych i może wymagać pewnego rodzaju projektowania graficznego, kodowania i/lub znajomości oprogramowania, są one bardzo cenione.

Oto przykład tego, o czym mówię:

Jeśli chcesz dowiedzieć się więcej o tym, jak tworzyć animowane infografiki, sprawdź tę infografikę od Tabletop Whale. Możesz również znaleźć różne usługi, które pomogą Ci stworzyć tego rodzaju infografiki. W każdym razie jest to jeden z najbardziej złożonych procesów w ewolucji infografik.

Dlaczego warto poświęcić czas, energię i/lub pieniądze na tworzenie animowanych infografik?

  • To naprawdę sprawi, że wyróżnisz się z tłumu, ponieważ nie każdy ma dostęp do tego rodzaju oprogramowanie lub treść
  • Za kilka lat będzie to powszechne - będziesz jednym z pierwszych, którzy to zrobią!
  • Animacja sprawi, że informacje zawarte w infografice będą bardziej zapadające w pamięć.
  • Zainspiruje to Twoich użytkowników do współpracy z Tobą

Nic z tego nie jest science fiction.

Może to brzmieć zbyt technicznie i wydawać się teraz czymś, co przekracza Twoje możliwości, ale jest prawdopodobne, że tego typu infografiki staną się bardzo powszechne za 2-3 lata. Widzimy już duży przełom w animowanych infografikach i infografikach gif, zwłaszcza że gify wciąż zyskują na popularności. Infografiki stają się jednym z najczęściej konsumowanych i najczęściej tworzonych rodzajów treści w internecie. Dlaczego? Tak, ponieważ mózg potrzebuje tylko 250 milisekund, aby zaakceptować i przetworzyć znaczenie symbolu.

Jeśli przeciętna osoba spędza około 15 sekund na stronie, a potem się nudzi, to naturalnie chcesz wyciągnąć z ekranu wszystko, co może ją opóźnić – lub przynajmniej otrzymać wiadomość w 15 sekund lub mniej. Niektóre badania dowiodły nawet, że ludzie mogą skupić się na czymkolwiek przez nie więcej niż 8 sekund, a liczba ta maleje z każdym rokiem.

Jest to przyczyną i być może produktem ubocznym naszej ciągłej potrzeby informacji. Żyjemy w erze informacji i wszystkie informacje są dla nas dostępne. Ale oznacza to również, że im więcej osób próbuje dzielić się wiadomościami i odpowiadać na każde możliwe pytanie, tym więcej tworzonych treści staje się szumem w tle.

Jeśli obecność infografik dzisiaj jest wyznacznikiem, to wkrótce będzie wszędzie. Oznacza to nowe zmiany w Twojej pracy. Żadna kampania marketingowa w historii nie odniosła sukcesu, robiąc ciągle to samo.

Chodzi o to, aby zobaczyć infografikę jako coś więcej niż obraz .jpeg. Infografiki można dostosować do różnych środowisk i używać na wielu różnych platformach. Przedsiębiorcy i marketerzy już dostrzegli w tym potencjał. A ty?

Żeton Wirtualna rzeczywistośćże dla innych wyjdziesz na idiotę

Google Cardboard Design Lab to dobry „podręcznik” dla początkujących projektantów VR

Infografiki - jak gra rpg

Problem z Unity polega na tym, że nie jest łatwo zrobić coś dobrego w sieci.

Rzeczywistość wirtualna jest jak słuchawki dla oczu

Rzeczywistość wirtualna wymaga bezpiecznego środowiska, nie można do niej wejść w biegu. Ogranicza możliwości VR

Rano zamknął sesję Archie Tse z The New York Times z prowokacyjnym tematem „Dlaczego NYT wykonuje mniej interaktywnej pracy”.

Praca NYT opiera się na trzech zasadach wizualnego opowiadania historii:

  1. Jeśli czytelnik musi kliknąć, a nie przewijać, musi się wydarzyć coś niezwykłego.
  2. Załóżmy, że podpowiedzi i wszelkie inne efekty najechania kursorem nigdy nie będą widoczne dla nikogo. Jeśli treść jest ważna, spraw, aby czytelnik zobaczył ją od razu.
  3. Jeśli chcesz stworzyć coś interaktywnego, pamiętaj, że działanie na wszystkich platformach będzie kosztowne.

Będziesz musiał przerysować swoją grafikę 2 lub 3 razy, aby działała zarówno na komputerze, jak i na urządzeniu mobilnym

Jak te zasady zmieniły podejście NYT:

  1. Większość wizualizacji jest teraz statyczna
  2. Więcej tekstów
  3. Jeśli potrzebujesz ruchu na obrazie, pojawi się on podczas przewijania

(Punkt czwarty mówi, że nadal wykonują pracę interaktywną. Ale teraz okazja musi być BARDZO znacząca.)

Zrobiliśmy „wiele kroków”. Użytkownicy zatrzymują się na kroku 3. Czytelnicy chcą tylko przewijać, a nie klikać

Archie Tse: Przewijanie vs. klikanie

Od 18 tygodni Andy Kriebel publikuje infografikę i dane, na których się opiera, w VizWiz w każdą niedzielę wieczorem. Zadanie polega na wygospodarowaniu około godziny czasu w poniedziałek, szybkiej analizie wizualizacji i stworzeniu własnej wersji.

Poniżej publikujemy wyniki z ostatniego tygodnia - Niewolnictwo w XXI wieku.

#MakeoverMonday autorstwa Andy'ego Kriebela. Szczegółowy opis i interaktywne - na blogu Andy'ego:

#MakeoverMonday autorstwa Andy'ego Cotgreave'a. Szczegółowy opis i interaktywny - na blogu Andy'ego:

Dowiedziałem się też, że 51% ludzi na świecie jest młodszych ode mnie, a 63% w Rosji jest starszych i że moje szanse na śmierć w tej chwili nie są zbyt duże. Liczby nagle przestały być „statystyką” i poruszyły mnie do głębi.

Wizualizacja danych Wykorzystuje duże zbiory danych przy mniejszej ręcznej pracy projektowej w oparciu o algorytmy. Na przykład interaktywna praca New York Timesa.

Sztuka wizualna - kodowanie jednokierunkowe. Piękne, ale trudne do rozszyfrowania wizualizacje, takie jak sztuka obliczeniowa Kunala Ananda.

Jaki jest problem?

W rezultacie wiele prac przyciąga tylko wyrafinowanych użytkowników, ale nie pozwala niewtajemniczonym czytelnikom zagłębić się w istotę zagadnienia, tym samym szkodząc celowi wizualizacji - informowaniu opinii publicznej. Dlatego tak ważne jest rozpoznanie i zrozumienie problemu alfabetyzacji wizualnej w kontekście wizualizacji.

Nowa „gramatyka wizualna” dziennikarstwa

Oto trzy prace, które eksperymentują ze sposobami prezentowania dziennikarstwa interaktywnego. Wyglądają imponująco, ale ich interpretacja może być dla wielu trudnym zadaniem.

Prawa gejów w USA, stan po stanie

Liczba dostępnych obecnie źródeł danych i narzędzi do przetwarzania danych sama w sobie wyraźnie wskazuje, że nigdy wcześniej tak wielu ludzi nie próbowało odnaleźć się w świecie wizualizacji danych. A kiedy dostępnych jest tak wiele materiałów do studiowania, pozostaje tylko jedno pytanie "Gdzie zacząć?" może przestraszyć każdego nowicjusza. Jakie są więc najlepsze biblioteki i co polecają profesjonaliści? Zostanie to omówione w tym artykule.

Mówienie o wizualizacji danych i nie wspominanie o tym jest jak mówienie o historii stworzenia komputery osobiste i nigdy nie mów ani słowa o Stevie Jobsie. D3 (z angielskiego Data Driven Documents) to bez przesady najważniejsza i dominująca na rynku biblioteka JavaScript typu open source, która jest powszechnie wykorzystywana do tworzenia grafiki SVG. SVG (z ang. Scalable Vector Graphics) to z kolei format grafiki wektorowej obsługiwany przez przeglądarki internetowe, ale wcześniej mało używany.

Biblioteka D3 w dużej mierze zawdzięcza swoją popularność nagłemu zainteresowaniu formatem SVG ze strony projektantów stron internetowych, co w dużej mierze wynika z tego, jak Grafika wektorowa patrzeć na ekrany o wysokiej rozdzielczości (w szczególności na wyświetlaczach Retina stosowanych w Urządzenia Apple'a), które stają się coraz bardziej powszechne.

„Bądźmy szczerzy, jeśli zadaniem jest wizualizacja danych w oparciu o SVG, to wszystkie inne biblioteki nie były nawet bliskie rozwiązania tego problemu”, mówi Moritz Stefaner, niezależny ekspert ds. wizualizacji danych i właściciel firmy Prawda i piękno. „Istnieje również sporo ciekawych projektów opartych na D3, takich jak NVD3, który dostarcza standardowe komponenty graficzne – gotowe do użycia, ale z możliwością dostosowania; lub, powiedzmy, Crossfilter to po prostu znakomite narzędzie do filtrowania danych”.

Scott Murray, programista-projektant i autor książek Interaktywna wizualizacja danych dla sieci, zgadza się z poprzednią opinią: „D3 ma niezwykłą moc, która polega na tym, że wykorzystuje wszystko, co mają do zaoferowania przeglądarki. Chociaż to ma tylna strona: jeśli przeglądarka czegoś nie obsługuje, na przykład obrazów 3D opartych na WebGL (z angielskiej Web Graphics Library), to D3 też tego nie obsłuży.

I choć ta biblioteka jest naprawdę uniwersalna, to wciąż nie jest idealnym rozwiązaniem do każdego zadania. „Główną wadą biblioteki D3, że tak powiem, jest to, że nie zaleca ani nawet nie sugeruje żadnego konkretnego podejścia do wizualizacji” — dodaje Scott Murray. „Tak więc jest to naprawdę narzędzie do ładowania danych do przeglądarki, a następnie generowania komponentów DOM na podstawie tych danych”.

Podczas gdy D3 jest doskonałym narzędziem do niestandardowych obrazów, jeśli chcesz utworzyć standardowy wykres bez większego nakładu pracy wizualnej, to narzędzie takie jak Wega. Będąc frameworkiem opracowanym na bazie D3, Vega stanowi alternatywę dla wyświetlania komponentów graficznych. Za pomocą Vega możesz wizualizować dane w formacie JSON Europejskie Centrum Dziennikarstwa i Data Driven Journalism Project. Dokładna data kursu nie jest jeszcze znana, ale już teraz można się zapisać.

W ciągu pięciu dni uczestnicy kursu będą mogli dowiedzieć się, czym jest dziennikarstwo danych, jak działa i jakie kluczowe umiejętności należy opanować, aby zostać specjalistą w tej dziedzinie. Dowiedz się, gdzie szukać danych wspierających Twoje historie i jak znaleźć nowe spostrzeżenia z istniejących danych. Naucz się sztuki przekształcania nudnych danych w fascynującą historię, infografikę, a nawet interaktywną wizualizację. Zapoznaj się z podstawowymi zasadami projektowania graficznego, które powinien znać dziennikarz.

Instruktorami kursu jest pięciu czołowych światowych ekspertów w dziedzinie dziennikarstwa danych i wizualizacji.

Przyszłość wizualizacji danych jest interaktywna.

Ale jak stworzyć naprawdę oszałamiającą interaktywną infografikę?

Infografiki są wszędzie i coraz częściej stają się interaktywne.

W dzisiejszym artykule zdradzimy Ci tajniki tworzenia interaktywnych infografik, a także linki do przydatnych zasobów.

1. Zrozumieć psychologię

Zanim uczynisz infografikę interaktywną, ważne jest, aby zrozumieć, dlaczego chcesz to zrobić w ten sposób.

Jak pokazano na tej infografice, ludzie lepiej przyswajają informacje wizualne. O wiele bardziej prawdopodobne jest, że przeczytamy, zrozumiemy i zapamiętamy prezentację, jeśli ma ona wciągające efekty wizualne. Jest skuteczne narzędzie się uczyć, ale może być jeszcze lepiej.

Uczenie się kinetyczne jest świetną alternatywą, ponieważ ludzie uczą się lepiej poprzez działania fizyczne.

Dlatego dodanie interaktywności do sfery perspektywicznej wizualizacji pomoże Ci stworzyć jeszcze bardziej zapadające w pamięć i skuteczne infografiki.

To połączenie podejścia wizualnego i kinetycznego sprawia, że ​​animowane infografiki są treściami przyszłości. Oczywiście w przypadku niektórych motywów lepiej nie używać elementów interaktywnych, ale w większości przypadków poprawią one jedynie treść.

Ruch nadaje znaczenie informacjom, pozwala użytkownikowi kontrolować doświadczenie i angażuje wyobraźnię w sposób, w jaki nie mogą tego zrobić statyczne infografiki.

2. Dodaj efekty przewijania