1

PLANERING

MULTIMEDIAPROJEKTET

”FAMILJEN GURKA”

Helene Brogeland

Multimediaproduktion – VT 2014

2014-05-15

2

Innehåll Inledning .................................................................................................................................................. 3

Designbeskrivning ................................................................................................................................... 3

Syfte ..................................................................................................................................................... 3

Målgrupp ............................................................................................................................................. 3

Beskrivning .......................................................................................................................................... 3

Ingående komponenter ....................................................................................................................... 3

Storyboard ........................................................................................................................................... 5

Navigation ......................................................................................................................................... 12

Kravspecifikation ................................................................................................................................... 13

Funktionella krav ............................................................................................................................... 13

Icke-funktionella krav ........................................................................................................................ 13

Användargränssnitt ....................................................................................................................... 13

Leveranskrav .................................................................................................................................. 13

Teknisk beskrivning ............................................................................................................................... 13

Behovsinventering ................................................................................................................................. 14

Tidsplanering ......................................................................................................................................... 14

Riskinventering och kritiska moment .................................................................................................... 14

3

Inledning Följande dokument redogör för planeringen av mitt multimediaprojekt som går under arbetsnamnet

”Familjen Gurka”.

Tanken med mitt projekt är att skapa en webbsida som inriktar sig till barn upp till förskolålder och

som innehåller en multimediaproduktion där barnet kan läsa/lyssna till och se en enkel saga. Själva

sagan har jag utarbetat tillsammans med min 10-årige son Felix. Han ville att vi skulle bygga upp

berättelsen kring ”Familjen Gurka”, ett par figurer som Felix och en kompis hittat på och skrivit om i

skolan.

Designbeskrivning

Syfte Syftet med projektet är att skapa en webbsida innehållande en Flash-applikation där man kan läsa,

lyssna till och se en enkel saga. Detta uppnås genom att kombinera video, ljud, bilder/animeringar,

text och berättarröst så att användaren kan ta del av innehållet oberoende på om man kan läsa eller

ej.

Målgrupp Webbsidan och produkten riktar sig till barn upp till förskoleålder.

Beskrivning Produkten skall innehålla en startsida med en kort introduktionsvideo och menyval. Genom att klicka

på någon av menyknapparna får användaren ta del av ett avsnitt som handlar om familjen Gurka. I

grundversionen kommer det att finnas två berättelser att välja mellan (”Detta är familjen Gurka” och

”Familjen Gurka besöker staden”). Genom att lägga varje avsnitt i en egen Flash-fil är det möjligt att

bygga på med fler berättelser på ett relativt enkelt sätt vid ett senare tillfälle.

Varje avsnitt kommer bestå av ett antal bilder/scener som innehåller teckningar och animationer och

som kompletteras med text som både kan läsas och som läses upp av en berättarröst. Man går vidare

till nästa bild genom att klicka på en framåt-knapp.

Ingående komponenter Intro- och menysida: Denna skall innehålla en presentationsvideo och meny/knappar för att ta del av

de två sagoavsnitten

Video: presentation av webbsiten och vad sagan handlar om

Inläsning av sagans texter: en text skall läsas in för varje scen

XML-fil: innehåller texten för varje scen i sagan

Knappar på menysidan: skall leda till var och ett av avsnitten av sagan. När man hoovrar över en

knapp skall en röst berätta vilket avsnitt man kommer till om man klickar på knappen. När man

klickar skall ett ”inbyggt” klickljud höras.

Inläsning av ”knapptext”

4

Knapp/pil på varje scen för att gå vidare till nästa scen: Här skulle man kunna tänka sig både framåt

och bakåtknapp och ”tillbaka-till-menyn”-knapp men jag väljer att enbart ha en framåtknapp för att

inte krångla till navigeringen. På sista scenen för respektive berättelse skall man kunna klicka sig

vidare till startsidan.

Innehåll (symboler, animeringar etc) i de olika scenerna (vissa komponenter kan användas i flera

scener):

scen 1:1: medlemmar i familjen Gurka, guldfisken Isak, hus, bakgrund med himmel, gräs och träd

scen 1:2: sol, solstol, liggande Herr Gurka

scen 1:3: spis, jordgubbspaj

scen 1:4: fotboll, TV

scen 1:5: skrivbord, PC, bokhylla

scen 2:1: köksbord

scen 2:2: båt, bakgrund med segelbåtar, sol, moln

scen 2:3: buss – animering, bakgrund med gräs, väg och himmel, familjen Gurka i halvfigur

scen 2:4: höghus, gata

scen 2:5: mat, Fru Gurkas nya blåa kjol

Resterande scener återanvänder redan skapade komponenter

5

Storyboard För att få en uppfattning av uppbyggnaden av produkten arbetar jag och Felix först fram en

storyboard som grovt visar utseende på och innehåll i de två avsnitten av sagan om Familjen Gurka.

Jag har valt att kalla varje ”bild” för scen för att lättare kunna strukturera upp arbetet.

6

7

8

9

10

11

12

Navigation Nedan visas applikationens navigationsstruktur. Tanken är att det skall finnas två knappar på

intro/meny-sidan som går till var sitt avsnitt av berättelsen. När man valt att ta del av en berättelse

kan man sedan klicka sig vidare till nästkommande bild. När man nått sista bilden kan man klicka sig

tillbaka till menyn.

13

Kravspecifikation

Funktionella krav Produkten kommer att implementeras som en del av en webbsida. Webbsidan kommer enbart

