Ugens interaktive grafikker — uge 18
Ugens nyhedsbrev er lidt forsinket og det skyldes en hasteopgave der landede på mit eget bord her på Ekstra Bladet: vandscooter-tragedien i Københavns Havn. Mere om den til sidst i indlægget. Først skal vi et smut til udlandet inden vi vender hjem til Danmark igen.
Fra udlandet:
The Pudding
Mikrobryggerier i USA
The Pudding er et digitalt medie der fokuserer på hvad de selv kalder ‘visual essays’.
Selv beskriver de det således: “What is a visual essay? Imagine a New Yorker–esque longread about a complex topic, but code, data, and animation replace dense prose to construct a different sort of story. It’s one that’s reader-driven, explorable, and embeddable into other websites.”
Og de gør det tydeligvis osse godt. Se for eksempel denne gennemgang af mikrobryggerier i USA. Meget elegant fortalt og meget flot præsentation af data. Man burde få lyst til en kold øl, men historien her er næsten for tørt fortalt. Det tekniske er solidt, men visuelt kunne man godt ønske sig at den var lidt mere sprudlende. En teknisk læskende IPA, men en visuelt flad fadøl. Det bliver spændende at følge med i hvad der kommer Pudding fremover.
Herhjemme fra:
DR.dk
Danmark bliver til
Virkelig flot 3D-animation og et meget spændende format hvor man scroller sig gennem videoen. Det er ikke helt uden problemer. Det er svært at ramme tekstboksene med scrollen, måske skulle de have lov at stå på skærmen lidt længere og bevæge sig forbi lidt langsommere. Som det er nu er det lidt et dexterity-game at prøve at scrolle helt rigtigt så man når at fange teksten i forbifarten.
Grafikken i produktionen er ganske enkelt forrygende og farvestrålende. Jeg får lyst til at se meget mere fortalt i denne stil.
EB.dk
Vandscooter-tragedie i Københavns Havn.
Her kan jeg benytte lejligheden til at give et lille overblik over hvordan vi lavede grafik til denne historie her på Ekstra Bladet.
Vi arbejder normalt udfra mantraet “mobile first”, men ofte skal vores grafik osse i avisen. Derfor startede jeg med at lave grafik-elementer i høj opløsning der egner sig til at komme i trykken, i Illustrator og Photoshop.
Samtidig gik en anden grafiker, Mikkel Lund, i gang med at lave en 3D-grafik af selve ulykken, i 3D-Max plus Illustrator og Photoshop.
Next step: en flad infografik til desktop uden interaktion. Grafikken skulle hurtigst muligt på nettet så i første omgang lavede jeg et “minimal viable product” — en simpel hurtig version der virkede uden interaktion. Denne digitale version satte jeg sammen i Hype.
Derefter: mobilversionen, der har en swipe-navigation med fem punkter. Så snart denne var klar havde jeg en version vi kunne lægge op på eb.dk.
En af de ting jeg virkelig godt kan lide ved at arbejde med Hype er at man kan lave forskellige designs til desktop og mobil hvilket gør det nemmere at formidle informationen på de forskellige skærmstørrelser. Det kan selvfølgelig osse betyde at der skal laves dobbelt så meget grafik, men grafik der fungerer godt på en bred skærm kan være problematisk på en høj skærm og vice versa.
Så mobil-versionen viser scenariet fra en anden vinkel der passer bedre til et højt format:
Herefter gik jeg tilbage til desktop-versionen og opdaterede den. Den flade desktop-version havde meget information samlet i én skærm og det var ikke ligefrem let overskueligt, så jeg delte osse denne version op på samme måde som mobil-versionen, i flere sider. Sidste step var blot at opdatere grafikken på nettet med denne mere interaktive version:
I avisen endte det med at mit kort med de fem punkter blev prioriteret fra og avismagerne valgte at nøjes med Mikkel Lunds 3D-grafik. Pladsen i avis kan være begrænset og nogle gange må ting udelades. Sådan er det bare.
Det var en hasteopgave og jeg er selv udemærket tilfreds med løsningen. Grafikken sammenfatter en række oplysninger i en komprimeret og let overskuelig form. Jeg ville dog ønske at jeg havde haft lidt mere tid til at tilføje nogle flere elementer til fortællingen. Ret beset er grafikken et relativt statisk slideshow med fem billeder. Nogle animationer kunne hjælpe til at formidle det hele bedre. Flere informationer at arbejde ud fra havde osse været godt, men her måtte vi bero på en begrænset mængde vidneberetninger, men tæt deadline gjorde det ikke muligt at afvente flere detaljer end dem vi havde for hånden.
Se selv grafikken ‘live’ her:
Vandscooter-ulykken har osse været i andre medier:
Politiken har en flad grafik:
DR har en flad grafik om vandscooter-ulykker i hele landet og en grafik der viser hvor det er ulovligt at færdes med vandscootere. Fælles for dem begge er at de tydeligvis er komprimerede jpg-filer. Det er synd for det er fine grafikker der havde nydt godt af en højere opløsning (eller svg-format)
Det var hvad jeg fandt i denne uge. Send endelig links og/eller kommentarer.
Dette er i øvrigt ikke den eneste ugentlige publikation fra Ekstra Bladets udviklingsteams. Min gode kollega Lars K. Jensen laver hver eneste uge “Et tilbageblik på ugen der gik indenfor medier, teknologi og forretning.” Se den seneste spændende opsamling lige her:
