Interactieve infographicsvoorbeelden. Tips voor het maken van verbluffende interactieve infographics. Dit is geen sciencefiction.

Je hebt waarschijnlijk een enorme verschuiving in de online wereld opgemerkt van op tekst gebaseerde inhoud naar visuele inhoud.

De kracht van beeld op internet en in ons dagelijks leven valt niet te ontkennen. YouTube en Instagram worden gedomineerd door visuele inhoud; YouTube is de derde meest bezochte site op internet en op Instagram worden dagelijks meer dan 80 miljoen foto's geplaatst.

De kans dat blogposts en artikelen worden geconsumeerd is 80% groter als ze kleurrijke afbeeldingen, koppen of thumbnails hebben, en mensen zullen niet langer dan 15 seconden op een site doorbrengen als deze niet meteen hun aandacht trekt.

Infographics zijn favoriet onder het publiek en de retailers, en zijn voor mensen vandaag de dag 800% interessanter dan in 2012.

Bovendien wordt er in een alarmerend tempo content gecreëerd: 60% van de marketeers creëert elke dag minstens een kleine hoeveelheid nieuwe content! Meer informatie kunt u vinden in het overzichtsartikel.

Nu steeds meer mensen content gaan maken, wordt één ding duidelijk: om gezien te worden, moet je opvallen.

Uiteraard denken contentmarketeers al na over de toekomst van visuele content, waarbij ze nadenken over wat ze nu kunnen doen, wat ze kunnen implementeren en welke nieuwe technologieën in het verschiet liggen. Dit vooruitstrevende denken is wat uw inspanningen op het gebied van contentmarketing kan maken of breken; je moet je aanpassen, anders verdrink je.

Met visuele inhoud zoals infographics hebben marketeers een unieke kans om de toekomst te zien terwijl deze nadert. Bedrijven, grafisch ontwerpers en marketeers beginnen allemaal infographics te gebruiken en deze bij te werken om ze nog aantrekkelijker te maken voor hun publiek. Zelfs als u al regelmatig infographics 'post', is het nooit te vroeg om meer te weten te komen over trends die zich net beginnen te ontwikkelen, net zoals het nooit te vroeg is om te leren hoe u deze in uw contentmarketingstrategieën kunt implementeren.

Als je in de toekomst wilt kijken en misschien zelfs een paar trucjes wilt leren voordat alle anderen dat doen, dan is dit het moment!

Hier zijn de drie soorten infographics die in de (nabije) toekomst het meest zullen voorkomen.

Als je op zoek bent naar een coole tool voor het maken van infographics, raad ik je aan Visme eens te bekijken. Om te beginnen bieden ze een gratis account en geweldige gebruiksvriendelijke functies voor niet-ontwerpers. U kunt nu een gratis account krijgen.

1. Interactieve infographics

Hoewel we de schoonheid van interactieve websites en gebruiksvriendelijke games hebben gezien, zijn interactieve infographics nog vrij nieuw op hun vakgebied. Net als infographics bevatten ze uiteraard enige informatie, en zijn ze meestal dynamisch. Maar het gebruik van interactieve elementen geeft gebruikers de mogelijkheid om verbinding te maken met informatie en hun eigen informatie te creëren.

Ongeacht uw bedrijf, product, dienst of boodschap, u kunt een interactieve infographic maken waarmee mensen zichzelf kunnen beoordelen (bijvoorbeeld ‘bereken hier uw BMI’). Gebruikers kunnen ook op relevante informatie klikken, waardoor ze naar een meer diepgaande bron of terug naar een landingspagina worden gestuurd, waardoor verkeer wordt gegenereerd. Het is een zeer aanpasbare en leuke manier om je publiek te betrekken.

Veel marketeers hebben zich al aangepast aan dit soort infographic, en het wordt snel overgedragen. Maar tegelijkertijd nemen velen nog steeds als basis eenvoudige infographics:

….stel je eens voor wat je nog meer kunt doen met interactieve infographics.

Je kunt proberen:

  • Gebruik scrolltechnieken die ervoor zorgen dat afbeeldingen of vormen loskomen van de achtergrond
  • Het construeren van “pop-upvensters” die tekstgebieden uitbreiden
  • Afbeeldingen of statistieken verschijnen wanneer u erop klikt
  • Verander uw infographics in meerdere pagina's die gebruikers kunnen bekijken

