WWW.DAV.NU 1/14

PROJEKTRAPPORT PROJEKTRAPPORT

WWW.DAV.NUWWW.DAV.NU

Stine Møller KjærStine Møller Kjær&&

Anja Styhm KristensenAnja Styhm Kristensen

Eksamensopgave: Eksamensopgave:

Multimedie teknologi & Interaktionsdesign 0512Multimedie teknologi & Interaktionsdesign 0512

WWW.DAV.NU 2/14

INDHOLD3 Baggrund for projektet (Foranalyse)3 Vores tilgang til projektet4 Foranalyse5 Projektbeskrivelse5 Projektforløbet5 Afgrænsninger 6 Undersøgelse 6 Undersøgelse - procesniveau7 Undersøgelse - produktniveau 7 Idéudvikling7 Kommunikationsplanlægning7 Produktniveau8 Design8 Form9 Typografi9 Illustration9 Komposition10 Stil og stemning10 Processniveau11 Produktniveau13 Ekstern designmanual13 Realisering & Evaluering 13 Processniveau13 Produktniveau14 Bilag1 Projekt- og tidsplans-model2 Ekstern design manual1.1. Flowchart1.2. Storyboards3 Idékatalog

Kontaktperson:

Anja Styhm Kristensen

anja.styhm@hotmail.com/29298213

WWW.DAV.NU 3/14

____WWW.DAV.NU_____

_____________________

BAGGRUND FOR PROJEKTET

(FORANALYSE)

VORES TILGANG TIL PROJEKTET

Vores metodiske tilgang og opgavens struktur og opbygning er

baseret på HOME-modellens fire trin: foranalyse,

undersøgelse, design og realisering. Denne

helhedsorienterede processanskuelse er desuden

karakteriseret ved en todeling af de fire trin – nemlig produkt

vs. process. I det følgende bruger vi disse fire trin til at

gennemgå projektets forløb – med fokus både på processen

og det færdige resultat.

WWW.DAV.NU 4/14FORANALYSE

Foranalysen er foregået således, at vi har først og fremmest

har søgt informationer om Dansk Angolansk Venskab (DAV),

heriblandt sat os ind i deres nuværende hjemmeside. Dette

blev udført med henblik på at være forberedt på første

kundemøde, som gav os følgende informationer:

DAVs nuværende hjemmeside lever ikke op til brugernes

krav om informationstilgængelighed.

DAV ønsker:

Et mere interaktivt site:

◦ fx event kalender, videoer, links til

partnerorganisationer, indmeldesesdformularer.

Bedre informationsoverskuelighed

Mere fokus på de forskellige målgrupper

PRODUKTDEFINITION:

For at tiltrække frivillige og erhvervsstøtte til Dansk Angolansk

Venskab skal DAVs hjemmeside undergå en optimering og

fornyelse.

PROCESDEFINITION:

Via HOME-metoden skal DAVs hjemmeside optimeres.

Processen forløber over halvanden uge og er karakteriseret

ved ’frihed under ansvar’.

WWW.DAV.NU 5/14

PROJEKTBESKRIVELSE

Baseret på de indledende undersøgelser og første kundemøde

vurderer vi at formålet er at skabe et mere brugervenligt,

interaktivt og målrettet design. Produktet er således en

optimeret og køreklar hjemmeside til DAV, hvor organisationen

herefter selv skal stå for at tilpasse og vedligeholde indholdet.

Derudover bliver organisationen også præsenteret for et

idékatalog, hvori ideer til videreudvikling og forslag til kørsel af

siden vil foreligge.

PROJEKTFORLØBET

Projektforløbet strækker sig over halvanden uge og grundet

dette korte forløb var muligheden for prototyping og

udforskende udvikling begrænset. Vi arbejdede derfor med

vandfaldsmetoden som udviklingsmetode, dog med et lille

element af prototyping, da vi midt i forløbet har haft mulighed

for at have et 2. kundemøde hvor vi kunne præsentere det

foreløbige arbejde og få feedback.

AFGRÆNSNINGER

Grundet tids- og ressourcebegrænsninger har vi valgt at

fokusere på sitets brugervenlighed og informationsniveau. Vi

har dog ikke haft mulighed for at 'dykke ned' i DAV i en sådan

grad, at vi har kunne udfylde sitet med alle relevante

informationer – men vi har sat sitet op således, at DAV selv

kan.

WWW.DAV.NU 6/14

UNDERSØGELSE

UNDERSØGELSE - PROCESNIVEAU

Projektteamet består af to personer og derved to projektledere.

