Mobila gränssnitt

#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.

Publikens val – om publiken själv får bestämma

När jag arbetade som guide på olika museer under 1980-talet fick jag ofta höra från besökarna att det skulle vara fantastiskt roligt om man fick vara med och påverka urvalet av de föremål som ställdes ut.

På den tiden fanns varken Internet eller sociala medier att tillgå, vilket försvårade möjligheten att genomföra en omröstning. Idag finns hela infrastrukturen och det är enkelt att nå besökarna och ge dem möjlighet att rösta på vad de vill se i kommande utställningarna. Inom ramen för Nordiska museets nya satsning Publikens val prövar vi för första gången möjligheten att låta besökarna rösta på vad de vill se utställt i museet under nästkommande år.

Publikens val är en webbplats som visar 55 föremål. Till varje föremål hör en berättelse som ger mer inblick i hur föremålet har använts m.m. Här kan man läsa om både vardagliga och exklusiva ting, från dåtid till nutid, alla med en egen historia om livet i Sverige från 1500-talet fram till våra dagar. Innehållet är nyproducerat och syftar till att ge ett berättande perspektiv på föremålen.

Besökaren kan via en röstningsapplikation rösta på de föremål man vill se utställda på Nordiska museet under 2014. Resultatet av röstningen visas live i en topplista både i museet och på webben. Röstningen pågår fram till och med den 25 augusti.

En central tanke i projektets innehållsarbete har varit att använda en plattform där informationen kan lagras och distribueras på ett sådant sätt så att den kan återanvändas och hanteras tillsammans med övrig innehållsinfrastruktur på museet. Nordiska museet har tidigare investerat i KulturIT:s plattform Kulturpunkt. Innehållet producerades därför i plattformen Kulturpunkt.

Kulturpunkt lämpar sig väl för att skapa berättelser kring föremål till skillnad från en post i Digitalt museum där innehållet är mer av typen informativ data än berättande beskrivningar. En kulturpunkt har en enkel struktur till skillnad från en post i t.ex. Digitalt museum som har en stor mängd fält som kan användas.

Kulturpunkt består i nuläget av:

ett enkelt innehållshanterings- och publiceringssystem som hanterar så kallade kulturpunkter. En kulturpunkt är i princip en post som består av innehåll som läggs in i ett antal textfält med t.ex. rubrik, ingress och brödtext samt möjlighet att lägga till mediatyper som t.ex. bilder.
ett så kallat API där man kan hämta data ifrån för att visa upp i olika typer av applikationer.
ett par befintliga gränssnitt som hämtar data från API:et och visar upp det på ett bestämt sätt. Bland annat finns ett mobilgränssnitt som på ett enkelt sätt visar upp kulturpunkterna.
ett par olika sätt att aktivera visning av kulturpunkter, t.ex. kan man läsa in en QR-kod för att visa upp en kulturpunkt i webbläsaren på en mobiltelefon.

På Kulturpunkts API byggdes därefter en separat röstningsapplikation. Röstningsapplikationen hämtar data som vi publicerat i Kulturpunkts CMS och visar upp det på lite olika sätt beroende på vilken typ av skärm och dator som besökaren använder. Röstningsapplikationen har lanserats i flera versioner och i varianter som fungerar på allt från en liten skärm på en mobil med pek-gränssnitt till en mycket stor skärm med eller utan pek-gränssnitt. I alla versioner kan man se samma innehåll, de 55 föremålen samt rösta på det föremål man vill se utställt.

Två versioner är specifikt skapade för två stora pekskärmar i utställningen:

http://publikensval.nordiskamuseet.se/monter/

http://publikensval.nordiskamuseet.se/topplista/

En version är skapad för webb-besökare. Denna version http://publikensval.nordiskamuseet.se är responsiv, vilket betyder att beroende på hur stor skärm, hur snabb dator jag har eller för den delen hur gammal min webbläsare är, så serveras jag olika gränssnitt, anpassade för just min teknik.

Det blir spännande att se hur röstförfarandet fungerar och hur det tas emot av besökarna.

