1

Jonas Sandstedt

Högskolan för Design och Konsthantverk2014-04-11 – Examensprojekt HDEX10

Kandidatprogrammet i design

aloneEtt instrument för att skapa sin egna version av musikvideon alone

Ett utforskande examensprojekt av Jonas Sandstedt och Erik Slättberg

2

Innehållsförteckning

Inledning ....................................................................... 4 Mål .................................................................... 4 Bakgrund ........................................................ 4 Syfte ................................................................. 5 Frågeställningar .......................................... 5 Avgränsningar .............................................. 5 Alone ................................................................ 5Genomförande ........................................................... 6 Research ......................................................... 6 Analys .............................................................. 7 Process ............................................................ 7Resultat ......................................................................... 8 Inledning ........................................................ 8 Gränssnitt ...................................................... 8 Samarbete ..................................................... 9Diskussion & Reflektion ........................................ 10 Betraktare eller användare .................... 10 Det fysiska gränssnittet ........................... 10 Segment eller hela spår? ...,...................... 11 Vad är ett bra samarbete? ....................... 11 Lärdomar från projektet .......................... 11 Framtida utveckling ................................... 11Källförteckning ......................................................... 12 Delar ur mitt studiematerial: ................. 12Bilagor - bilder ........................................................... 13

4

Mål

En musikvideo kan vara både en visuell tolkning av musiken eller en helt egen berättelse med musi-ken som ackompan-jemang, men filmen som medium är tra-ditionellt en envägs-kommunikation. För att öppna upp för en kom-munikation mellan filmen/musiken och betraktaren ville jag tillföra ett extra lager i form av interaktivitet. Jag ville genom interaktionen få betraktaren att bli en medskapare av verket: en användare. Detta tror jag ligger i fas med en stor målgrupp som dagligen skapar, snarare än kon-sumerar innehåll.

I projektet ville jag skapa ett gränssnitt som gjorde att använ-daren skulle uppleva att hen är en del av musikvideon genom att t ex påverka handlingen och berättandet, precis som när man interagerar i ett spel. Mitt mål var att kombinera och fördjupa mig i mina intressen inom rörlig grafik, interaktivitet,

berättande och musik. Detta skulle resultera i en fungerande interaktiv musikvideo för en di-gitalt medveten målgrupp som är intresserad av att själva skapa och forma sin omgivning. Jag ville även utveckla mitt manér inom rörlig grafik. Projektet skulle till stor del gå ut på att konstruera en metod och en struktur för ett samarbete mellan mig och en kompositör där vi skulle kunna inspireras av varandras arbeten och tillsammans skapa verket.

BakgrundJag har tidigare arbetat med film, rörlig grafik och webbsidor/interaktivitet/gränssnitt. Un-der många år utbildade jag mig även till musiker, så nu ville jag sammanföra alla dessa delar i ett projekt. Då kom jag på idén att göra en interaktiv musikvideo. Interaktiva musikvideos är dock ingen ny idé, utan har testats flera gånger tidigare. Interaktio-nen blir dock oftast en form av effektsökeri utan något egentligt djupare syfte (se exempel på s. 6).

Som inspiration ville jag istället utgå från spelindustrin som man skulle kunna säga är experter på interaktivt berättande.

Liknande projektMobile Evolution - Under min tid som praktikant på infor-mationsgrafikbyrån Golden Section Graphics gjorde jag en rörlig infografik där man kunde navigera genom att klicka på olika årtal.

Mjölk - Ett webbprojekt där jag gestaltade artisten och kom-positören Cornelia Arvidssons musik i form av en hemsida där man kan navigera runt och kolla på film och bilder sam-tidigt som musiken spelas i bakgrunden.

Inferno (Utforskande projekt, HDK 2012) - Genom att utforska mina gamla mardröm-mar från min barndom, försökte jag med animation bygga upp samma känsla som jag fick från dessa drömmar.