Voor een gedetailleerder voorbeeld van een interactieve infographic, bekijk deze eens:

Om een ​​infographic zeer interactief te maken (met scrollen, pop-ups, enz.) moet u wat leren over HTML5 of CSS, of iemand anders inhuren om dit voor u uit te zoeken.

Ondanks de extra inspanning wordt u beloond met een uniek, boeiend en effectief stukje inhoud.

Waarom zou u in de nabije toekomst infographics proberen te implementeren?

  • Dit moedigt uw publiek aan om uw inhoud te bekijken en te delen.
  • Dit genereert verkeer (via links)
  • Dit bewijst voor uw publiek dat u innovatief en vindingrijk bent en van plan bent actuele en interessante inhoud te bieden.
  • Er zijn lagen interactieve infographics die de ontwikkeling ervan beheersbaar maken

2. Ingesloten video en GIF

Dit is een ander type infographic dat we tegenwoordig steeds vaker zien. Infographics met korte video's of zelfs GIF's (Graphics Interchange Format) zijn een geweldige manier om de aandacht te trekken en uw infographic te laten opvallen. Hoewel dit beperkt wordt door platforms, kunt u uw infographics in de tegenwoordige tijd delen.

Veel eenvoudige infographic-tools, zoals Easel.ly, bieden de optie ‘Ingesloten YouTube-video’, of u kunt video toevoegen aan een infographic die u in Photoshop maakt met behulp van een videolaag. Je kunt zelfs een video toevoegen aan een Powerpoint-dia, die je ook kunt omzetten in een infographic.

Bovendien kun je miljoenen GIF's online vinden en deze op dezelfde manier invoegen. De valkuil hier is dat u uw infographic als URL moet distribueren om ervoor te zorgen dat deze correct in uw site wordt ingesloten. U mag dergelijke infographics niet verspreiden of opslaan in .jpeg- of PDF-formaat. Naarmate dit populairder wordt, zullen er ongetwijfeld andere video- en GIF-invoegtools komen om het proces nog eenvoudiger te maken.

Maar als je dit soort infographic wilt gebruiken voordat iedereen om je heen, zelfs hun honden, leert hoe het moet, begin dan nu met de tools die je online vindt.

Als je het naar een hoger niveau wilt tillen, kun je een video maken van een infographic die je al hebt. Dit is een geweldige kans om gezien te worden op YouTube, Instagram en zelfs videoplatforms zoals Vimeo, Snapchat en anderen. De onderstaande video is een goed voorbeeld van hoe u van een infographic een video kunt maken.

Waarom een ​​video of GIF insluiten in een infographic?

  • Dit geeft je een verrassingselement: mensen verwachten niet dat de foto beweegt!
  • Het is erg leuk en origineel, waardoor de kans groter wordt dat mensen met je communiceren en je infographic delen.
  • Dit is een goede manier om iedereen het unieke karakter van uw merk te laten zien.

3. Geanimeerde infographics

Geanimeerde infographics hebben een groot aantal visuele patronen en vereisen veel aandacht. Wanneer een gebruiker een pagina bekijkt, verwachten ze meestal niet dat er iets beweegt. Het is dus een goed idee als je al deze technieken leert voordat alle anderen dat doen.

Omdat veel geanimeerde infographics behoorlijk complex zijn en enige vorm van grafisch ontwerp, codering en/of softwarekennis vereisen, worden ze zeer gewaardeerd.

Hier is een voorbeeld van waar ik het over heb:

Als je meer wilt weten over het maken van geanimeerde infographics, bekijk dan deze infographic van Tabletop Whale. Er zijn ook verschillende diensten die u helpen bij het maken van dit soort infographics. Hoe dan ook is dit een van de moeilijkste processen in de evolutie van infographics.

Waarom zou u uw tijd, energie en/of geld investeren in het maken van geanimeerde infographics?

  • Hierdoor onderscheid je je echt van de massa, omdat niet iedereen toegang heeft tot dit soort software of inhoud
  • Over een paar jaar zal dit gemeengoed zijn; jij zult een van de eersten zijn die dit doet!
  • Animatie zorgt ervoor dat de informatie in de infographic gedenkwaardiger wordt
  • Dit zal uw gebruikers inspireren om met u samen te werken.