Missa inte tillfället att rösta på din favorit!

Sven Rentzhog och Robert Ziherl

Ny webbplats för Nordiska museet

Idag har Nordiska museet lanserat en ny webbplats, en på många sätt efterlängtad förnyelse.

Den nya webbplatsen är byggd i Drupal 7 och är helt responsiv. Det betyder att webbplatsen är tydlig och läsbar oavsett skärmstorlek, som surfplatta och mobiltelefon.

Creuna har formgivit och Happiness har programmerat. Både form och teknisk plattform har blivit ett stort lyft. Formen möjliggör ett mer läsbart innehåll men också mer visuellt innehåll, fotografier och bilder. Sidfoten har blivit tydligare och mer användbar.

Den tekniska plattformen gör att fler nu kan redigera innehåll utan större teknisk kompetens.

Mer om projektet och om hur Nordiska museet arbetar med webbplatsen i ett kommande inlägg.

/Kajsa Hartig

Digitala produktioner i utställningen Smycken

En ny utställning, Smycken, öppnade i fredags på Nordiska museet. Sedan avdelningen Nya medier startade i januari 2011 är det första gången som digitala produktioner planerats och genomförts i en utställning enligt Nya mediers strategi.

Avdelningen har kunnat ta ett helhetsgrepp om de digitala produktionerna med egen budget och fått vara med från början i planeringen av utställningen.

Resultatet blev:

Fyra iPads i utställningen som visar tio smycken i detalj. Webbappen skildrar de smycken som visas parallellt i en monter, Guldkorn, intill surfplattorna. Guldkornen har lyfts ut särskilt för att de berättar en unik historia med stark koppling till svensk historia från 1500-talet och framåt.
Två iPads i utställningen som ger extrainformation om de smycken som visas i en monter med kronologiskt tema, en tidslinje. Tidslinjen speglas i den digitala produktionen som ger skarpa och detaljrika bilder vilka är svåra att uppfatta med blotta ögat i montern.
Två stationära datorer som ger möjlighet att söka i Nordiska museets smyckessamling. Gränssnittet är helt nyutvecklat av norska Kultur-IT och hämtar information i en mapp i vår föremålsdatabas Primus (som också utvecklas av Kultur-IT).
Insatser i sociala medier – vi berättar om utställningen, om utvalda smycken och om de digitala produktionerna.
Ett webbgränssnitt där man når de digitala produktionerna på webben, dvs Guldkorns-appen, tidslinjen och sök i samlingarna.

Flera aktörer inom museet har varit inblandade i produktionerna, digitala producenter, IT, sakkunniga, verkstadstekniker m.m.

Så hur kopplar vi det här till museets strategi för nya medier? Målen i strategin är:

Att ”Nordiska museet 2014 är ett av Nordens främsta museer när det gäller digital förmedling av kulturarvsinformation och kommunikation kring kulturhistoria och kulturarv.”
”Nordiska museet ska attrahera en ny, större och bredare publik, etablera ett starkare engagemang och fördjupa relationerna med strategiska målgrupper. I målet ingår även att förstärka och fördjupa kontakten med vår nuvarande publik.”
”Museets relation med besökarna ska ha fördjupats och resulterat i längre och återkommande besök och kontakter. Fler ska veta vad Nordiska museet är och vad det står för.”
Öka antalet faktiska besök i museet

Genom att publicera mer relevant innehåll på webben vill vi öka intresset för och kännedom om Nordiska museet. Genom att prova på nya gränssnitt och tekniska plattformar vill vi öka kontaktytorna mot publiken. Genom digitala produktioner vill vi engagera en yngre publik som vi normalt har svårare att nå, och genom publicering på webben vill vi nå en bredare publik än den som enbart kan komma till museet. Genom de digitala publikationerna vill vi förlänga upplevelsen av museet, både före, under och efter besöket.

Hur vet vi att vi har lyckats?