Inledning

5

SyfteAtt engagera och involvera människor i verket har som syfte att skapa ett starkare band mellan användaren och musikvideon, att göra det lättare för användaren att tolka musiken. Jag hoppas med den här musikvideon få människor att stanna upp och slukas upp för en kort stund och bara glömma bort allt runtomkring dem.

Jag hoppas att per-soner som upplever det här verket får de känslor jag vill för-medla och verkligen känner sig delaktiga i upplevelsen, att de lever sig in i berät-telserna om ensam-het och kampen att komma ifrån den.

FrågeställningarHur kan ett gränssnitt se ut och fungera för att få användaren att bli medskapare av musikvideon?

Hur kan jag skapa ett bra samar-bete med en kompositör där båda kan inspireras av varandras arbete?

AvgränsningarJag ville i mina avgränsningar undvika att skapa någon ny tek-nisk lösning, då det skulle ta för mycket tid i ren programmering, utan planerade att hitta smarta sätt att använda befintlig tekno-logi som jag var bekant med.

Min primära målgrupp var en skapande människa, är datorvan, redan gillar musikgenren och är musik- och spelintresserad. Men efter tester så kunde jag se att den målgruppen endast gällde för en typ av användning av ver-ket. Som ett resultat av att verket är ett instrument finns olika svårighetsgrader som tilltalar oli-ka målgrupper. Allt från att veta exakt hur man kan kombinera olika segment med varandra och jobba musikaliskt, till att bara köra igenom ett spår i sin helhet.

För att underlätta användartes-terna valde jag att endast testa på människor i min omgivning.

Jag fokuserade inte heller på marknadsföring av verket eller andra saker runt omkring. Andra avgränsningar var att endast testa runt 2-4 olika gränssnitt och ett par olika visuella manér för att bäst se vad som kunde fullfölja mina mål, samt att det färdiga verket endast skulle innehålla omkring 6min material med alla variationer. Detta för att jag skul-le kunna fokusera mer på gräns-snitt och metodutveckling

AloneResultatet av mitt projekt blev det interaktiva instrumentet Alo-ne. Temat för verket var färden mellan ensamhet och gemenskap samt ordet periferi (i kontexten att det kan finnas människor runt omkring en ensam person som den inte ser). Det här temat tror jag många kan känna igen sig i, alla har vi säkert någon gång känt oss ensamma, även om vi kanske inte riktigt varit det.

I verket finns mycket symbolik som går att tolka och diskutera omkring, så verket skulle kunna fungera som en språngbräda för en fortsatt diskussion kring te-mat, då vi i norden inte är så bra att prata om vare sig ensamhet eller depression.

Mer om resultatet kan du läsa på sidan 8.

Projektet i sig var av en utforsk-ande karaktär, där jag undersökte hur jag med en metod kunde ska-pa ett bra klimat mellan mig och en extern kreatör, där båda kunde inspireras av varandras skapelser och tillsammans skapa verket. Resultatet blev olika segment där vi tolkade varandras material och lät på så sätt verket byggas upp tillsammans av oss båda.

Läs mer om metoden under ”Samarbete” på sid 9.

6

Research Jag började mitt arbete med att undersöka vilka liknande projekt som redan existerar. Det visade sig finnas en hel del interaktiva musikvideos, och många har pro-ducerats under de senaste åren. Till höger finns några exempel.

