#VarjeLampaRäknas

I samband med Earth Hour den 19 mars testade vi på Nordiska museet en enkel mobilanpassad undersökning, #VarjeLampaRäknas. Som ett led i utbildningen Steget mot en digital organisation ville vi prova en ”kommunikativ insamling” – insamling som en social och kommunikativ aktivitet, inte bara ett medel för att utöka museisamlingen. Utmaningen för oss på Nya medier var att på kort tid gå från en lös idé kring ett insamlingstema till att ha en fungerande prototyp på plats. Hur blev resultatet och vad lärde vi oss på vägen?

Vi ville uppnå två saker med undersökningen: dels få reda på vilka sorters lampor som är populära just nu, dels sprida kunskap om att svenskar har jämförelsevis många ljuskällor hemma. I höst öppnar utställningen Nordiskt ljus på Nordiska museet och fram tills dess vill vi prova olika sätt att uppmuntra till dialog kring ljus, lampor och belysning.

Från idé till prototyp

Vi lanserade undersökningen den 19 mars (samma dag som Earth Hour) och uppmärksammade i museets sociala mediekanaler. Några hundra personer var inne på sajten och trettio (inklusive ett par museianställda) valde att delta i undersökningen genom att fylla i formuläret. De uppladdade bidragen fick desto större spridning och nådde ca 45 000 personer. Framför allt på Twitter fick vi betydligt högre engagemangsfrekvens än vad vi brukar uppnå i vanliga fall.

De tekniska lärdomarna vi tar med oss är: ja, det går att koda ihop en (nästan) fullt fungerande, helt skräddarsydd undersökning/insamling på några dagar. Med hjälp av öppna ramverk som jQuery och Bootstrap går det snabbt att sätta ihop en prototyp. Och med APIer till våra lagringsplattformar (några finns, några är under utveckling) kommer vi att kunna spara det insamlade materialet på ett framtidssäkrat sätt – något som dock låg utanför ramarna för just det här projektet.

Avvägningar i teknik och design

Den färdiga appen består av tre vyer: ett formulär, en lista över uppladdade bidrag och en tacksida. Koden är skriven i html, css, javascript och php med hjälp av ramverken jQuery, Bootstrap och Moment.js.

Formuläret

Eftersom museer samlar för evigheten tenderar museers insamlingsformulär att vara långa och krångliga. Vi kunde runda detta hinder genom att acceptera att det insamlade materialet i det här fallet inte ska tas in i museets samlingar utan istället få en begränsad livslängd på webben.

Formuläret består av ett fotofält, ett fält för antal lampor hemma samt demografiska uppgifter (namn, ålder och ort). Om den som laddar upp är minderårig kompletteras formuläret dessutom med ett extra adressfält så att vi kan kontakta målsman vid behov.

För att inte skrämma bort användaren direkt valde vi att ”fälla ut” formuläret med jQuery i två/tre steg (beroende på ålder). Först visas bara bildfältet (formaterat som en knapp) och antal lampor. När antal lampor fyllts i visas övriga fält. Skicka-knappen går att trycka på först när alla andra fält är ifyllda.

Innehållsvalidering är så minimal som möjligt. Med hjälp av html-attributet pattern=”\d*” visar iphone ett numeriskt tangentbord. Värdet i åldersfältet avgör i sin tur om fälten för målsmän behöver visas eller inte. Användaren får visuell återkoppling med hjälp av Bootstraps inbyggda css-klass ”btn-success” som aktiveras när något är ifyllt i ett fält.

Oformaterad uppladdningsknapp
Den formaterade knappen

Det finns flera olika sätt att ändra utseendet på ett filuppladdningsfält. Jag använde en span-variant av Cory LaViska.

När användaren trycker på ”Skicka in svar” skickas formulärinnehållet vidare till ett php-skript som sparar innehållet i jsonformat på servern. Att skriva direkt i en jsonfil är ju inte den vackraste lösningen men duger för en prototyp som denna. Formatet json är valt för att härma en mer ordentlig API-lösning – när innehållet hämtas till listvyn skulle det vara enkelt att byta ut den statiska json-filen mot att hämta från ett API.

Eftersom formulärinnehållet lagras publikt tillgängligt i fulltext på servern vill vi inte lagra några e-mailadresser där. De mejlas istället till oss med hjälp av php-biblioteket PHPMailer. Det är en bit kvar till det e-maillösa samhället!

Listan med uppladdade bidrag

Listvyn är utformad för att likna de bild- och innehållsflöden som dominerar i sociala medier idag: en omvänd kronologisk lista med bild och bildtext. Innehållet hämtas ur en json-fil (se ovan) som fyllts på med hjälp av formuläret.