En av de viktigaste uppgifterna för Nya medier är att utvärdera våra insatser. Just nu utvecklar vi metoder för utvärdering av sociala medier, och vi gör detsamma för den nya webbplats vi arbetar med och som ska lanseras under det första kvartalet 2013. När det gäller utvärdering av digitala produktioner i utställningar kommer vi att till att börja med att dra nytta av de erfarenheter vi får i arbetet med sociala medier och med nya webbplatsen.

Vi ska också utvärdera hur väl Nya mediers arbetsmetoder integreras i helheten. Som stödavdelning samarbetar vi med en rad andra verksamheter i museet. Rollfördelningen är ny och nya arbetsuppgifter förs in i produktionsprocessen.

Redan har vi lärt oss mycket och inför nästa stora utställning som öppnar i oktober, Hår, kan vi nu revidera och förbättra vårt arbetssätt och våra rutiner.

Vi kommer ständigt att behöva se över rutiner för utvärdering av digitala produktioner, och i ett kommande blogginlägg berättar vi mer om hur vi resonerar kring just utvärdering av digitala insatser vid Nordiska museet.

Smycken på webben

De digitala produktionerna i Smycken når du här: http://smycken.nordiskamuseet.se

/Kajsa Hartig, digital navigatör

Planering av ett pilotprojekt – mobilguider och museer

Att förmedla innehåll via mobila gränssnitt är ett måste för museer idag. Allt fler tar del av webben via surfplattor och mobiltelefoner.

Här på Nordiska museet planerar vi just nu en mobilanpassad webbplats. Samtidigt undersöker vi möjligheterna med mobilverktyget Kulturpunkt, som jag skrev i mitt föregående inlägg här på bloggen. Vi ska genomföra några pilotstudier med Kulturpunkt, som ska utvärderas för att vi sedan ska kunna integrera verktyget i vår verksamhet.

Här kommer några sammanfattande tankar kring vårt arbete så långt.

Avgränsningar

Nordiska museet. Foto: Kajsa Hartig, CC-BY. — I Nordiska museet finns fri tillgång till WiFi, vilket möjliggör mobilguider som kräver uppkoppling. Foto: Kajsa Hartig, CC-BY.

Det är som i alla digitala projekt viktigt att definiera avgränsningar och förutsättningar. I vårt fall och i detta projekt kunde vi särskilt lista följande faktorer som avgörande:

Mål för verksamheten: Vad vill Nordiska museet med sin verksamhet? Vilket är vårt övergripande uppdrag?
Mål för pilotstudien: Vad är syftet, vad vill vi uppnå? Hur definierar vi framgång?
Pilotens avgränsningar: Hur mycket tid har vi på oss? Vilka resurser har vi till vårt förfogande?
Projektgrupp: Har projektdeltagarna erfarenhet av att producera innehåll för webben och för mobila gränssnitt?
Verktygets begränsningar: Vi har ett färdigt verktyg att förhålla oss till, vilka begränsningar har det? Kulturpunkt är en webbaserad app, som hämtar allt innehåll från en server. Det betyder att internetuppkoppling behövs. Vidare har det en fast layout som innehållet måste anpassas till – vilket har stora fördelar och till viss del nackdelar.
Formatet: Vad kan man egentligen förmedla via en mobiltelefon? Hur förhåller sig användarna till sina egna mobiltelefoner? Har de smartphones och känner de till hur de används? Kan de skanna QR-koder?
Omvärldsbevakning: Hur har andra gjort? Finns erfarenheter att hämta från andra projekt?
Tillgång till internet/3G: För turister är 3G inte ett alternativ eftersom det blir allt för kostsamt. Men även för svenska mobilabonnemang kan det t.ex. finnas begränsningar i hur mycket man får surfa. Finns god täckning för 3G? Finns behov av WiFi? Går det att ordna?
Lokaler/miljö: Hur ser den fysiska miljön ut i vilken guiden ska användas? Är den tillgänglig? Finns hinder att ta hänsyn till? Är det utomhus i solsken/skugga?
Publiken: Kan vi tillräckligt mycket om publiken? Om inte hur tar vi reda på mer? Vilken publik kan vi nå på den fysiska platsen? Vilken publik vill vi nå? Kommer publiken i grupp eller själva? Har de barn med sig? Hur rör de sig i den fysiska miljön?
Innehåll: Finns bilder digitaliserade? Finns texter skrivna? Hur mycket redaktionellt arbete krävs?
Upphovsrätt: Kan vi dela materialet fritt? Finns material som är skyddat av upphovsrätt?
Upplevelsen: Vi vill absolut koppla guiden till en fysisk upplevelse, som förstärks av guiden, därför är detta en av de avgörande punkterna. Vilken upplevelse är möjlig att ge under rådande förutsättningar, med befintligt verktyg och innehåll? Hur ser den fysiska upplevelsen ut, är den lång eller kort?
Marknadsföring: Har vi avsatt resurser för marknadsföring? Behöver vi annonsera? Trycka nya skyltar? Kan personalen bidra till att supporta och marknadsföra mobilguiden? I vilka andra kanaler ska vi marknadsföra guiden? Kan vi ge ”teasers” exempelvis via hemsidan?
Utvärdering: Hur ska vi utvärdera pilotprojektet? Kan vi använda Google Analytics? Bör vi komplettera med intervjuer och deltagande observation? Digitala enkäter? När övergår pilotstudien i skarp mobilguide?