Parallellt med att hitta exempel på interaktiva musikvideos letade jag även inspiration bland spel, traditionella musikvideos och appar. Exempel på inspirations-källor är spelet LIMBO med dess underbart vackra miljöer, musikvideorna Thriller av Mi-chael Jacksson och The Raven that Refused to Sing av Steven Wilson, den interaktiva musikvi-deon Carry Me (http://carryme.tv) samt Robin Daveys svartvita GIF-animationer (http://bit.ly/1mNMrB7).

Jag passade även på att läsa på om Gamification, eller spelifiering som är den svenska termen, om olika spelmekanismer och hur de påverkar användarens upplevelse av produkten. Där fastnade jag främst för belöningar i form av inre motivation (det ska vara kul att använda verket) och att det finns olika svårighetsnivåer (desto bättre du lär dig de olika delarna desto större kreativt kan du uttrycka).

En stor del i projektet blev även att läsa på och förstå tekniken bakom webbstandarderna för HTML5-video och ljud.

Exempel på interaktiva musikvideos: The Wilderness Downtown http://www.thewildernessdown-town.comDetta är en musikvideo där du kan skriva in din adress där du växte upp och genom en bland-ning av olika tekniker se dina gamla kvarter mixas med anima-tioner och videos.

Bob Dylan - Like A Rolling Stone http://video.bobdylan.comEn sida där du kan växla mellan olika påhittade TV-kanaler med personer som mimar till Bob Dylans låt.

Just A Reflector https://www.justareflektor.comGenom att synkronisera filmen med en smartphone kan man styra vad som händer på dator-skärmen genom att vinkla och vrida mobilens skärm som är riktad mot datorns webbkamera.

Pharrell Williams - Happy http://24hoursofhappy.com/Här får man följa olika personer som mimar låten Happy under alla dygnets 24h, där användaren själv kan bläddra runt bland de olika tiderna.

Genomförande

7

AnalysGemensamt för de exempel på interaktiva musikvideos på före-gående sida, och för många andra verk jag testade, var att det var mycket experimenterande med olika tekniker för att manipulera det visuella men att man inte kunde styra musiken. Detta anser jag leder till ett mer kontrollerat användande, men samtidigt finns det stor potential i att låta använ-daren få en större frihet. Därför bestämde jag mig för att även musiken skulle gå att påverka.

Efter att ha läst på om tekniken för hur man implementerar HTML5-videos och ljud insåg jag att det inte finns några lik-nande lösningar som jag ville an-vända mig av, så därför beslutade jag mig för att skriva min egna kod med hjälp av några färdiga skript jag hittade.

ProcessEn stor del i mitt projekt bestod av att skapa ett bra samarbete med en kompositör som jag valde att samarbeta med. Där byggde jag upp ett system för att tolka varandras material, se vilka segment vi skulle jobba med och hur mycket som var kvar totalt att göra.

Utvecklingen av gränssnittet bestod till största delen av att testa olika tekniska lösningar

och koppla det till de fysiska knapparna på ett vanligt tang-entbord på olika sätt. Dessa olika gränssnittsvariationer testades sedan på personer i min omgiv-ning, framförallt på personer som stämde in i min målgrupp.

Ett av de problem som dök upp under projektets gång var användare försökte klicka på de beskrivande symbolerna på start-sidan för att interagera (se bild 1). Då testade jag att använda enbart text som beskrivning (se bild 2), men det resulterade i att personen inte läste instruktionen. Istället gjorde jag mindre symbo-ler samt lät mer förklarande text dyka upp ifall användaren klickar på symbolerna.

Mest tid tog dock själva vi-deo-materialet. Jag hade bestämt mig för att utgå från stilen i ett 30s klipp som jag gjorde under ett tidigare utforskande projekt i tvåan på HDK. Detta var en stil som byggde på frame-by-fra-me animationer, med i mitt fall en hastighet på 12 bilder per sekund. Detta ledde till att varje tiosekunders-segment tog omkring 8h, eller totalt 104h av total 293h som jag hade på mig i projektet. Detta ledde till att jag inte kunde lägga lika mycket fokus på att utforska lika många olika gränssnitt som jag velat.

Stilen bidrog däremot till att förstärka temat om ensamhet genom att skapa kontraster mel-lan de stilla miljöerna och den

fladdrande figuren och objekten, som om den var de var de enda levande objekten. Denna teknik gjorde även att man fokuserade på dessa objekt, och gjorde att stilla scener fylldes med liv.

I de scener med personen i har jag använt mig av referensvideor på mig själv som springer, ramlar, rör i kaffe etc som jag sedan målat ovanpå för att kopiera na-turliga rörelser. Detta var ett sätt att snabba på arbetet då jag inte hade så mycket tidigare anime-ringserfarenhet från människor som rör sig.

Bild 1: Startskärmen - version 1

Bild 2: Startskärmen - version 2

8

Resultat

Bild 3: Mellanslagstangenten och piltangenterna

fungerar som det fysiska gränssnittet. (Större

bilder kan ses längst bak)

Alone är namnet på det verk jag skapat tillsammans med kom-positören Erik Slättberg. Jag har ansvarat för allt förutom själva musiken. Vi har även tillsam-mans diskuterat fram tema, vad vi vill förmedla och utbytt idéer.

Verket är en webbaserad inter-aktiv musikvideo/instrument där man med piltangenterna kan bläddra mellan olika spår, där varje spår har en egen berättelse, en egen video och egen musik. Samtidigt hör alla delar ihop och användaren kan mixa dem som den vill för att skapa något nytt.

När verket började blir färdigt insåg jag mer och mer att det vi skapat inte är en interaktiv musik-video, utan snarare ett musikaliskt och visuellt instrument. Detta gör att upplevelsen av verket, precis som när en DJ skapar sina verk, påverkas av vem som spelar. Användaren kan välja att inte byta spår alls, eller att byta hela tiden vilket ger en helt annat resultat.

GränssnittDet första målet med projektet vara att skapa ett gränssnitt där be-traktaren kan bli en användare och en medskapare av musikvideon.

Det gränssnitt jag främst jobbat med är det vanliga tangentbor-det, dels för att det är lätt att jobba med ur en utvecklingssyn-punkt, och dels att jag planerar att publicera verket på internet.

För att göra interaktionen så lätt som möjligt begränsade jag mig till endast piltangenter och mel-lanslagstangenten (se bild 3).

För att starta musikvideon så trycker man på mellanslagstang-enten ( ), detta är en tangent som används som standard för att starta en video, både på webben och på datorer. För att sedan bläddra mellan de olika spåren använder man piltangenterna ( ).

& växlar mellan spår 1, 2 & 3, medans tillåter använda-ren att mixa de andra spåren tillsammans genom att lägga två videos på varandra.

Startskärmen (se bild 4) består av en titel, en enklare beskrivning av gränssnittet samt en copy-right-text.

När personen klickar på eller dyker små indikationer upp på vilket spår man valt för att ge en tydlig koppling till vad som händer. Dessa dyker endast upp på startskärmen och under de 10 första sek. av verket.

Trycker man på första gången så startas filmen, därefter kommer man tillbaka till startskärmen varje gång man pausar filmen (bild 4).

När verket har nåt slutet (som händer efter 2 min och 10 sek) kommer användaren till en slutskärm där personen kan välja

Bild 4: Startskärmen

9

Bild 5: Slutbild - välj att spela om eller att dela

150ej

150ej

150ej

151je

151je

151je

152e

152e

152e

250je

250je

250je

149ej

149ej

149ej

450je

450je

450je

449e

449e

449e

252j

???

???

Jonas jobbar med

18 mars 2014

Erik jobbar med

252je

???

???

251ej

251e

251e

451e

451e

451e

249ej

249ej

249ej

148je

148j

148j

???

???

???

Track 2

Track 3

Track 1Stat:14 segment / spår = 2.3minTotalt: 42 segment = 7min

Färdiga segment: 6 stKvar att göra: 36 st (85% kvar)

Bild 7: Struktur med 10s-segment med allt

material som gjorts fram till 22 mars 2014

Bild 8: Segments-namn

Bild 6: Utkast på flödesschema

Fler samt större bilder kan ses längst bak

att spela om verket eller att dela det till andra (se bild 5).

SamarbeteProjektets andra mål var ”Hur kan jag skapa ett bra samarbete med en kompositör där båda kan inspireras av varandras arbete?”

Genom mailkonversation och skype-möten kom jag och kompositören Erik gemensamt fram till temat för verket som var en färd mellan ensamhet och gemenskap samt ordet periferi (i kontexten att det kan finnas människor runtomkring perso-nen som den inte ser).

Metoden som jag utvecklade bestod i att projektet delades upp i 10sekunder långa segment fördelat på 3 spår (se bild 6 & 7). Dessa delades in och namngavs med hundratal. Från början hade vi 4 olika hundratal som alla startade mitt i: 150, 250, 350 samt 450 (efter ett tag försvann 300 segmentet då vi ansåg att det inte behövdes). Vi började med att skapa två segment var, så Erik började med segment 150 samt 350 och jag med 250 samt 450.

Därifrån började vi tolka varan-dras segment, jag gjorde video till hans musik och han skrev musik till min video. När vi tolkat varandras segment fortsatte vi att lägga till ett segment som den andra kunde tolka. Vi hade valmöjligheten att gå antingen

uppåt eller nedåt i segmentens talsserie när vi tolkade. Ex om Erik började med 150 som jag sedan tolkade, så kunde jag fort-sätta med 151 eller 149.

Filerna döptes efter segments-nummer samt en ändelse beroen-de på vem som skapat segmentet. ”j” för Jonas, ”e” för Erik, ”je” om Jonas börjat och Erik sedan tol-kat samt ”ej” om Erik börjat och Jonas sedan tolkat (se bild 8).

För spår 1 och 3 som vi gjorde efter att det första spåret (spår 2) var färdigt, bestämde vi att vi skulle testa att göra hela spåret på en gång. Så Erik kompo-nerade hela spår 3 som jag sen tolkade och jag skapade spår 1 som Erik sedan tolkade.

Denna metod med segment och tolkningar ledde till att vi hade en intressant kommunikation med visuella och musikaliska uttryck och tillsammans skapade verket och inspirerade varandra att göra saker vi inte skulle ha gjort själva. Detta är min de-finition av ett bra samarbete, när man tillsammans kan skapa något större än vad man skulle kunnat göra själv.

Under projektets gång dokumen-terade vi varandras tolkningar i skrift för att sätta ord på vad vi såg och hörde i den andres verk, men utan att på något sätt värde-ra den andres arbete, bara vad vi upplevde och hur vi tolkade det.

10

Diskussion & Reflektion

Betraktare eller användareEtt av mina mål med projektet var att få en betraktare att bli en användare och medskapare av en musikvideo. Lyckades jag med det? För att svara på det behöver jag först fråga mig vad en medskapare är och vad en musikvideo är.

Enligt Mikael Askander (källa 1) har musikvideon traditionellt används för marknadsföring och som ett konstnärligt uttryck för det som ska kommuniceras. Så med en ursprunglig beskrivning är det inte en musikvideo jag gjort då jag inte marknadsför något.

Ser man till andra interaktiva musikvideos som finns ser man även att musiken i sig inte kan påverkas. I Alone kan man som användare både påverka musiken och det visuella.

Som jag skrivit tidigare så kanske det jag skapat inte är en interak-tiv musikvideo, utan snarare ett instrument eller ett verktyg med många möjligheter till kreativt uttryck men med tydliga be-gränsningar i vad man kan göra.

Det enkla gränssnittet med enbart piltangenter och spacebar, gör det lätt för betraktaren att börja interagera med verket. Men frågan är om man måste kunna påverka mer än att byta mellan

tre olika spår för att verkligen bli en medskapare av verket?

För att vara en medskapare tän-ker jag att man måste känna en tillhörighet till verket, att upple-velsen är något man själv skapat, så det är nog väldigt individuellt. En del personer jag testat på har verkligen gått in i verket och tes-tat allt och skapat sina egna verk, medans andra mest har observe-rat och inte interagerat i samma utsträckning.

Så om jag lyckats med mitt mål eller inte är helt beroende på vem användaren är och vad den upplever.

Det viktigaste jag lärt mig från mina användartester är att det finns kopplingar mellan hur an-vändaren interagerar med gräns-snittet, och personens kunskap, erfarenheter och intresse för teknik och musik. Det resulterar i att en användare förstår precis hur hen ska interagera medans en annan behöver mer vägledning.

Det fysiska gränssnittetDet fysiska gränssnittet jag ska-pat har både för och nackdelar. Fördelen är att det finns på alla datorer och är välkänt av min spelintresserade målgrupp.

Nackdelar är att det inte fun-kar på pekskärmar och att man

tvingar användaren till att an-vända ett tangentbord när denna kanske helst navigerar med en mus eller pekplatta.

Det finns heller ingen tydlig koppling mellan piltangenternas riktning och vad som händer på skärmen, mer än att de positiva berättelserna (spår 1 & 2) är uppåt och den mer negativa (spår 3) är nedåt.

Segment eller hela spår?För det första spåret (spår 2) använde jag och Erik oss av 10s segment som vi skickade till varandra för tolkning. För spår 1 och 3 valde vi istället att skapa ett helt spår på en gång.

Den senare metoden ledde till att spåret inte kändes lika uppklippt, att det var mer flyt i övergångar och i handlingen. Den gick även fortare att göra. Sen beror an-tagligen det på att vi redan hade gjort ett spår och hade mycket material och erfarenhet gratis.

Det första spåret vi gjorde blev dock mer av en konversation mellan oss, och vi fick mer inspi-ration från varandra som drev på utvecklingen och handlingen.

Så båda metoderna hade sina fördelar. Det hade varit intressant att testa om man kunnat använda båda dessa metoder samtidigt

11

och ta till vara bådas styrkor, ge-nom att exempelvis endast skicka grova skisser till varandra för tolkning. Därefter hade vi kun-nat producera var sitt spår som vi sedan bytte och tolkade igen.

Vad är ett bra samarbete?Mitt andra mål var att skapa ett bra samarbete där vi fick inspira-tion av varandras skapande. Det är något jag tycker vi lyckats med riktigt bra, dock är det nog till stor del beroende på att vi kände varandra sedan tidigare och kommer från liknande bakgrund.

Min handledare (källa 2) prata-de om vilka roller, mandat och ansvar vi haft i vårt samarbete, och det är något som har varit underförstått. Då jag initierade projektet fick jag mer av en orga-nisatorisk roll, men båda drev på och kom med nya idéer.

En viktig sak att det fungerade så bra var nog att vi gav varandra utrymme och var noga med att analysera och betrakta snarare än att kritisera. Om den andra inte gav de reaktioner man önskat så inser man själv att något är fel och kanske behöver ändras.

Vi har även alltid vetat vem som ska göra vad tack vare systemet med segment och filnamn. Det var även väldigt effektivt att job-ba från flera håll samtidigt så vi

alltid hade något att jobba med.

Men det viktigaste var nog den täta dialog vi förde med flera Skype-möten och de omkring 40 mail vi skickade med tolkningar och tankar.

Lärdomar från projektetDå hela projektet varit ett sorts utforskande av en metod till att skapa ett verk tillsammans, har jag framförallt lärt mig att den här speciella typen av samarbete faktiskt funkar.

Tidigare har jag mest jobbat enskilt i projekt, men det är spännande att jobba tillsammans med någon som har helt annan kompetens än mig, och som gör att resultatet blir så mycket bättre än om jag skulle försökt göra det själv.

Även rent tekniskt har jag utvecklats, även om det inte var ett del av mitt projekt så har jag utvecklat hela den tekniska plattformen. Så det har gett mig en större förståelse för webbstan-darder och saker som bakomlig-gande renderingsmotorer i webb-läsare, samt bättre kunskap inom HTML5 och JavaScript.

Det känns även som jag har blivit snabbare på att animera. Under mitt utforskande projekt i 2an gjorde totalt 30s film med

samma miljöer och figurer jag använt i detta projekt. Då tog det omkring 2 veckor att animera dessa partier, idag kan jag göra samma sak på under 3 dagar. Dock tog materialproduktionen mycket mer tid än jag planerat.

Framtida ut-vecklingUnder ett samtal under examina-tionen började vi diskutera olika framtida tillämpningar och andra intressenter. Jag har tidigare testat att byta ut videorna till helt andra, och insett att man kan an-vända detta tekniska verktyg till en rad olika tillämpningar. Allt från att kunna kolla på en inter-vju och kunna välja vilken vinkel man vill se, till att bygga upp ett helt spel med hjälp av film där man hoppar fram och tillbaka i ett långt klipp och påverka vad som händer.

Även metoden i sig skulle kunna användas i ett kommersiellt sammanhang där en kund pre-senterar ett tema som jag och en kompositör eller annan kreatör tolkar och bygger fram.

12

Källa 1: http://www.ur.se/Produk-ter/170401-UR-Samtiden-Lun-daforskare-forelaser-Musik-videon-som-konstverk

Källa 2 (muntlig källa): Sofia Wallner, handledare, HDK

Delar ur mitt studiematerial:Gamification: Spelifiering i lärande http://www.ur.se/Produk-ter/177980-UR-Samtiden-Lun-daforskare-forelaser-2013-Speli-fiering-i-larandet

Gamification: Gaming can make a better world http://www.ted.com/talks/jane_mcgonigal_gaming_can_ma-ke_a_better_world.html

Om ljud och video i HTML5 http://dev.opera.com/articles/view/everything-you-need-to-know-about-html5-video-and-audio/

Exempel på klassiska musikvideos och information om dess historia http://en.wikipedia.org/wiki/Music_video

Källförteckning

13

Bilagor - bilder

Bild 1: Startskärmen - version 1

Bild 2: Startskärmen - version 2

14

Bild 3: Mellanslagstangenten och piltangenterna fungerar som det fysiska gränssnittet

Bild 4: Startskärmen - färdigt verk

15

Bild 5: Slutbild - välj att spela om eller att dela

150ej

150ej

150ej

151je

151je

151je

152e

152e

152e

250je

250je

250je

149ej

149ej

149ej

450je

450je

450je

449e

449e

449e

252j

???

???

Jonas jobbar med

18 mars 2014

Erik jobbar med

252je

???

???

251ej

251e

251e

451e

451e

451e

249ej

249ej

249ej

148je

148j

148j

???

???

???

Track 2

Track 3

Track 1Stat:14 segment / spår = 2.3minTotalt: 42 segment = 7min

Färdiga segment: 6 stKvar att göra: 36 st (85% kvar)

Bild 7: Struktur med 10s-segment med allt

material som gjorts fram till 22 mars 2014

Bild 6: Utkast på flödesschema

16

Bild 8: Segments-namn

Eriks arbetsplats samt gränssnitt (nedan)

17

För spår 2 arbetade jag med snabba storyboards varje segment för sig då jag inte visste vad som skulle hända i nästa segment efter Eriks tolkning. Under spår 1

och 3 kunde jag som ovan skissa på ett storyboard för hela spåret.

All kod för projektet: Totalt 428 rader CSS, 88 rader HTML och 408 rader JavaScript, totalt 924 rader eller 20 081 tecken (16 A4-sidor)

18

Segment no 149 track 2

Segment no 250 track 2

Segment no 149 track 1

Segment no 452 track 1

Segment no 150 track 2

Segment no 449 track 2

Segment no 449 track 1

Segment no 251 track 3

19

20