Några tekniska detaljer är värda att utveckla. En bugg fick slinka igenom eftersom vi inte hittade några enkla lösningar på nätet: desktopwebbläsare verkar inte läsa in rotationsinfo från bilder uppladdade från (iOS?-)mobiler. Eftersom det blir rätt i Safari för iOS och hela undersökningen är ”mobil först” (80 % mobila sidvisningar) fick buggfixen låg prio och hanns inte med.

Istället för att ladda in alla uppladdade bilder direkt använder vi en ”infinite scroll”-lösning. Tre nya bilder i taget laddas in när användaren scrollar längst ned på sidan.

Slutligen: med hjälp av javascriptramverket Moment.js formateras datumen automatiskt till relativa datum – precis som vi är vana vid från sociala medier.

Snabbt och enkelt

Vårt fokus genom hela processen var att så snabbt som möjligt sätta ihop en prototyp att testa på publiken den 19 mars. Jämfört med gratislösningar som Polldaddy eller Google Forms erbjöd ett egenbyggt formulär betydligt större möjligheter att skräddarsy såväl utseende som interaktion. Tiden lagd på utveckling och utformning är fortfarande minimal i jämförelse med museets senaste större kodprojekt som Äppelappen och Tidskikaren vilket gör det möjligt för oss att prova fler insatser framöver.

Med smak av humle

I veckan öppnade Nordiska museets nya utställning Med smak av humle – odla och brygg. Utställningen visar humleodling och ölbryggning förr och nu. Dels med föremål, bilder och recept ur museet samlingar och arkiv, dels med modern utrustning, nytagna bilder samt tips och råd från dagens hemmabryggare och humleforskare.

Avdelningen Nya medier har bidragit med några digitala produktioner till utställningen: en timelapsefilm, en serie intervjufilmer och en digital insamling av öletiketter.

Utskrivna etiketter ipad med etiketter

Digital insamling av öletiketter

Nordiska museet bedriver ett antal olika digitala insamlingsprojekt. För den här insamlingen valde vi att göra ett enkelt webbformulär. Insamlingen påbörjades den 8 maj och hittills har ett hundratal hemmabryggare laddat upp drygt 270 etiketter.

Några av etiketterna finns utskrivna på ölflaskor i utställningen. Betydligt fler (åtminstone en etikett per uppladdare) visas i en väggmonterad ipad. Etiketterna finns också på Nordiska museets pinterestsida.

film i utställning

Intervjufilmer

Tillsammans med åt Skogen Produktion tog vi fram nio filmer à 2–3 minuter. I filmerna bidrar forskare, hemmabryggare och humleodlare med sina kunskaper om humle, humleodling och humlens roll i ölbryggning. Filmerna visas på skärmar i utställningen (med svenskt ljud i hörlur samt textade på svenska och engelska) och kommer även att spridas i museets digitala kanaler.

Timelapsefilm

Timelapsefilm

Som en del i Programmet för odlad mångfald odlas 24 olika svenska humlesorter på Julita gård. Vi ville fånga humlens växtkraft på bild och tog därför ett antal stillbilder dagligen i tre månader. Dessa klipptes sedan samman till en 20-sekundersfilm som visas på två projektorer. Förhoppningsvis kan rörlig bild i stort format vara en bra indragare som lockar besökarna att fortsätta in i utställningen.

Tidskikaren

Tidskikarens startsida.

Under hösten och våren har jag arbetat med en interaktiv karta, Tidskikaren, som visar upp odlingslandskapets förändringar kring Julita gård från 1700-talet till idag.

Tidskikaren bygger på en studie där forskarna Per Larsson och Anna Berg har gått igenom ett historiskt kartmaterial och med hjälp av detta och andra källor skapat historiska översiktskartor över Julitaområdet. Kartorna är en uppskattning av vilka mark- och odlingstyper som funnits var och när. Vi vill att Tidskikaren ska hjälpa besökaren att förstå hur landskapet förändrats av mänsklig påverkan (främst i form av jordbrukets förändrade metoder) och varför (ny teknik, ändrade handelsmönster och ekonomins skiftningar). I det här blogginlägget tänker jag kort berätta om vilka tekniker vi använt för att visualisera forskningsresultaten.

Markslag

För att underlätta presentationen av materialet valde vi att förenkla och slå samman olika marktyper till några breda kategorier: äng, hagmark, åker och skog. Varje markslags förändring kan följas över tid med hjälp av de två knappraderna överst och nederst på sidan.

Ängen, en vanlig marktyp på 1700-talet, är i princip försvunnen idag. År 1750, år 1900 och år 2015.