Dit is geen sciencefiction.

Dit klinkt misschien te technisch en ligt op dit moment buiten uw mogelijkheden, maar het is waarschijnlijk dat dit soort infographics over twee tot drie jaar heel gewoon zullen worden. We kunnen al een sterke doorbraak zien in geanimeerde infographics en GIF's, vooral omdat GIF's in populariteit blijven groeien. Infographics worden een van de meest geconsumeerde en vaakst gemaakte soorten inhoud op internet. Waarom? Ja, want de hersenen hebben slechts 250 milliseconden nodig om de betekenis van een symbool te accepteren en te verwerken.

Als de gemiddelde persoon ongeveer 15 seconden op een site doorbrengt en zich dan begint te vervelen, dan wil je natuurlijk alles op het scherm weergeven dat hem of haar tegenhoudt - of op zijn minst binnen 15 seconden of minder een bericht ontvangen. Sommige onderzoeken hebben zelfs bewezen dat mensen zich niet langer dan 8 seconden ergens op kunnen concentreren, en dit cijfer neemt elk jaar af.

Dit is de reden en wellicht een bijproduct van onze voortdurende behoefte om informatie te ontvangen. We leven in het informatietijdperk en alle informatie is voor ons beschikbaar. Maar dit betekent ook dat hoe meer mensen proberen berichten te delen en elke mogelijke vraag te beantwoorden, hoe meer geproduceerde inhoud achtergrondgeluiden wordt.

Als de beschikbaarheid van infographics vandaag de dag een indicatie is, zullen ze binnenkort overal te vinden zijn. Dit betekent nieuwe veranderingen in je werk. Geen enkele marketingcampagne in de geschiedenis heeft succes geboekt door steeds hetzelfde te doen.

Het idee hier is om de infographic te zien als meer dan alleen een jpeg-afbeelding. Infographics kunnen worden aangepast aan verschillende media en op een grote verscheidenheid aan platforms worden gebruikt. Ondernemers en marketeers hebben hier al de potentie van gezien. En jij?

De toekomst van datavisualisatie is interactief.

Maar hoe maak je echt geweldige interactieve infographics?

Infographics zijn overal, en de laatste tijd worden ze steeds interactiever.

In het artikel van vandaag zullen we de geheimen van het maken van interactieve infographics met u delen, evenals links naar nuttige bronnen.

1. Begrijp psychologie

Voordat u een infographic interactief maakt, is het belangrijk om te begrijpen waarom u deze interactief wilt maken.

Zoals beschreven in deze infographic nemen mensen visuele informatie beter waar. Het is veel waarschijnlijker dat we een presentatie lezen, begrijpen en onthouden als deze boeiende beelden bevat. is een effectief leermiddel, maar het kan nog beter.

Kinetisch leren is een geweldig alternatief omdat mensen beter leren door fysieke activiteiten.

Daarom kan het toevoegen van interactiviteit aan het opkomende gebied van visualisatie u helpen nog gedenkwaardigere en effectievere infographics te maken.

Deze combinatie van visuele en kinetische aanpak maakt geanimeerde infographics de inhoud van de toekomst. Natuurlijk is het voor sommige thema’s beter om geen interactieve elementen te gebruiken, maar in de meeste gevallen zullen ze alleen de inhoud verbeteren.

Beweging voegt betekenis toe aan informatie, stelt de gebruiker in staat de ervaring te controleren en spreekt de verbeelding aan op een manier die statische infographics niet kunnen.

2. Voeg scrolleffecten toe

De truc met virtual reality is dat je voor anderen als een idioot overkomt

Google's Cardboard Design Lab is een goede 'tutorial' voor beginnende virtual reality-ontwerpers

Infographics - zoals een avonturenspel

Het probleem met Unity is dat het niet zo eenvoudig is om iets goeds voor het internet te maken.

Virtual reality is als een koptelefoon voor je ogen

Virtuele realiteit vereist een veilige omgeving; je kunt er niet zomaar in gaan. Dit beperkt wat VR kan doen