Mängden information man måste ha innan ett mobilappsprojekt ens kan börja planeras är ganska omfattande. Men gör man det ordentligt från början blir efterföljande projekt både kostnadseffektiva och förhoppningsvis även framgångsrika ur publikhänseende.

För vår del har ovanstående analys lett till att vi fokuserat om, från mobilguider utomhus till inomhus. Främst på grund av behovet av WiFi, där vi behöver mer tid på oss för att utreda tekniska behov.

Analysen har också lett till att en ursprunglig idé som tidigt lades åt sidan, åter är i fokus eftersom fördelarna visade sig vara större än nackdelarna.

Med andra ord, ju mer vi har på fötterna för att fatta beslut om arbetet med mobilguiderna, desto större möjlighet har vi att träffa rätt från början. Ett huvudsyfte med vår pilotstudie är att få tillräckligt många att använda guiden för att vi ska kunna utvärdera med faktisk användarstatistik. Därefter sätter vi oss ner igen och diskuterar nästa steg i arbetet med Kulturpunkt.

Kommentar: Börjar man från noll, dvs inte har något färdigt verktyg att förhålla sig till finns ytterligare faktorer att ta hänsyn till, exempelvis om man ska bygga en webbapp vs en s.k. native app.

Mobilguider och QR-koder

Verktyget Kulturpunkt testas på dator. Foto: Kajsa Hartig, CC-BY.

Just nu pågår ett pilotprojekt på Nordiska museet där vi testar ett verktyg för mobilguider. Det är norska Kultur-IT (som också utvecklar museidatabasen Primus) som står bakom verktyget Kulturpunkt. Tjänsten är under tidig utveckling och i högsta grad en betaversion.

Nordiska museet är ett av tre svenska museer som deltar i betatestningen, de övriga två är Statens Maritima Museer och Arkitekturmuseet. Alla tre institutioner ingår som samarbetspartners till Kultur-IT, tillsammans med en rad norska museer.

Tanken är att vi genom tester och utvärdering ska kunna utveckla ett fullfjädrat verktyg som blir öppet för andra institutioner att använda. Kultur-IT står alltså för den tekniska utvecklingen och de deltagande museerna bidrar med kunskap om användningsområden, användarvänlighet och möjlig integration i museiverksamheterna.

Nordiska museet arbetar som sagt just nu med ett pilotprojekt, där vi skapar mobilguider om dels en person, Årstafrun, och dels en byggnad, Lusthusporten. Guiderna ska nås via QR-koder på skyltar, men också i förlängningen gå att nå till exempel via vår hemsida.

I arbetet ingår genomlysning av verktyget och dess användningsområden, intervjuer med en fokusgrupp, innehållsproduktion och skarpa tester i och i anslutning till museet.

Följ oss här på bloggen i arbetet med att bygga innehållet och testa mobilguiderna.