Den første opgave projektteamet udførte var udformningen af

en to-do-liste, der listede alle gøremål i forbindelse med

fuldførelse af projektet. I forhold til at udføre projektet afstemte

teamet forventninger til hinanden og forholdte sig til de otte

typer personligheder, der sædvanligvis er drivkræfterne

bagved et godt projekt og aftalte hvordan fokus hele tiden

skulle være på at inkorporere disse typer i projektarbejdet.

I projektplanen (se billag 1) har vi listet de forskellige faser i

udviklingsmetoden, vores estimeret og reelle tidsforbrug, vores

deadline og vores aktiviteter.

WWW.DAV.NU 7/14

UNDERSØGELSE - PRODUKTNIVEAU

IDEUDVIKLING

Efter 1. kundemøde brugte vi en mindmapping til at

brainstorme over alle de informationer, vi havde erfaret

vedrørende DAV. I denne process fokuserede vi først og

fremmest på den fastsatte målgruppe og hvad et nyt DAV site

skulle indeholde i henhold til at imødekomme og ramme

brugeren.

KOMMUNIKATIONSPLANLÆGNING

PRODUKTNIVEAU

Vi har arbejdet ud fra en simpel kommunikationsmodel som er

illustreret nedenunder. Vi, som afsendere, har vi sat os ind i

DAVs ønsker og behov for deres hjemmeside, men er samtidig

også med til at præge budskabet idet vi har arbejdet med et

selvskabt ”afrika”-koncept. Dette koncept er baseret på DAVs

ønske om at beholde både logo og headerbillede. Vi

besluttede at anvende disse pga. genkendelighed som

allerede er etableret blandt DAVs frivillige og

samarbejdspartnere. Derfor tog websitets udformning

udgangspunkt i det orginale headerbillede og logo.

Afsendere: DAV Webdesignere (os)

Budskab

Målgruppe: (DAV og deres nuværende og kommende danske frivillige, angolainteresserede, myndigheder)

WWW.DAV.NU 8/14

Design Vi har arbejdet med de seks designparametre og vil i det

følgende begrunde vores valg.

FORMVi vurderer at kunden ønsker et enkelt og navigerbart site idet

videregivelse af information er en primærfunktion af

hjemmesiden. Ydermere, valgte vi at beholde fokus på

headerbilledet og logoet for at bevare genkendeligheden.

Kunden havde desuden ytret ønske om minimal brug af scroll,

så dette var også et kriterium for os.

For alle websitets sider gælder det at formen er enkel med en

header indeholdende et billed med logo, derunder ses

navigationsbaren som er synlig på alle sider for at optimere

navigationsmulighederne. Menuen har desuden drop-down

funktion så alle undersider kan nås fra alle sider.

WWW.DAV.NU 9/14

TYPOGRAFI

Helvetica er valgt til teksten på sitet pga. dens runde og

læsevenlige stil.

ILLUSTRATION

På sitet gør vi brug af flere forskellige illustrationer. Disse er

valgt til at understøtte og illustrere det ”afrika”-koncept som

ligger til grund for det overordnede design. En afstemning af

billedes funktion som forankrende tekst i forhold til billedets

farveskala blev foretaget for at sikre at både indhold og design

blev optimal. Det forventes dog at illustrationerne bliver

udskiftet i takt med at DAV selv opdaterer deres tekstmæssige

indhold således at samspillet mellem tekst og illustration hele

tiden bidrager til formidlingen af DAVs informationer.

Ydermere har vi anvendt logo-illustrationen til at opsætte

punkter. Dette har vi gjort for at inddrage logoet så meget som

muligt for at skabe logo genkendelighed og for at skabe

sammenhæng op siden.

KOMPOSITION

Vi har arbejdet med AIDA-modellen i forhold til websitets

komposition. I det nedenstående forklarer vi hvorfor vi har

bygget sitet som vi har:

ATTENTION

Vi har beholdt logoet i øverste venstre hjørne i

overensstemmekse med eye-tracking – nemlig at det menes at

dette er det første sted øjet ser.

INTEREST

Vi har valgt farver som skal illustrere den angolanske

solopgang – i overensstemmelse med det originale

headerbillede. Disse farver er ment til at virke indbydende på

målgrupperne idet vi forventer at disse har tilfælles en

interesse i Angola/Afrika.

DESIRE

På den højre sidebar er der øverst placeret en nyhedsreel og

umiddelbart under er en præsentationsvideo. Dette er gjort for

WWW.DAV.NU 10/14at skabe lyst hos brugeren til at se hvad som sker nu