Sluiting van de sessie in de eerste helft van de dag Archie Tse uit The New York Times met het provocerende onderwerp “Waarom de NYT minder interactief werk doet.”

Het werk van NYT is gebaseerd op drie regels voor visuele verhalen:

  1. Als de lezer moet klikken in plaats van scrollen, moet er iets ongewoons gebeuren.
  2. Ga ervan uit dat tooltips en andere hover-effecten nooit door iemand zullen worden gezien. Als de inhoud belangrijk is, zorg er dan voor dat de lezer deze meteen ziet.
  3. Als je iets interactief wilt maken, onthoud dan dat het duur zal zijn om het op alle platforms te laten werken.

U zult uw afbeeldingen 2 of 3 keer opnieuw moeten tekenen om deze zowel op desktop als mobiel te laten werken

Hoe deze regels de aanpak van de NYT veranderden:

  1. De meeste visualisaties zijn nu statisch
  2. Er zijn meer teksten
  3. Als er beweging in het beeld nodig is, verschijnt dit tijdens het scrollen

(Het vierde punt stelt dat ze nog steeds interactief werk doen. Maar nu moet de reden ZEER betekenisvol zijn).

We hebben ‘meerdere stappen’ gedaan. Gebruikers stopten bij stap 3. Lezers willen alleen maar scrollen, niet klikken

Archie Tse: Scrollen versus. klikken

De afgelopen 18 weken heeft Andy Kriebel elke zondagavond de infographic en de gegevens waarop deze is gebaseerd op VizWiz geplaatst. De taak is om op maandag ongeveer een uur tijd vrij te maken, de visualisatie snel te analyseren en je eigen versie te maken.

Hieronder publiceren we de resultaten van vorige week – Slavernij in de 21e eeuw.

#MakeoverMonday door Andy Kriebel. Gedetailleerde beschrijving en interactief - op Andy's blog:

#MakeoverMonday door Andy Cotgreave. Gedetailleerde beschrijving en interactief - op Andy's blog:

Ik heb ook geleerd dat 51% van de mensen in de wereld jonger is dan ik, en 63% in Rusland ouder, en dat mijn kansen om nu te sterven niet zo groot zijn. De cijfers waren plotseling geen ‘statistieken’ meer en raakten bij mij een gevoelige snaar.

Datavisualisatie - maakt gebruik van grote datasets met minder handmatig ontwerpwerk; gebaseerd op algoritmen. Bijvoorbeeld het interactieve werk van de New York Times.

Beeldende kunst - unidirectionele codering. Mooie maar moeilijk te ontcijferen visualisaties, zoals de computationele kunst van Kunal Anand.

Wat is het probleem?

Als gevolg hiervan trekken veel werken alleen geavanceerde gebruikers aan, maar laten niet-ingewijde lezers de essentie van het probleem niet begrijpen, waardoor het doel van visualisatie - het informeren van het publiek - teniet wordt gedaan. Daarom is het zo belangrijk om het probleem van visuele geletterdheid in de context van visualisatie te herkennen en te begrijpen.

Een nieuwe ‘visuele grammatica’ van de journalistiek

Hier zijn drie werken die experimenteren met manieren om interactieve journalistiek te presenteren. Ze zien er indrukwekkend uit, maar de interpretatie ervan kan voor velen een moeilijke opgave zijn.

Homorechten in de VS, staat voor staat

Het aantal databronnen en tools voor de verwerking ervan dat vandaag de dag beschikbaar is, laat duidelijk zien dat nog nooit zoveel mensen hebben geprobeerd te wennen aan de wereld van datavisualisatie. En als er zoveel materiaal beschikbaar is om te bestuderen, is er maar één vraag "Waar te beginnen?" kan intimiderend zijn voor elke newbie. Dus welke bibliotheken zijn de beste en wat raden de professionals aan? Dit zal in dit artikel worden besproken.

Praten over datavisualisatie en er niets over zeggen, is hetzelfde als praten over de geschiedenis van personal computers en geen woord zeggen over Steve Jobs. D3 (Data Driven Documents) is zonder overdrijving de belangrijkste en marktdominante open source JavaScript-bibliotheek die vaak wordt gebruikt voor het maken van SVG-afbeeldingen. SVG (van het Engelse Scalable Vector Graphics) is op zijn beurt een vectorafbeeldingsformaat dat wordt ondersteund door webbrowsers, maar voorheen weinig werd gebruikt.

De D3-bibliotheek dankt een groot deel van zijn populariteit aan de plotselinge belangstelling voor SVG onder webontwerpers, wat grotendeels te danken is aan hoe goed vectorafbeeldingen eruitzien op schermen met hoge resolutie (met name de Retina-displays die in Apple-apparaten worden gebruikt), die steeds vaker worden gebruikt. gewoon.

“Laten we eerlijk zijn: als het probleem op SVG gebaseerde datavisualisatie is, zijn alle andere bibliotheken nog niet eens in de buurt van een oplossing”, zegt Moritz Stefaner, een onafhankelijke datavisualisatie-expert en bedrijfseigenaar. Waarheid & Schoonheid. “Er zijn ook veel interessante projecten gemaakt op basis van D3, zoals NVD3, dat standaard grafische componenten biedt - klaar voor gebruik, maar aanpasbaar; of laten we zeggen dat Crossfilter gewoon een uitstekend hulpmiddel voor gegevensfiltering is.”

Scott Murray, programmeurontwerper en boekauteur Interactieve datavisualisatie voor het web, is het eens met de eerdere mening: “D3 is extreem krachtig omdat het profiteert van alles wat browsers te bieden hebben. Al heeft dat ook een keerzijde: als de browser iets niet ondersteunt, bijvoorbeeld 3D-afbeeldingen op basis van WebGL (uit de Engelse Web Graphics Library), dan ondersteunt D3 dat ook niet.”

En hoewel deze bibliotheek echt universeel is, is het nog steeds niet de ideale oplossing voor elke taak. “Het belangrijkste nadeel van de D3-bibliotheek is, om zo te zeggen, dat deze geen specifieke benadering van visualisatie voorschrijft of zelfs maar suggereert”, voegt Scott Murray toe. “Het is dus eigenlijk een hulpmiddel om gegevens in de browser te laden en vervolgens op basis van die gegevens DOM-componenten te genereren.”

Hoewel D3 een geweldig hulpmiddel is voor aangepaste afbeeldingen, kunt u, als u een standaardgrafiek wilt maken zonder veel werk aan het visuele aspect, een hulpmiddel als Vega. Als raamwerk dat bovenop D3 is ontwikkeld, biedt Vega een alternatief voor het weergeven van grafische componenten. Met Vega kunt u gegevens visualiseren in JSON-formaat European Journalism Center en Data Driven Journalism-project. De exacte data van de cursus zijn nog niet bekend, maar inschrijven kan nu al.

In vijf dagen leren cursisten wat datajournalistiek is, hoe het werkt en welke sleutelvaardigheden ze moeten beheersen om specialist op dit gebied te worden. Ontdek waar u naar gegevens kunt zoeken om uw verhalen te ondersteunen en hoe u nieuwe ideeën kunt vinden in bestaande gegevens. Leer de kunst om saaie gegevens om te zetten in een meeslepend verhaal, infographic of zelfs een interactieve visualisatie. Maak kennis met de basisprincipes van grafisch ontwerp die een journalist moet kennen.

De cursusinstructeurs zijn vijf van 's werelds toonaangevende experts op het gebied van datajournalistiek en visualisatie.

De afgelopen jaren zijn infographics geëvolueerd van statische afbeeldingen naar rijke, interactieve ervaringen met animatie- en video-elementen afgestemd op unieke inhoud. Het is niet langer beperkt tot kant-en-klare, one-size-fits-all sjablonen. En de selectie van vandaag bevat de beste voorbeelden van infographics die laten zien hoe een interessante en informatieve ervaring eruit ziet.

De meeste infographics in deze lijst zijn gekozen om de verschillende manieren te laten zien waarop ontwerpers datavisualisatie benaderen. Er zijn echter ook een paar ‘hybriden’ die de vervaging van de grenzen tussen infographics en rijke media-ervaringen illustreren bij het creëren van boeiende inhoud en meeslepende verhalen op landingspagina’s. Afwijken van traditionele vormen betekent dat we een complexer mediaterritorium betreden, en het zijn dit soort experimenten met technologie en verhalen vertellen die van cruciaal belang zullen zijn voor het vormgeven van de toekomst van grafisch ontwerp.