Forskarna levererade sina kartor i vektorformatet shapefile, som går att exportera från vanliga GIS-program. För att visa upp vektorkartorna använder vi det öppna ramverket Leaflet, ett javascriptbibliotek för att göra och visa interaktivt kartmaterial på webben. Shapefiles går att visa i Leaflet med hjälp av plugins men vi valde istället att konvertera filerna till GeoJSON med hjälp av det fritt tillgängligta verktyget GDAL.

Kartorna fungerar bra för att belysa markslagens utbredning, men fångar inte de mer komplexa förändringarna inom respektive markslag. Därför valde vi att komplettera kartmaterialet med ett antal tematiska fördjupningspunkter.

Fördjupningspunkter

Under ledning av Anna Berg togs det fram ett antal fördjupningspunkter för varje tidslager och markslag. Punkterna består av några stycken text och ett illustrerande fotomaterial, ofta hämtat ur Nordiska museets fotoarkiv.

Arbetskrävande slåtter. Fördjupningspunkt för ängar 1750–1850.

För att enkelt kunna ändra i texterna och bildmaterialet har vi använt oss av ett CMS, nämligen det av Kultur-IT utvecklade Kulturpunkt. Text, bild, ljudfil och koordinater hämtas via ett API (men cachas lokalt på vägen för att få bättre prestanda).

Alla texter finns tillgängliga som inläsningar, gjorda av Julita gårds personal tillsammans med Gröna ljud. Ljudfilerna spelas upp direkt i html5 (vilket ställer till det för den som använder IE8 eller äldre). Bildernas skalas för att fylla hela spaltbredden med en kort snutt javascriptkod.

Prestanda

I Tidskikaren första version, som var klar i mars 2015, ritades varje tidslager upp i vektorformat direkt i webbläsaren. De tyngsta GeoJSON-filerna är en dryg MB och innehåller uppemot tusen ytor som ska hanteras i javascript. Kartan var segladdad och de krävande beräkningarna gjorde det trögt att flytta runt i kartan, framför allt på läsplattor och i mobiltelefoner med långsammare processor och grafikkort.

Laddningstid före och efter optimering, testat med Pingdom Tools.

Vi bedömde helt enkelt att kartan behövde optimeras, och det uppenbara valet var att byta ut vektorlagren mot förrastrerade kartbilder, så kallade raster tiles. Earth People byggde ett skript i PhantomJS som stegar sig igenom de olika tids- och markslagslagren och genererar korrekt namngivna och beskurna skärmdumpar. Sidstorleken gick från 9,5 MB till 2,2 MB och kartan går nu betydligt snabbare att ladda och att flytta sig runt i.

Öppna ramverk, inga plugins

Tidskikaren bygger till stor del på ramverk släppta som öppen källkod. Den använder Leaflet, Bootstrap och Jquery samt tar hjälp av ett antal Leaflet-plugins: Leaflet DVF, Leaflet AJAX och Leaflet Plugins. Genom att använda öppet tillgängliga ramverk har vi kunnat koda större delen av kartan själva, innan vi anlitade Earth People för att hjälpa oss med kodstruktur, de lite mer komplicerade funktionerna och med interaktionsdesign och grafik.

Genom att använda ramverken har vi inte behövt använda några webbläsarplugins. Tidskikaren är ren html, css och javascript vilket förhoppningsvis gör den någorlunda framtidssäker, till skillnad från exempelvis de museisajter i flash som inte går att besöka i iOS-enheter. Det vi vinner i kompatibilitet förlorade vi i prestanda, men förhoppningsvis räcker den optimering vi gjort med hjälp av rastrering tillräckligt långt så att även de med något äldre datorer eller läsplattor ska kunna ta del av innehållet i kartan.

Lean-utveckling

Vi har försökt utveckla Tidskikaren med sikte på det som i webbutvecklingskretsar kallas för lean-utveckling. Genom att använda andras kod (i form av öppna ramverk) snarare än att skriva allt själva har vi kunnat vara mer flexibla kring funktion och interaktionsdesign. Den Tidskikare som det nu går att ta del av är en MVP (minimum viable product) där många potentiella funktioner saknas. Förhoppningsvis kan vi med hjälp av input från användare bestämma en fortsatt väg framåt för hur vi kan visualisera och tillgängliggöra odlingslandskapets historia.

Har du kommentarer och funderingar kring kartan? Kommentera nedan eller hör av dig till mig på aron.ambrosiani[at]nordiskamuseet.se eller på Twitter: @AronAmbrosiani!

New uploads to Wikimedia Commons