(nyhedsreel) og hvem menneskerne er bag (video).

ACTION

Vi har ikke valgt en call-to-action knap idet vi mener brugeren

har mulighed for flere handlinger. Brugeren kan se

præsentationsvideoen eller læse nyhederne allerede fra

forsiden. Desuden ligger alle sider tilgængelig i

navigationsbaren så her er der også rig mulighed for handling.

STIL OG STEMNING

PROCESNIVEAU

Vi har løbende gennemgået projektplanen for at se hvor vi var i

processen. Det var nødvendig med små justeringer i forhold til

tidsplanen og disse blev løbende ændret i planen således at

den til sidst afspejler forløbet.

PRODUKTNIVEAU

INFORMATIONSDESIGN

Som nævnt, vurderede vi at informationsdeling var alfaomega

for kunden, dog blev det også tydeligt at kunden selv ønskede

at 'indsætte' denne information når de var klar til det. Det var

derfor ikke muligt for os at indarbejde konkret information på

sitet, dog tænke vi en del over at inkorporere funktioner som

var væsentlige for målgrupperne.

INTERAKTIONSDESIGN

Som nævnt var noget af det vigtigste ved sitet at det skulle

være nemt for brugeren at navigere i. Derfor var det vigtigt for

os at skabe en simpel navigationsstruktur på sitet (se vores

WWW.DAV.NU 11/14flowchart i billag 1.1.).

PRÆSENTATIONSDESIGN

På baggrund af vores forundersøgelse (indledende research

og kundemøde) klargjorde vi hvilke funktioner og elementer

som skulle være på sitet. Derefter skitserede vi (i hånden)

visual mock-ups på index og sider og valgte deraf strukturen

på vores endelige website.

WWW.DAV.NU 12/14PRÆSENTATIONSDESIGN - PROCESSEN

Processen med at skabe præsentationsdesignet oplevede vi at

måtte gå væk fra den skitse (som ses til venstre) som vi

originalt havde valgt til det endelige site. Vi opstilede det i

WordPress (som ses nedenunder), men oplevede her at

æstetikken i sitet ikke var som forventet. Desuden vurderede vi

at de navigationsmuligheder der allerede ligger i

navigationsbaren (under headerbilledet) overflødiggjorde af

linksene som vi havde lagt i teksten under billederne – en

slags 'dobbeltkonfekt'.

Derfor besluttede vi at ændre præsentationsdesignet således

at det bedre imødekom kundes ønske om at kunne lægge

nyheder og aktiviteter på forsiden samt at gøre sitet mere

levende ved at indlægge en præsentationsvideo. Det endelige

site ses herunder:

WWW.DAV.NU 13/14

EKSTERN DESIGNMANUAL

EKSTERN DESIGNMANUAL

DESIGNELEMENTER, FONTS & TEKSTFORMATERING,

STORYBOARDS, NAVIGATIONSPRINCIPPER &

FLOWCHART.

I billag 2 har vi vedlagt en ekstern designmanual som kan

bruges af kunden eller en webprogrammør til opsætning og

vedligeholdelse af sitet.

Realisering & Evaluering Til projektprocessen har vi lænet os op af SCRUM-modellen

idet vi vurderede at vores tidshorisont var passende for

SCRUM-modellens 'sprints'. Projektet har desuden været

organiseret således, at alle medarbejdere har været inde over

alle opgaver dog har små-opgaver været uddelegeret

undervejs men overordnet er opgaven udført i samlet flok.

PROCESNIVEAU

For at lette overdragelsessituationen med kunden har vi

udviklet sitet i WordPress for at sandsynliggøre mugligheden

for kunden selv at vedligeholde sitet. Dette er i tråd med

kundens ønsker idet vi vurderer at de ikke ønsker at

uddelegere denne opgave til eksterne aktører. Vi har derfor

lavet en ekstern designmanual således at kunden selv har

mulighed for at vedligeholde sitet.

PRODUKTNIVEAU

Som nævnt var det nødvendigt med løbende ændringer af

designet – både pga æstetiske, usability-relaterede og tekniske

WWW.DAV.NU 14/14årsager. Sitet er således et produkt af processen såvel som

kundens ønsker.

KildehenvisningTil brug af HOME-modellen og SCRUM bruges Louise Harder

Fischer & Marie Oosterbaan's ”Digital Media Management – en

helhedsorienteret metode”, 3. udgave, 2010, Nyt Tekninsk

Forlag.

Bilag

1. Projekt- og tidsplans-model

2. ekstern design manual

1. Flowchart

2. Storyboards

3. Idékatalog