1. Windkaart

De Windkaart is een adembenemend ontwerp dat de windrichting en -snelheid boven de Verenigde Staten weergeeft. Dit ontwerp heeft eerder een artistiek dan een nuttig doel, en dat is geweldig: het is heel prettig om gewoon te zitten en te kijken hoe de dunne, dunne draden over de kaart wikkelen. Een eenvoudig maar goed doordacht voorbeeld van hoe infographics die vormtrajecten tonen profiteren van animatie en bewegende beelden.

2. Tijdens de vlucht

In 2014 lanceerde The Guardian een infographic genaamd In Flight, die realtime gegevens over commerciële vluchten liet zien (deze lijkt niet meer te worden bijgewerkt, wat jammer is) en ook een les bevatte over de geschiedenis van de luchtvaart. De gedempte gesprekken tussen vliegtuigbemanningen aan het begin van de interactieve show zorgen voor een bijzondere sfeer. Het lijkt erop dat infographics tegenwoordig langzaam veranderen in filmische ervaringen. In ieder geval wijst "In Flight" in die richting...

3. Kies Maan

Er gebeurt niet veel in de Dial A Moon-infographic, maar het dient zijn doel redelijk goed. In 2015 werden dankzij NASA de infographics van de maanfasen elk uur bijgewerkt en was het niet nodig om naar Google te gaan op zoek naar deze mysterieuze informatie. Nu kunt u foto's bekijken door handmatig de maand, dag en tijd in te voeren.

4. Dag met Pluto

Nature magazine publiceert veel interessante infographics voor haar wetenschapsgeïnteresseerde publiek. Onder hen was er een over de beroemde scheervlucht van een ruimtevaartuig nabij Pluto (24 Hours Of Pluto). De infographic bevatte veel tekstinformatie, maar de beelden maakten het gemakkelijk om de hoogtepunten te begrijpen, van de structuur van een dwergplaneet tot het proces waarbij de manen werden gevormd. Het tekstgedeelte is nu beschikbaar op internet, evenals twee geanimeerde video's uit de infographic.

5. Hoe Amerikaanse huizen zijn veranderd

Maak een reis door de grote Amerikaanse Droom, zoals weerspiegeld in de evolutie van huisstijlen. Met deze goed geïllustreerde infographic kun je achter het stuur van een auto kruipen (die ook van uiterlijk verandert als je scrollt om bij te blijven met het tijdperk) en je een weg banen van de jaren 1900 tot de jaren 2000, waarbij je gebouwen passeert die in bepaalde decennia populair waren. Onderweg kom je een schat aan nuttig materiaal tegen (waaronder de sociaal-politieke omstandigheden van die tijd, maar ook modetrends), en het eindigt allemaal met een vraag die je uitdaagt om je de toekomst van het Amerikaanse huis voor te stellen. De infographic Decades Of American Homes is een goed voorbeeld van horizontaal scrollen, en komt hier goed van pas.

6. De evolutie van marketinganalyses

In de Evolution of Insight-infographic volgt user intelligence-bedrijf Vision Critical de ontwikkeling van de marketingtechnologiemarkt over de hele wereld vanaf de jaren 1890 tot nu. Het werkt op dezelfde manier als de infographic How American Homes Have Changed, en stelt u dus in staat de effectiviteit van het gebruik van een interactieve tijdlijn voor twee heel verschillende verhalen te vergelijken. De infographic Decades Of American Homes heeft het voordeel dat u huizen kunt zien terwijl u rijdt, wat veel intuïtiever is dan reizen door Great American Analytics. Goede infographics worden rondom de inhoud gemaakt, niet eromheen.

7. LGBT-rechten over de hele wereld

The Guardian pakt een nieuwe plek op onze lijst met deze handige infographic waarin het juridische landschap van LGBT-rechten wordt uitgelegd over een reeks kwesties (huwelijk, discriminatie op de werkplek, haatmisdrijven, enz.) in elke staat ter wereld. De halve cirkelbeweging biedt een snelle en gemakkelijke manier om statistieken tussen verschillende landen te vergelijken, en de samenstelling van de infographic houdt de mondiale status voorop. Er is hier ook een krachtige oproep tot actie, met als doel de kloof tussen bewustzijn en activisme te overbruggen.