On March 26 this year, Nordiska museet arranged a wikipedia edit-a-thon about fashion in collaboration with Wikimedia Sweden, Europeana Fashion and the Army Museum. Before the event, approximately a thousand images were uploaded to Wikimedia Commons. The images were of two kinds: fashion plates and fashion photos. Two months later, it is interesting to see how the images have actually been put to use on Wikipedia.

Men in top hats, 1847. From Stockholms Mode-journal.

Fashion plates

What: 1051 digitized fashion plates from Swedish 19th century fashion magazines, 1818–1891. 11 images are used 27 times on Wikipedia.

Most used image: a plate from Stockholms mode-journal – Tidskrift för den eleganta werlden från 1847 illustrates the article about top hats in twelve languages.

In-depth statistics about the image usage

Inspection of nylon stockings at Malmö Strumpfabrik, 1954. Photo by Erik Liljeroth, CC-BY-SA 4.0.

Fashion photos

Vad: 28 digitized fashion photos also on display in the exhibition Folkhemmets mode (“folkhemmet” was used to describe the Swedish welfare state from the 1930s to 1970s). The exhibition contains an additional ten or so photos that weren’t possible to publish with a CC-BY-SA license. 13 images are used 38 times on Wikipedia.

Most used image: a fashion photo from Malmö strumpfabrik 1954 illustrates the article about nylon stockings in eighteen languages and articles about nylon and textile industry in Swedish and English.

In-depth statistics about the image usage

How often are the images displayed?

Compared to our own channels, the images uploaded to Wikimedia Commons have a much wider reach. Images from Nordiska museet have been displayed approximately 1.5 million times from January to April. April 2015 was also a record for us – for the first time since statistics are available (that is, since April 2013), images from Nordiska museet have been viewed more than 500,000 times in a month.

How many images from Nordiska museet are used in Wikipedia articles?

After the uploads in March, there are now 2801 images from Nordiska museet available on Wikimedia Commons. Most of them have been uploaded by the museum, but there are also images uploaded by individual users, sometimes using our digitized collection at Digitalt museum.

387 images (14 % of the total) are used 805 times on 68 different Wikipedia projects (most of them being different language versions of Wikipedia).

In-depth statistics

Nya uppladdningar på Wikimedia Commons

Den 26 mars i år ordnade Nordiska museet en skrivstuga om mode tillsammans med Wikimedia Sverige, Europeana Fashion och Armémuseum. I samband med detta kunde vi ladda upp ett tusental nya bilder till Wikimedia Commons. Bilderna var av två typer: modeillustrationer och modefotografier. Nu när det gått knappa två månader sedan skrivstugan kan det vara kul att ta en titt på hur bilderna faktiskt används på Wikipedia.

Män i cylinderhattar, 1847

Modeillustrationer

Vad: 1051 inskannade modeillustrationer ur svenska modemagasin från åren 1818–1891. 11 bilder används 27 gånger på Wikipedia.

Mest använda bild: ett blad ur Stockholms mode-journal – Tidskrift för den eleganta werlden från 1847 illustrerar artikeln om cylinderhatt på tolv språk.

Detaljerad statistik om användning av bilderna

Nylonstrumpeinspektion vid Malmö Strumpfabrik, 1954. Foto: Erik Liljeroth, CC-BY-SA 4.0.

Modefotografier

Vad: 28 inskannade fotografier som även visas i utställningen Folkhemmets mode. Utställningen innehåller ytterligare ett tiotal fotografier som inte bedömdes lämpliga att sprida med CC-BY-SA-licens. 13 bilder används 38 gånger på Wikipedia.

Mest använda bild: ett modefotografi från Malmö strumpfabrik 1954 illustrerar artikeln om nylonstrumpor på arton språk samt artiklar om nylon och textilindustri på svenska och engelska.

Detaljerad statistik om användning av bilderna

Hur ofta visas bilderna?

En stor fördel med att dela bilder på Wikimedia Commons jämfört med de egna kanalerna är att bilderna får en helt annan räckvidd. Bilder från Nordiska museet har visats ca 1,5 miljoner gånger under första tertialet 2015, och april 2015 är den månad (sedan statistik finns tillgänglig, dvs april 2013) med flest bildvisningar någonsin. För första gången visades Nordiska museets bilder mer än 500 000 gånger på en månad.

Hur många av Nordiska museets bilder används på Wikipedia?

Efter uppladdningarna i mars finns nu totalt 2801 bilder från Nordiska museet på Wikimedia Commons. De flesta av dessa är uppladdade av museet, men det finns även bilder som enskilda användare har hämtat från exempelvis Digitalt museum.

387 bilder (14 % av antalet uppladdade bilder) används 805 gånger på sammanlagt 68 olika Wikipediaprojekt (varav de flesta är olika språkversioner av Wikipedia).

Detaljerad statistik