innehålla själva multimediaproduktionen.

Produkten skall ha en startsida som innehåller intro och meny. Förutom detta skall det finnas två

berättelser som man skall kunna ta del av genom val i menyn och att man sedan klickar sig vidare i

respektive berättelse.

Användaren skall få ta del av produktens innehåll via både hörsel och syn genom en kombination av

text, berättarröst, bild och animationer.

Icke-funktionella krav

Användargränssnitt

Det skall vara ett enkelt och tydligt användargränssnitt som är anpassat till avsedd målgrupp. Genom

kombinationen av text, berättarröst och tydlig navigering skall produkten kunna användas av barn

som inte är läskunniga.

Tydlig, läsbar inte alltför lång text ger barnet möjlighet att fånga upp enskilda ord när det ser texten

samtidigt som berättarrösten läser upp den.

Genom att användaren själv bestämmer när man skall gå till nästa bild (via knapp-klick) så finns det

möjlighet att hinna läsa/stava sig igenom texten på aktuell bild.

Leveranskrav

Produkten i sin grundversion skall vara klar och implementerad innan projektets deadline.

Teknisk beskrivning Nedan skissar jag på ett förslag på uppdelning av olika moduler/typer av media som bygger upp

applikationen. Eftersom jag i dagsläget inte har helt klart för mig hur man arbetar med Flash och

moduler finns det en viss reservation för att vissa delar av nedanstående kan ändras efterhand.

14

Behovsinventering Utifrån de ingående komponenterna i designbeskrivningen (se ovan) finns följande behov:

spela in introduktionsvideon, editera denna och anpassa/koda för att göra det möjligt att

använda videon i Flash (via Adobe Media Encoder).

skapa komponenter till startsidan som innehåller intro och meny

inläsning av sagans texter - berättarröst

skapa XML-fil innehållande sagans texter

skapa knappar för navigering

inläsning av ”knapptext” och ”hjälptext”

skapa symboler, animeringar, movieclips etc i Flash

skapa HTML och CSS-kod för webbsidan

Nedan följer ett Gantt-schema innehållande huvudmomenten i planeringen. En osäkerhetsfaktor i

skrivande stund är vad det innebär med kravet på moduluppbyggnad och även användningen av lokal

textfil och på vilket sätt dessa delar kan påverka den grundläggande tidsplaneringen.

Parallellt med arbetet med projektet skall jag även arbeta på uppgift 2 enkel kodningsuppgift. I det

här skedet har jag ingen uppfattning om hur mycket tid denna uppgift kommer att ta men jag anser

att vissa moment av detta arbete kan spara tid/återanvändas i mitt projekt.

Tidsplanering

Riskinventering och kritiska moment Det ligger alltid en svårighet i att tidsuppskatta, planera och genomföra ett projekt som detta där det

samtidigt är tänkt att man skall lära sig att behärska de olika moment som ingår.

I skrivande stund har jag enbart en vag uppfattning av vad vissa delar av kursledningens krav på

slutprodukten innebär, exempelvis användande av extern datakälla, lokala textfiler och

moduluppbyggnad. Till stora delar kommer detta att tas upp på kommande föreläsningar men dessa

kommer att ges efter deadline för planeringen av projektet. Om jag skall vara ärlig känns detta lite

som moment-22 där man skall planera en slutprodukt innan man har fått alla

förutsättningar/kunskaper.

Jag anser att man kan se timingen mellan de olika föreläsningarna och planeringen/ realiseringen av

projektet som både en risk och ett kritiskt moment. Även om det redan i kursintroduktionen sades

att vi skall vara beredda på att ta reda på mycket själva förutom det som ligger i föreläsningarna så

känns det lite ”slöseri” med tid att i förväg ta reda på sådant som sedan kanske tas upp i en

kommande föreläsning.

15

Om man ser till kursens schema så ger detta intrycket av att många viktiga, kritiska föreläsningar ges

alldeles för nära inpå deadline för slutprojektet. Det känns inte bra att sista föreläsningen (M8 Koda

ditt eget GUI) ligger i samma vecka som satt deadline. Detta kanske enbart är en personlig reflektion

från min sida eftersom jag är tvungen att få mitt projekt klart och inlämnat senast torsdag i aktuell

vecka på grund av en sedan länge inplanerad resa.

För att följa kraven som satts på produkten kommer jag att använda mig av en XML-fil som innehåller

berättelsernas texter. Det är tänkt att filen skall läsas in och att innehållet skall presenteras på

respektive sida. Om jag inte skulle lyckas med detta kan detta lösas genom att man lägger in texten

direkt i Flash för respektive bild. Konsekvensen blir att produkten blir färdig men att jag missar ett av

kraven i uppgiftsbeskrivningen.

Jag kan se arbetet med att ”synka”/lägga in ljud och berättartext tillsammans med respektive bild

som ett kritiskt moment. Även detta att få videon att fungera som den skall tillsammans med övriga

komponenter på startsidan kan kanske vålla problem.

Angående introduktionsvideon skulle ett önskescenario innebära att jag kan fixa till videon med hjälp

av ”green screen” och Adobe After Effects (tror jag har möjlighet att testa applikationen via Creative

Cloud?) för att få transparant bakgrund men i aktuellt skede är jag osäker på om detta kommer vara

möjligt att genomföra.

Till viss del är jag beroende av hjälp från min ”medhjälpare” Felix eftersom vi planerar att han skall få

figurera både i introduktionsvideon och som berättarröst. Han måste avsätta tid för att göra detta.