8. Ongelijkheid is herstelbaar.

Een ander geweldig voorbeeld van een interactieve infographic, Inequality Is Fixable, nodigt het publiek uit om in een probleem te duiken en het tegelijkertijd zeer persoonlijk te maken. De kijker blijft gegarandeerd geïnteresseerd in materiaal dat hem of haar vertelt hoeveel zijn baas te weinig betaalt en waarom. Door de gebruiker onderdeel te maken van het verhaal, wekken ontwikkelaars de nieuwsgierigheid en leiden ze de gebruiker door alle noodzakelijke stappen tot aan de Call-To-Action aan het einde.

“We hebben het laten gebeuren – hoe kunnen we alles nu oplossen?”

9. Teken zelf: hoe het gezinsinkomen de kansen van een kind om naar de universiteit te gaan voorspelt

Veel van de infographics op deze lijst maken gebruik van animatie en interactiviteit om een ​​rijke ervaring te bieden. Visueel volgt deze infographic van de New York Times (You Draw It: How Family Income Predicts Children's College Chances) het klassieke diagramformaat, maar maakt ook gebruik van inzicht in gebruikersgedrag om de reikwijdte van infographic-ontwerp uit te breiden, namelijk de techniek van proactief en interactieve visualisatie. Door lezers te vragen hun eigen curve te tekenen, introduceren ze een element van eigenbelang en voorzien ze mensen zo van werkelijk waardevolle informatie.

Niet het slechtste resultaat! Op de verticale as staat het percentage kinderen dat naar de universiteit is gegaan. Horizontale as: inkomenspercentiel van ouders

10. Hoe Amerikanen sterven

Met uitzondering van de titelafbeelding gebruikt dit voorbeeld meestal gewone oude diagrammen om de inhoud te visualiseren. Maar dit is helemaal niet saai, omdat gebruikers zelfstandig door de gegevens kunnen navigeren door de cursor langs de grafieken te bewegen. Dit maakt het veel gemakkelijker om bijvoorbeeld het aantal zelfmoordgerelateerde sterfgevallen in de jaren zeventig te vergelijken met nu (hint: het neemt nu toe), iets wat een statische grafiek niet zo goed zou doen.

11.

Sinds Snowfall voor het eerst brede aandacht en lof kreeg, heeft The New York Times zijn reputatie van uitmuntendheid op het gebied van multimediajournalistiek behouden. Het publicatieteam gebruikt een combinatie van infographic ontwerp en diepgaande storytelling om een ​​indrukwekkend boeiende ervaring te creëren. Ze hebben treffendere voorbeelden, maar The Russia Left Behind is een werk dat voor een zekere weerklank heeft gezorgd. De infographic functioneert als een interactieve rondreis door Rusland (je navigeert je weg op een kaart).

12. Bonds auto's

Als je ooit de geschiedenis van James Bond wilt ervaren door naar zijn auto's te kijken, bedank dan de Britse autodealer Evans Halshaw voor het geven van de kans. Met zijn interactieve Bond Cars-infographic kun je het merk en ontwerp van alle Bond-auto's verkennen, plus enkele aanvullende leuke weetjes. Met behulp van de alomtegenwoordige slider-tactiek kun je de auto ook in al zijn metallic glorie "onthullen" (standaard wordt alleen een ontwerp in één kleur weergegeven). Dit is hoe de auteurs op creatieve wijze het probleem van de noodzaak om foto's op te nemen die niet helemaal passen bij de esthetiek van de infographic hebben opgelost.

13. Kleuren van beweging

The Colors Of Motion is een infographic-serie die films uitsluitend analyseert op basis van hun kleurenpalet, afgeleid van het combineren van alle frames. Als je het je ooit hebt afgevraagd, nu heb je het antwoord. Kunt u een titel niet vinden in de database? Stuur de ontwikkelaars gewoon een bericht - zij accepteren verzoeken.

14. Koninklijk graf in Peru

National Geographic heeft een behoorlijk indrukwekkende verzameling van wat zij 'interactieve afbeeldingen' noemen (waarvan de meeste vergezeld gaan van gedetailleerde tekstbeschrijvingen, zoals de zuil van Trajanus), maar we hebben dit relatief eenvoudige voorbeeld gekozen om de toepassingen te benadrukken die technieken echt effectief zijn in interactieve infographics. “Peru’s Royal Wari Tomb” onthult de bijzonderheden van de begrafenis van een edelvrouw uit die tijd. De focus verschuift van de omhulsels van de mummie naar de versieringen en positie ervan. Door informatie in kleine stukjes te verdelen en de gebruiker ertussen te laten navigeren, vermijden interactieve graphics de meest verraderlijke valkuilen: data-overload en visuele effecten. Bovendien verbetert elke volgende interactie de ervaring, waardoor deze veel lonender wordt dan wanneer alles in één keer zou worden gepresenteerd. Ons brein beschikt over een mechanisme dat overweldigende prikkels afwijst, en dit soort interactie wordt een uitstekende oplossing voor de gebruiker, waardoor informatie gemakkelijk kan worden opgenomen.

15. Wat is het “Schotse referendum”? Uitleg voor niet-Britse mensen

The Guardian zet zich, net als de New York Times, in voor multimediajournalistiek, en hun video vervult uitstekend een van de belangrijkste functies van infographics: omslachtige informatie in een hanteerbare vorm omzetten. Voor velen van ons die buiten Groot-Brittannië wonen, is het referendum een ​​zeer verwarrend onderwerp. Gelukkig helpt deze video (Schots referendum uitgelegd voor niet-Britten) je snel de belangrijke aspecten te leren kennen zonder dat je diep in de geschiedenis hoeft te duiken.

16. Volksgezondheid

De missie van de Atlantic was het ontwikkelen van een visie voor het verbeteren van de volksgezondheid. Het gaf Truth Labs de opdracht om een ​​driedelige serie over “Population Health” te ontwikkelen tot digitale verhalen. Het belangrijkste doel van de kunstenaar was om het natuurlijke scrollen van het document en de normale leeservaring van de gebruiker te behouden, terwijl hij een ervaring creëerde die verschilt vanuit visueel perspectief. Om het tot leven te brengen, leenden ze hulpmiddelen en strategieën uit de film, maar vertrouwden ze ook op een reeks ontwerpprincipes om de leesbaarheid als sleutelregel te ondersteunen.

17. Joho’s granen

De Oostenrijkse koffieproducent Joho's heeft een meeslepende multimedia-ervaring gecreëerd, Joho's Bean, om het verhaal van de oorsprong van de koffieboon te vertellen. Het verhaal combineert naadloos audio, video en fotografie om bijna alle zintuigen van de gebruiker te prikkelen een koffieplantage, je hoort het geluid van fluitende vogels, het geluid van gebrande koffiebonen die in zakken worden verpakt, en het geluid van drukke straten en verkeer in de stad Totale onderdompeling!

Joho's neemt je mee op reis en legt de oorsprong van hun koffiebonen uit

18. Ongerepte weg

The Wild Path is een interactieve reisverslagervaring gemaakt met Canvas. Het belangrijkste element is de kaart, die het pad op de kaart animeert terwijl u door de pagina bladert. Het project werkt mogelijk niet in alle browsers. Maar er zit een begeleidend artikel bij waarin alle technologieën achter de schermen voor het maken van infographics worden uitgelegd.

19.

De berichtgeving van The Guardian over de Amerikaanse presidentsverkiezingen van 2016 (Live Election Results) bracht een leuk element in de serieuze zaak van opiniepeilingen en stembureaus. Een interactieve infographic hield de stemmen in vier staten bij. Standaard toonde de grafiek resultaten voor het hele land, en als de gebruiker over een gebied op de kaart zweefde, werd getoond welke cijfers de kandidaten daar scoorden. Presidentskandidaten werden gepresenteerd als grappige, pixelachtige avatars. Terwijl de infographic in realtime werd bijgewerkt, kleurden de mensen de staten die ze hadden gewonnen. Af en toe verscheen er een citaat in een ballon naast de kandidaat.

Weerspiegeling van verkiezingsresultaten in realtime