Upload
anne-kristine-knudsen
View
223
Download
0
Embed Size (px)
DESCRIPTION
DAV rapport af Lisa, Louise og Kristine
Citation preview
ProjektrapportDanskAngolanskVenskab
Multimedieteknologi&Interaktionsdesign
Udarbejdetaf:
LisaSecherMcAllister
LouiseEllerbæk
AnneKristineMärcherKnudsen
Websitetsadresse:
http://multimedieteam.dk/0512/lisa/wp/
Kontaktpersonigruppen:
LisaMcAllister
E‐mail:[email protected]
Lisa Secher McAllister Multimedieteknologi & Interaktionsdesign Dato for aflevering: 12-03-12 Louise Ellerbæk Projektrapport Anne Kristine Märcher Knudsen Dansk Angolansk Venskab
Side 2 af 23
Indholdsfortegnelse
Indholdsfortegnelse .......................................................................................................................................... 2
Indledning ......................................................................................................................................................... 3
Metode ......................................................................................................................................................... 3
UdviklingsmetodenHOME................................................................................................................................ 3
Foranalyse..................................................................................................................................................... 4
Undersøgelsestrinnet ................................................................................................................................... 4
Designtrinnet ................................................................................................................................................ 4
Realiseringstrinnet........................................................................................................................................ 5
Afgrænsning.................................................................................................................................................. 5
Tidsplan......................................................................................................................................................... 5
Undersøgelse .................................................................................................................................................... 6
Informationsindsamling................................................................................................................................ 6
Brainstorm .................................................................................................................................................... 6
Design ............................................................................................................................................................... 6
Informationsdesign....................................................................................................................................... 6
Interaktionsdesign ........................................................................................................................................ 7
Præsentationsdesign .................................................................................................................................... 7
Designparametre .......................................................................................................................................... 8
Form ......................................................................................................................................................... 8Typografi .................................................................................................................................................. 9Farver ..................................................................................................................................................... 10Illustration .............................................................................................................................................. 10
Komposition................................................................................................................................................ 11
AIDAmodellen........................................................................................................................................ 11Poyntereye‐tracking .............................................................................................................................. 12
Realisering....................................................................................................................................................... 13
Videreudvikling ........................................................................................................................................... 13
Konklusion....................................................................................................................................................... 13
Evaluering ................................................................................................................................................... 13
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 3 af 23
IndledningDetteprojekterafrundingenpåkursetMultimedieteknologiogInteraktionsdesign,oger
udarbejdetforkundenDanskAngolanskVenskab.DanskAngolanskVenskab,ogsåkaldetDAVi
opgaven,ønskeretredesignafderesnuværendewebsitehttp://www.dav.nu.DAVeren
foreningenstiftetafengruppedanskeogangolanskevenner,somønskeratstøtteAngolas
befolkningmedhjælptilselvhjælp.Foreningensformåler,atfremmekontakt,forståelseog
venskabmellemDanmarksogAngolasbefolkningergennemudbredelseafinformationomAngola
iDanmark,atetablereogstøttehumanitære,socialeogkulturelleprojekter,somhjælperden
hårdestramtedelafAngolasborgerkrigshærgedebefolkning,samtatsamarbejdemedandreikke‐
politiskeorganisationeromovennævntemål.
Kravettilprojekteter,atwebsitetskalværepå3‐4sider,mensrapportenskalhaveetomfangpå
ca.10sider.
Metode
Projektetbeståraftoelementer,etwebsiteimplementeretiWordPressogentilhørende
projektrapport,dererudarbejdetpåbaggrundafHOMEudviklingsmetoden.
WordPress,somwebsiteterudvikleti,eretopensourceblogsystemskrevetiPHP.Dererbåde
mulighedforatinstallereplugins,skiftetemaogtilføjetagstilsineposter.
HOMEmetoden,erenhelhedsorienteretogåbenmetodetiludviklingafalleslagsdigitalemedier,
idettetilfældeetwebsite.Metodenbeskæftigersigbådemedprojektledelseogmedudviklingaf
digitalemedier.Formåletmedmetodener,atsættearbejdetisystem–atgøredesignerensvalg
sammenhængende,velovervejedeogkonsekventeiforholdtilopgaven.
UdviklingsmetodenHOME HOMEeretakronymforHolistic,OpenMultimediadevelopmentmEthod.
MetodenerudvikletafLouiseHarderFischerogMarieOosterbaan.Depræsentererdensom
værendeenhelhedsorienteretogåbenmetodetiludviklingafalleslagsdigitalemedier,ogdener
derforrelevantiforholdtiludviklingenafvoresDAVwebsite.
Mankandogargumenterefor,atidetvoresprojekteryderstbegrænsetiforholdtiltid,
ressourcerogomfang,vildetikkeværenødvendigtellerhensigtsmæssigtatanvendemangeafde
delelementersomindgåriHOMEmetoden.Denertydeligvisudvikletmedstørreprojekterforøje,
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 4 af 23
mendenharalligevelværetetnyttigtredskabforos,ogviharstruktureretvoresprojektarbejde
udfradefiretrinHOMEmetodenindeholder:
ForanalyseKundemødetvarforosstartskuddetforprojektet.Viindsamledesåmegetinformationsommuligt
frakundenomkringderesønskertildesignaf‐ogindholdpåsitet,formålmedsitetoghvilken
målgruppedeønskedeathenvendesigtilviasitet.
Derblevinterntigruppenudarbejdetenprojektbeskrivelsesomhjælptilatsætterammerfor
voresprojekt1.
UndersøgelsestrinnetMedudgangspunktideinformationervihavdeindsamletfrakunden,lavedevipådettetrinet
mindmapderskullehjælpeosvidereiprocessen2.Mindmappetsynliggjordehvilkenretningvi
ønskedeatudvikleprojektetioggavosetoverblik.
Viskitseredeentidsplanforprojektetmedudgangspunktidettidsforbrug,somvipådettidspunkt
iprocessenforventede,atdeenkeltedelemåttekræve.Dervarsåsamtidigtafsatpladstilat
noteredetreelletidsforbrugvedprojektetsafslutning,ogsomdetfremgåraftidsplanen3
harmonererdetforventedeogdetreelletidsforbrugikke.Detvardogforventetfravoresside,så
dervarafsatekstratidafivorespersonligetidsplaner.
DesigntrinnetViudarbejdedepådettestadieafprocessenetflowchart4ogetstoryboard5forsitetsåledes,atvi
fikvoresvisionerogidéerframindmappetkonkretiseret.Derblevbrugtmegentidpåatudvælge
etpassendetemaogpluginsforsitet,somkunnefungereindenforderammervihavde.Daderfra
kundenssideafvaretstærktønskeom,atbibeholdedetgrafiskeudtryksomlogoogbannergav
detennaturligudfordringogbegrænsning.
1 Se bilag A 2 Se bilag B 3 Se bilag C 4 Se bilag D 5 Se bilag E
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 5 af 23
RealiseringstrinnetPådettestadieblevselvesitetskabt,ogværdienafdeforegåendetriniHOMEmetodenblev
synliggjort,dadetvargennemdemstrukturenforprojektetblevopbygget.Tidsplanen,
mindmappet,flowchartetogstoryboardetbetødvihavdeoverblikogmålrettethedpådette
vigtigestadieafprocessen.
AfgrænsningVihariudarbejdelsenafsitetforDAVforetagetvissefravalgiforholdtilkundensoprindelige
ønskerogidéer.
Medhensyntilønsketometnyhedsbrevmentevi,atenfacebooksidekunneudføresamme
funktion,ogderikkevarbehovforbeggedele,såvifravalgtenyhedsbrevet.Desudenvurderedevi
atmedlemmerneiDAV,somskaladministreresiden,ikkeerklartilformangenyekanaler,ogat
foreningenikkeharnyhederogbegivenhedernoktiletegentligtnyhedsbrev,samttidtilat
forvaltedetteistørreomfang.KundenudtrykteogsåetønskeomenTwitterprofiliforbindelse
medsitet,menvifølte,atDAVhellerikkevarklartilatvaretageensåkrævendefunktion.Twitter
kræverkonstantopdatering,ogtiltaleretheltandetsegment,vifølerikkeDAVvilfådetfulde
potentialeudafenTwitterprofiliforholdtilenFacebookprofil,ogderforvalgteviatbegrænseos
tiludelukkendeFacebook.
Vihariforbindelsemedprojektetudelukkendebeskæftigetosprimærtmedudviklingenafdet
danskesiteogikkeselvlavetetengelskellerportugisisksite.Dettevalgergjortudfraden
tankegang,atdetførstogfremmesteretdansksitekundenharbehovforsamt,ogatdettesåkan
fungeresomskabelonforoversattesites.Vihardogtilføjetetoversættelsespluginsåledes,at
mankanvælgeatsesitetpåengelskellerportugisisk.
Tidsplan
Vorestidsplanoverprojektetsforløb,erbaseretpåvoresegenvurderingaf,hvorlangtidde
enkelteelementeriprocessenviltage,samthvorlangtiddeivirkelighedenhartaget.Tidsplanen
erkortsagtenoversigtoverelementerneiprocessen,planlagttidogbrugttid.
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 6 af 23
Undersøgelse
Informationsindsamling
Voresprimæreinformationsindsamlingforegikprimærtunderkundemødet,hvorkunden
klarlagdedennesønskertilogformålmedwebsitet.
Kundenhavdeenrækkeønskertil,hvordanwebsitetkunneopbyggesoghvaddetkunne
indeholde,ogdetvarsåvoresopgaveatvurdere,hvadvisynesderfungeredebedst,samthvad
dervarrealistiskforosatlaveindenforderammervihavdeatarbejdemed.Kundenlagde
ligeledesvægtpå,atdevaråbneoverfornyeideerogforslag,menatdedoghavdenogleting,
såsomlogo,navnogbilleder,derhavdeenstorbetydningfordem.
Kundenfortalteligeledesomforeningenogdennesarbejdepåkundemødet,hvilketgavoset
dybereindblikihvemkundenvar.
Brainstorm
Efterkundemødetlavedevienbrainstormiformafetmindmap6.Voresbrainstormbarprægaf,at
vifølteosmegetbundetafkundensønsker,menvikomhurtigtvideremedmerekonkreteideer.
VivalgteatbrainstormeomkringDAVWEBSITEistedetforDAV,dadetvillegiveosnoglemere
præciseogbrugbareideertilsitet.
Design
InformationsdesignInformationsdesigngårialtsinenkelthedudpå,atviprioritererinformationenpåsitet.På
baggrundafkundemødetvedvi,atsitetsformåleratinformerealleiDanmarkomAngolaogom
DAV,mensmålgrupperneerdedanskemyndigheder,samarbejdspartnere,privateogdonorer,
samtnuværendeogkommendemedlemmer.
Viharderforvalgtatgøresitetenkeltiformafenkortogenkelmenulinje,forikkeatgøre
menulinjenuoverskueligmedformangepunkter.Deresterendepunktererderefterdeltindi
undersider,sommankommertiliformafdrop‐downmenuer.Sidenskalaltsåværeletat
overskue,nematsøgeinformationpåogdetskalværenemtatkommeikontaktmedDAV.
6 Se bilag B
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 7 af 23
Dakundenønskedetekstpåsitetbegrænsettiletminimum,ogistedetgernevillehavebilleder
derkommunikeredederesbudskabud,valgteviatfokusereprimærtpågalleriermedbillederfra
kunden,fremforformegettekst.
Interaktionsdesign
Interaktionsdesignetbeskriver,hvordanmannavigererrundtpåsitet7.Viharlagtstorvægtpå,at
devigtigsteelementerpåsitetgårigenpådeflestesider,såledesatbrugerenaltidkannavigere
hurtigtognemtrundtmellemdevigtigsteelementerpåsiden.Etafdeelementerdergårigenpå
allesiderne,erderformenulinjen,derindeholderOmDAV,Information,AktiviteterogGørnoget,
dereftervoresmening,indeholderalledecentraleelementerpåsitet.Derudovergår
kontaktoplysningerneigenpåallesiderne,dadetskalværenemtatkommeikontaktmed
foreningen.
Præsentationsdesign
Præsentationsdesigneterenudvidelse,hvorindholdogstrukturblivertilkommunikationog
oplevelse,idettetilfældewebsitet.Viharvedhjælpafstoryboardet8,designetwebsitetsform.Vi
har,somtidligerenævnt,valgtatvivilholdefokuspåbilledersomsitetsprimære
medieelementer,isærpådeøverstesider.Billederernemligletteathuskeoglæseforalle
nationaliteter.Desudengørdebrugerfladenmereindbydendeforlæserenoggengiver
virkeligheden,samtunderstøtterafsenderensbudskab.
Dogerder,primærtpåundersiderne,brugformeretekst,dakonkretinformationkanværesvær
atformidlegennembilleder.Tekst,isærlængeretekststykker,kræveratbrugerenharrettetsin
fuldeopmærksomhedmodskærmen.Ogderforharviogsåvalgtatdelængeretekststykker
hovedsagligtskalværepåundersiderne,dabrugerenkunkommerherned,hvisdenneønskerat
søgemereinformation,ogdermedermereindstilletpåatlæse.Voresønske,såfremtviskulle
lavesitetheltfærdigt,villedogværeatbrugetidpåatkortedenuværendetekststykkerendnu
merened,dadeterkedeligtatlæselængeretekststykker,ogikkemindstanstrengendeatlæsepå
encomputerskærm.
7 Se Bilag D 8 Se Bilag E
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 8 af 23
Designparametre
Designparametreneerenrækkevalg,visomgrafiskedesignereskaltagestillingtil,indendet
praktiskearbejdemedsitetbegynder.Dettegøresforatfindeopbygningenogudseendetafdet
pågældendesite.Derertaleom6designparametreialt;form,typografi,farver,illustration,lydog
animation.
Viharikkeinddragetdesignparametrenelydoganimation,dadetikkeerrelevantatbrugepå
dettesite.Grundentilatdetikkeerrelevant,eratkundenikkeharbehovforetsitemedfor
mangefeaturessomf.eks.lydoganimation,menderimodetsite,derersimpelt,informativtog
brugervenligt.
Derimodharvianvendtde4designparametreform,typografi,farverogillustration,somogsåer
demestanvendte.Devalgderertruffetiforholdtildesignparametrene,ersketpåbaggrundaf
trefaktorer,nemligfunktion,æstetikogteknik9.Dissetrefaktorerhængersammenogpåvirker
hinanden,ogdeterderforvigtigtatfådissetilatgåopienhøjereenhed.
Form
Formerdenfysiskeform,derdannesafvalgafformat,placeringafdeforskelligeelementerpå
sitet,mv.
Formateterpåetsiteeribreddenbegrænsetafskærmensstørrelse,hvorimoddybdenkanvære
ubegrænsetvha.scrollfunktionen.Viharvalgtatforsidenogundersidermedetminimumaf
scroll.
Derudoverharvivalgt,atformenskalværeklassiskopbyggetmedenheaderitoppenmednavni
fokusoglogotilvenstre,enfooteribundenmedkontaktoplysninger,enkortmenuitoppenmed
drop‐downundermenuerforatgøredetmereoverskueligt.ViharvalgtWordpresstemaet
’Weaver’dadetopfylderdissekriterier,samtgivermulighedforselvattilpasseflerefunktioner.
Funktion
Valgetafminimumscrollerbådekundensønske,menogsåvoreseget,dadetgørinformationen
påsidenmegetmereoverskueligoglettilgængelig.Dettegørkortsagt,attekstogbillederkan
forståshurtigtogpræcistafmodtageren.
9 Teknik: Under emnet teknik har vi udeladt økonomi, da vi økonomi ikke har været en faktor, der har haft indflydelse på vores projekt og valg truffet i denne forbindelse.
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 9 af 23
Denklassiskeopbygningskalværemedtilatøgebrugervenlighedenoggøresidennemat
navigererundtpå.
Æstetik
Vedatholdesidernekorteilængden,passerformatetgodttiletsite,dadetdermedpassertilen
computerskærm.Dettegørsidenæstetiskoverskueligogenkel,hvilketdetklassiskeformatogså
ermedtilatunderstrege.
Teknik
Teknikkenvedopbygningenafetsitesætter,somsagt,sinenaturligegrænserforformatetiform
afcomputerskærmensstørrelse.
Typografi
Typografiendækkeroverdeord,somskaliklædesenbestemtform,somdannesafvalgaf
skrifttyper,skriftstørrelseroglinjelængder.
Valgetafskrifttype,ellerfontsomdetkaldesiweb‐sprog,erfaldetpåVerdanaifarvensort,
skriftstørrelsenerhovedsagligtholdtiskriftstørrelse14ibrødtekstenoglinierneslængdeergjort
såkortsommuligt.
Funktion
Detoverordnedeformålmedvalgaftypografieratgøresitetsåletlæseligtsommuligt,såledesat
målgruppenhurtigtognemtkanskaffesigdenønskedeinformation,udenatbliveforstyrretaf
”fancy”typografiskevirkemidler.Vivilkortsagtundgåatbrugerenafsitetdruknerifarver,flotte
skrifttyper,tætpakkettekstellerlangelinjerogtekststykker.
Æstetik
ValgetafnetopVerdana,sort,kortelinjerogskriftstørrelse14gørtypografienenkelogstilren,
hvilketpasseræstetiskgodttildetgennemgåendetemaforsitetogdetserpæntud.
Teknik
Verdanaerenfontdererdesignettilskærmbrug,ogdermederdenlæseligpåallecomputere,
hvilketerenvæsentligtekniskfaktorderspilledeindivoresbeslutning.Skriftstørrelse14eren
anelsestørreenddennormaleskriftstørrelsepåtekst,nemligstørrelse12,menvisynesdetgør
tekstennemmereatlæseudenatdenbliverforvoldsomistørrelse14.
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 10 af 23
Farver
Valgetaffarverpåsitetskalunderstøttebudskabetogbrugesidenvisuellekomposition.
Voresvalgaffarvereritypografiener,somnævnt,faldetpåsort,mensvipåselvesitet(baggrund,
elementer,mv.)hartagetudgangspunktifarvernefrakundenslogo(sort/hvid)ogdetudvalgte
billede(header)frakundenmedrødlige,brunligeogorangefarversomdegennemgåendefarver.
Funktion
Dissefarverervalgt,dadeifølgekundenpassergodtpåAngola,menogsåfordivisynesdisse
farverskaberensammenhængmellemlandedesflag(DanmarkogAngola),mensamtidigharde
ogsåensymbolskfunktion:Sort/hvid,dersymbolisererhudfarvernepådeforskelligemennesker
dermødes,mensdenrødligefarvesymbolisererkærlighedogvarme,dererforbundetmedden
næstekærlighed,foreningenbyggerpå.
Æstetik
Detæstetiskeaspektiforholdtilfarvevalgterstort,dafarvernepådetellersmegetsimplesite,er
iøjnefaldende.Viharvalgtfarverne,dadegårgodtispændmedforeningenslogoogbilleder,og
dettegøratfarverne”passersammen”oggiversitetensammenhæng.
Teknik
ViharbrugtredskabetMioToolBoxtilatplukkeenfarveviføler,gårgodtispændmedderødlige,
orangeogbrunligefarverderfindespåheaderbilledet.
Illustration
Begrebetillustrationdækkerovervalgetogbrugenafbillederogtegningertilatillustrere
budskabet.
Viharbrugtet,afkunden,udvalgtbillede,maletafFranciscasmand(enafstifterneafforeningen),
samtprivatefotosfradiverseprojekter,mv.
Desudenharvivalgtatplacereetgalleriafsponsorlogoeridetøverstewidgetområdeisidebaren.
Detteharvivalgt,daDAVgernevilhavefleresponsorer,ogforatkunnetiltrækkedisse,erdet
vigtigtathavenogetatkunnetilbydetilgengæld.Herkanforeningensåtilbydeeksponeringaf
sponsorlogoer,ogeventueltnogettekst.Derkanefterbehovindsættesflerelogoerigalleriet,
ellerlavesflereområdertileksponering.
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 11 af 23
Funktion
BilledetmaletafFranciscasmand,beskriverlandetpåenrigtiggodmåde,samtidigmedatdet
fortællerenhistorie,hvileterenafgrundenetil,atvivalgteatfastholdekundensønskeombrug
afnetopdettebillede.Dettebilledegørsitetmerepersonligt,endhvisvihavdeanvendttilfældige
billeder,ogerogsåmedtilatfortællenogetomfolkenebagorganisationen.
Demangefotosviharbrugtfraforskelligeprojekter,erbrugtforatviseogillustrereforeningens
arbejde,fremforatskriveomdet.Billederogfotosermegetnemmereoghurtigeformodtageren
ataflæse,samtidigmedatdeermegetmereiøjnefaldendeogbeskrivendeendenmassetekst.
Billedertalerligeledesetuniverseltogemotioneltsprog,dervilnåudtilallebrugereuanset
nationalitet.Kortsagt,harformåletmedbrugenafmangefotosværet,atgøresitetmere
”spiseligt”,samtfungeresomblikfangforbrugeren.
Æstetik
Billedetiheaderenogfotografierneskalisamspilmedderesterendefarverpåsitet,væremedtil
atgøresitetiøjnefaldendeogæstetisk.
Teknik
Densmuleteknik,derharværetforbundetmedillustrationernepåvoreswebsite,haromfattet
implementeringafvirksomhedensnavnoglogoibillede.Detteharvigjortvedatbeskære
baggrundsbilledetoglogoettilderetteproportioner,ogderefterlæggelogoetovenpåbilledet.
Hermedharvifåetetbilledesompassertilsitetsheader‐område.Disseændringererlaveti
Photoshop.
Komposition
Kompositionen,derbeskrivermådenhvorpåwebsidensindholdbliverpræsenteretforlæseren,er
ogsåetvigtigtparameterathaveforøjenårwebsitetbyggesop.Kompositionenskalfange
målgruppensinteresseoggivelysttilatblivepåsitetoglæsemere.Dettekangørepåflere
forskelligemåder,ogviharvalgtatgøredettevedatbrugeAIDAmodellen10.
AIDAmodellen
AIDAmodellentagerudgangspunktifireelementer;Attention,Interest,DesireogAction.
10 Se Bilag F
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 12 af 23
Attention
Læserenvilautomatiskstartemedataflæseetmedieveddetoptiskemidtpunktpåenside,der
hvorøjetfalderindpåsidenibrøkdelafsekunder.Detoptiskemidtpunktligger5%overmidtenog
lidttilvenstrepåsiden,dvs.omkringsitetsheader.Deterherviskalskabeattention,herskal
læserensopmærksomhedvækkes.Detteharviforsøgtatgørevedatsætteforeningenslogo,navn
ogmenulinjeidetoptiskemidtpunkt,såledesatbrugerenmeddetsammeerbliverklarover
hvemafsenderenafsiteter.
Interest
Derefterkiggermannedmoddethøjrehjørne,ogdeterherlæserensinteresseforalvorskal
vækkes.Herharviplaceretnoglebilleder,derbeskriverforeningensarbejdeogfungerersomlink
tilundersiderne.Dissebillederskalvækkelæserensinteresse.
Desire
Hvisdetlykkesosatvækkelæserensinteresse,vildennekiggeindmodmidtenafsitet,foratfinde
udafmereomforeningen.Hererdetigenbilledernedererfokus,ogdeterhermulighedenforat
læserenvilklikkesigindpåbillederne,foratfindeudafmere,opstår.
Action
Sidstestadieerhvislæserentager”action”ogreagererpåsiden,idettetilfældeomlæseren
kontakterforeningen,meldersigindiforeningen,ellerpåandenmådetager”action”foratstøtte
foreningen.Viharforsøgtatgøredettesimpeltforlæseren,vedatplacerekontaktoplysningerne
påallesiderneifooter,havekontaktformularenpåfleresider,samtvedatladeboksen”gør
noget”fremgåtydeligtpåallesideriformafsinplaceringimenuen.
Poyntereye‐tracking
ModellenPoyntereye‐tracking11,viserosigenatdetførstelæserenvilsepåsitet,erlogoognavni
øverstevenstrehjørne.Herefterfølgesetbestemtmønsterrundtpåsiden,igenovermidtenog
sidstoverihøjresideafsitet.Herharviplaceretnoglecentraleelementersåsom
aktivitetskalenderogfacebook‐linkellertilmeldingsformularen,såledesatlæsereninteresse
fastholdes,ihåbomatdenne”synesgodtom”siden,harinteresseinogleafaktiviteterneeller
benyttersigaftilmeldingsformularen.Viharogsåplaceretsponsorlogoerihøjresideafsitet,
primærtforatkunnetilbydeeventuellesponsorerenattraktivplaceringpåsitet. 11 Se Bilag G
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 13 af 23
Argumentetforathøjrekolonneskifteraltefterhvilketafsiderneduerpå,eratiforlængelseaf,
atvivedatlæserenvilslutteherhvergang,vilviforsøgeatlavenogetdynamikisitet,forat
fastholdeinteressen.
Realisering
Videreudvikling
Viharbyggetvoreswebsiteop,medhenblikpåatdetskulleværenemtogoverskueligtfor
foreningenaffortsættemedatfylderestenafdennødvendigetekst,billederoginformationind.
Detfaktum,atsiteteropbyggetietCMSsystemsomWordPress,erligeledesmedtilatgøredet
forholdsvistukompliceretforforeningenatarbejdevideremedsitet.
Konklusion
Viforestillerosikke,atvoreswebsiteerdenheltrigtigeløsningforDAVaffleregrunde.Førstog
fremmestblevvihurtigtklarover,atvihavdebrugforatholdevoresfokuspålæringsprocessen
fremforresultaterundervejs,davifølteatvoresegneevnerholdtopmoddentiddervartil
rådighed,gjordedetnødvendigtatindgånoglekompromisserogdermedpåvirkederesultatet.Vi
mentederfor,atdetvarvigtigstforos,førstogfremmestatfåbyggetwebsitetsheltbasaledele
op,ogdernæstbyggedeekstratingpå,vimentevarvigtigstforDAViprioriteretrækkefølge.
Evaluering
Selveprojektperiodenogmådenhvorpådenerbyggetopmedkundebesøg,startskudfralærerens
sidepåklassen,mv.,harisigselvfungeretfint.Dogskaldetnævnes,atvifølteatprojektoplægget
frakundenvarmegetomfattendeiforholdtilhvadvihavdeaftidogressourcer.Vivillefrastarten
helstopfyldeallekundensønsker,allemenupunkter,alledeideerdehavde,treforskelligesider,
mv.,mendetblevhurtigtklartforos,atvivarnødttilatfokusereheltkonkretpåenmeget
mindreomfattendewebside,enddenkundenlagdeoptil.
Gruppearbejdetharaltialtfungeretgodt.Vivarfrastartenklarover,atdetoptimaleforvores
gruppearbejde,villeværeatfåfordeltansvarsområderne,davialletrebormegetlangtfra
hinanden.Vilagdederforfrastartenplan,dergikudpåeffektivtgruppearbejde,dvs.alle
beslutningerogrammerblevlagtifællesskab,hvoreftervihjemmefralavededetgrovearbejdeog
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 14 af 23
kommunikeredepåmail,ogsåvifinpudsedealtifællesskab.Dogendtedetmedathovedparten
afarbejdetalligevelkomtilatforegåifællesskab,davisammenbrugtemegettidpåatløse
problemer,f.eks.iforbindelsemedplug‐inspåwebsitet.Menaltialt,ervimegetenigeom,atvi
detlykkedesosgennemeffektivplanlægning,atfordelearbejdetligeligtmellemossamtidigmed
atallefik”rørtigryden”,ogisærforarbejdetogproblemløsningenifællesskabet,gjorde
samarbejdetrigtiggodt.
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 15 af 23
Projektbeskrivelse‐BilagAProjektetsformålogresultaterViskallaveprojektetomDAVsitetsåledes,atallegruppemedlemmerfårimplementeretdenteorietiskeviden,somvihartilegnetosgennemkursetipraksis.Viopnårdettevedatallegruppemedlemmertageraktivtdeliarbejdet.ProjektetsmålogafgrænsningVedsluttidspunktetforprojektetskalderforeliggeetwebsiteforDAVsamtenrapportomkringforløbet.Viskalikkehaveetfuldstændigfærdigbyggetsite,mennærmereetskabelonderviserhvordanetsiteeventueltkunneseud,ogderviserviharforståetkursetsindhold.ProjektkonceptogudviklingsmetodeViudarbejdersitetogprojektrapportenstruktureretpåHOMEudviklingsmetoden.TidsplanogdeadlineProjektetograpportenskaluploadesmandagd.12‐03‐2012klokken12.marts2012Endetaljerettidsplanoverdeenkeltedelelementererblevetudarbejdetigruppen.ProjektorganiseringAlletremedlemmerafgruppenharfællesansvarforsitetograpporten,detlavesifællesskabisåvidudstrækningdetermuligtogellersharhvertmedlemskiftestilatarbejdepårapportensamtsitethjemme.ØkonomiogressourcerDerharikkeværetnogetøkonomiskaspektidetteprojektdadetindgårsomdelafeksamenforkursetogikkeerbetaltarbejde.Viharbaseretsitetudelukkendepågratispluginsogtemasåledes,atdetergratisatvedligeholde.
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 16 af 23
Mindmap‐BilagB
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 17 af 23
Tidsplan‐BilagC
Tidsplan Dag Fase Opgaver Est.Tid Aktueltid Onsdag 29.2 Opstart Kundemøde 2 2 Tidsplan 0,5 1Torsdag 1.3 Research 9 9Fredag 2.3 Research 9 9 Mandag 5.3 Idegenering Brainstorm/Mindmap 2 3 Planlægning Storyboard,Flowchart 3 4 Design 2 4 Tirsdag 6.3 Produktion Wordpresstemaresearch 4 8 Rapportskitse 3 4 Onsdag 7.3 Produktion Pluginns 4 6 Widgets 3 5 Billeder 4 7 Sider 2 2 Tekstbehandling 8 10Torsdag 8.3 Tilretning Præsentation 1 1 Diskussionafsiteograpport 2 4 Fredag 9.3 Produktion Tilretning 4 6 Færdiggørelse 4 6 Mandag 12.3 Aflevering Korrektur 3 3 Upload 0,5 0,5 Diverse 10 70 104,5
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 18 af 23
Flowchart‐BilagD
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 19 af 23
Storyboard‐BilagE
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 20 af 23
Storyboard‐BilagE,fortsat
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 21 af 23
AIDAmodellen‐BilagF
• Attention:Tiltrækmodtagerensumiddelbareopmærksomhed.
• Interest:Vækmodtagerensinteressefordet,derinformeresom.
• Desire:Overbevismodtagerenom,ellerbekræftmodtagereni,athan/hunharbehovfor(ønsker)atvidemereellerdeltageaktivt.
• Action:Gørønsketsåstærkt,atmodtagerenefterfølgendehandlerforatfådetindfriet.
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 22 af 23
Poyntereye‐tracking‐BilagG
LisaSecherMcAllister Multimedieteknologi&Interaktionsdesign Datoforaflevering:12‐03‐12 LouiseEllerbæk ProjektrapportAnneKristineMärcherKnudsen DanskAngolanskVenskab
Side 23 af 23
Designmanual‐BilagH
Designmanual Fontfamily: VerdanaFontsize: 14Fontcolor: #000MenuFontColor: #FDFDFDOverskrift: Fed HeaderImage: baggrund3.jpg Farver: Links UnderstregLinksHover #DB1541Indholdbaggrund #FEF3DDWidgetsbaggrund #F5DEB3Wrapperbaggrund #CB1E18Menubaggrund #COB59E Plugins: All‐In‐OneEventCalendar ContactForm7 NextGenGallery SimpleFacebookConnect TransposhTranslationFilter