Størrelse: px
Starte visningen fra side:

Download "http://youtu.be/7gdq0uch2gw"

Transkript

1

2 Indholdsfortegnelse Indledning (Fælles) 4 Problemformulering 4 Problemstilling 4 Metode (Monique) 5 Overvejelser over fremgangsmåde 5 Præsentation af udviklingsmetode 6 Projektplanlægning og ledelse 7 Hovedafsnit 10 Discovery 10 Desktop research (Emilie) 10 Målgruppen (Monique) 12 Konklusion af målgruppe (Monique) 14 Delkonklusion på Discovery-afsnit (Emilie) 15 Interpretation 16 Personas og scenarie (Emilie) 16 Mobil website (Monique) 17 Informationsarkitektur (Daniel) 18 Persuasive Thinking (Monique) 20 Delkonklusion på Interpretation-afsnit (Emilie) 21 Ideation 22 Konceptudvikling 22 Brainstorm / Mindmap (Emilie) 22 Konceptet (Monique) 23 Budskab (Daniel) 24 Sidens opbygning 24 Skriftlig kommunikation (Emilie) 24 Skitser (Emilie) 25 Wireframe (Monique) 29 Delkonklusion til ideation (Lars) 31 Experimentation 32 2

3 Ny informationsarkitektur (Fælles) 32 Mockups 35 Desktop forside (Emilie, Daniel) 35 Mockups til partnerside (Emilie, Daniel) 36 Mobil website (Monique) 37 Kodning (Lars) 38 Database 39 PHP 42 Tegnsætsdilemmaet 46 Partneren der skulle slettes to gange 47 Frontend 48 Wordpress 49 Tests (Daniel) 49 Kortsorteringstest 50 Delkonklusion på experimentation (Fælles) 52 Evolution (Monique) 53 Videreudvikling 53 Markedsføring 53 Video (Daniel) 55 Konklusion (Fælles) 57 Refleksion & Perspektivering (Fælles) 58 Fejlkilder (Fælles) 60 Litteratur og kilder (Fælles) 61 Web prototyper: Video: ixperimentor.com/3sem/exam/ 3

4 Indledning EASJ har stillet os til opgave at udvikle et værktøj som kan skabe overblik og overskueliggøre deres eksisterende samt kommende partnerinstitutioner i udlandet. Værktøjet skal anvendes både af studerende, der skal finde et opholdssted i udlandet og EASJs administratorer der skal opdatere informationer om partnere. I denne rapport vil forklare, hvordan vi har løst denne opgave, hvilke problemer og udfordringer vi har haft og hvordan man kunne videreudvikle løsningen. Problemformulering Hvordan kan vi bruge vores udviklingsmetoder og procesværktøjer til at skabe en database baseret dynamisk web løsning for easj.dk s sektion om udlandsophold, der opfylder målgruppens behov? Problemstilling Hvilke(n) udviklingsmetode(r) er bedst anvendelig for ovenstående opgave? Hvilke værktøjer, modeller, teorier m.m. har været anvendt i processen? Hvordan er de anvendt og hvordan passer de ind i den anvendte udviklingsmetode? Hvor godt opfylder den præsenterede løsning kundens og målgruppens behov. 4

5 Metode Overvejelser over fremgangsmåde I vores projekt har vi lavet en proces planlægningsmodel, så vi har et værktøj til at styre, hvilke faser vi skal igennem i de næsten 5 uger. Vi har to modeller der står i kontrast til hinanden, som vi har overvejet. 1 Den ene model er vandfaldsmodellen, som er en lineær model. I denne model afslutter man hver fase, før man går videre til den næste, og man vil - så vidt muligt - undgå at gå tilbage i processen. Vi ser dette som en begrænsning i vores projekt, da vi vil have mulighed for at gå tilbage i processen og lære undervejs. Dette gør man som regel først til sidst i vandfaldsmodellen, hvor det derimod er vigtigt for os at have mulighed for at teste og udvikle ud fra målgruppens meninger, og dermed opnå det bedste resultat. 2 Vi har i stedet valgt at bruge IDEO s Design Thinking. IDEO s Design Thinking er en tankegang, som giver lov til at fejle og prøve igen, lære af tests og udvikle vha. iterationer. Vi bruger denne, da vi mener, at vi vil kunne lave et bedre produkt med denne metode, fordi IDEO s Design Thinking er oplagt at bruge, hvis man vil have en agil proces, hvor man kan springe frem og tilbage i faserne og teste undervejs. Hvordan vi har tænkt os at bruge den, kan læses nedenfor. 1 Kommunikation i multimediedesign, s Design Thinking for Educators, s. 11 5

6 Præsentation af udviklingsmetode Vi har tænkt os at bruge IDEO s Design Thinking som giver overblik over, hvilke forskellige faser vi skal igennem i vores proces. Den første fase er discovery, hvor man laver research om emnet og indsamler data. Dette har vi gjort ved at lave desktop research af easj.dk og interviewet målgruppen. Den næste fase er interpretation, hvor man behandler den data, man har indsamlet og analyserer den. Her har vi lavet en målgruppeanalyse ud fra vores interviews, og vi har blandt andet set på easj.dk s informationsarkitektur. Den tredje fase er ideation, hvor man idéegenerer over de analyseresultater, man er kommet frem til. Dette har vi gjort ved blandt andet at idégenerere og konceptudvikle på easj.dk s website - hvad kunne gøres anderledes? - og skabt et design ud fra sketches og wireframes. Fjerde fase er experimentation, hvor man laver det produkt, man har designet. Her har vi lavet en database med tilhørende data visualisering og nyt content til easj.dk med blandt andet en video. I experimentation tester man også sit produkt. 6

7 Man kan teste sit produkt på flere måde. Vi har tænkt os at anvende usability tests og prototype tests. Med disse tests, kan man teste ufærdige produkter. Hvis testpersonerne synes, at der er noget der ikke fungerer, retter man sin prototype til og tester det igen. Det gode ved at prototype teste er, at man kan tilpasse sit produkt efter hvad målgruppen vil have. Prototype testing passer godt sammen med IDEO s Design Thinking, da vi har lov til at gå frem og tilbage i processerne.resultatet af testene kan fortælle os hvad der kan forbedres og hvor. På den måde kan vi blive ved med at udvikle produktet. Den sidste fase er evolution, hvor man fortsætter processsen med at videre udvikle produktet eller se, om noget kunne gøres bedre. Hvis dette er tilfældet, starter man forfra i IDEO s Design Thinking. Projektplanlægning og ledelse I vores projektplanlægning har vi også brugt IDEO s Design Thinking som en rettesnor. Vi planlagde, at hver fase ville vare én uge, og på denne måde byggede vi en projektplan op. 3 Projektplanen uddyber, hvad der skal laves hver dag i hver uge. På denne måde har vi sikret os, at vores proces bliver vellykket, og at forarbejdet er blevet lavet. Vi har bygget planen op sådan, at vi på forhånd har sat deadlines for, hvornår vigtige milepæle skal være nået. Vi har efterfølgende skrevet ned i planen, hvornår andre, mindre opgaver skulle færdiggøres, og gjort dem til en deadlines. Hver fredag har målet været, at der skulle tjekkes op på hvad der har været lavet af tests i løbet af ugen og hvad der skulle laves, så vi huskede at få dem lavet og kunne rette til om mandagen ugen efter. Der kan dog være nogle problemer med denne slags projektplan, vi har lavet, da det kan være svært at få et overblik over, hvor langt i processen man er. For at holde styr på ting som disse, har vi udvalgt en projektleder. Projektlederens opgave er, at have det store overblik over hvad man har nået i projektet, hvad man skal til at lave nu, og at planlægge fremtidige opgaver. Derudover sørger projektlederen for, at deadlines bliver overholdt - og hvis ikke de gør, hvordan tiden så skal omstruktureres. I praksis blev dette blevet gjort ved at vi holdte et lille møde, hvor vi hver dag fandt ud af, hvad der skulle laves. Vi skrev op på en tavle, hvad der skulle laves, og hvem der skulle lave det - og hvilke andre opgaver der var, så man 3 Projektplan, bilag 1 7

8 kunne gå i gang med noget nyt, når man var færdig. Derudover har vi siddet sammen og arbejdet hver dag, så vi løbende hen af dagen snakkede om, hvor langt vi var med hver vores ting. Vores rapport er ligeledes opbygget over IDEO s Design Thinking, da vi har indelt rapporten i de fem forskellige faser. Under hvert kapitel har vi uddybet, hvad vi har gjort i den respektive fase - hvilke metoder og analyser vi har brugt, og hvilke resultater vi har fået ud af det. Med hensyn til projektledelse, har vi tildelt hvert gruppemedlem en rolle. Rollefordeling Daniel Primær rolle: Design Sekundær rolle: Kodning Emilie Primær rolle: Kommunikation Sekundær rolle: Design Lars Primær rolle: Kodning Sekundær rolle: Projektleder Monique Primær rolle: Projektleder Sekundær rolle: Kommunikation Vi har fordelt roller, så vi hver især har en primær rolle vi står for. Her skal vi sørge for, at deadlines bliver overholdt og beslutninger bliver taget. Vi har også fået tildelt en sekundær rolle, hvor vi assisterer den person, der har den primære rolle. 8

9 Samtidig har vi aftalt, at vi generelt kan gå ind og assistere hinanden i de forskellige roller, da dette vil give os størst udbytte af projektet. Vi har siddet sammen hver dag, og der har derfor været en høj grad af samarbejde, og på denne måde har vi kunne følge med i, hvad der sker i alle processerne. Rollen for konceptudvikling tager vi i fællesskab, da vi er enige om, at det er vigtigt at få alles input. Vores fordelte roller er mere vejledende end endegyldige. Refleksion over projektplanlægning Da vi først gik igang med at lave projektplanen, virkede det som en overskuelig måde at styre projektet på. Vi havde en idé om, at hver fase i IDEO s Design Thinking ville tage en uge, og vi planlagde derfor projektet efter denne forestilling. Vi erfarede dog hurtigt, at det ikke var så enkelt, og at især discovery og interpretation tog længere tid, end vi havde planlagt - og at vi allerede kunne gå igang med at kode noget af databasen op, selvom vi ikke var færdig med de første faser. Herefter blev det svært at bruge projektplanen, da hele uger skulle planlægges om - og egentlig stressede det os bare lidt, at vi ikke nåede deadlines, vi havde sat. Derudover havde vi planlagt, at vi hver fredag fulgte op på, hvad vi havde nået, og hvilke tests vi havde lavet eller skulle lave, men dette var lidt fejlbedømt, da vi i virkeligheden hver dag holdte status på forløbet. Istedet begyndte vi dagligt at skrive op på en tavle i det lokale, vi sad i, hvad der skulle nåes den pågældende dag. Dog blev projektplanen stadig brugt af projektlederen til at holde øje med, hvilke opgaver vi manglede, og planlagde dermed de enkelte dage på denne måde. 9

10 Hovedafsnit Discovery I dette kapitel vil vi komme ind på vores første fase i projektet. I discovery-fasen vil vi lave vores research, vores definition af målgruppen, vores hypoteser om målgruppen, interviews og hvad vores resultat af dette arbejde er. Dette vil vi senere benytte til at finde ud af, hvordan vi bedst løser opgaven. Desktop research Vores desktop research har vi brugt til at skabe et overblik over emnet i starten af projektet, hvor vi har kigget overfladisk på forskellige, lignende hjemmesider, og ikke lavet dybdegående analyser af dem. EASJ Vi har kigget på easj.dk for at få et overblik over, hvilke udfordringer vi møder på siden. Det første 4 vi har lagt mærke til er, at informationsarkitekturen ikke er helt optimal. Under siden For studerende mangler der at blive linket ordentligt mellem de forskellige undersider. F.eks. er der ikke noget link fra Praktik til Kom ud i verden - hvilket ellers virker ret indlysende. Dette kan måske føre til, at brugerne ikke får det ud af websitet, som de skal - kan de finde det de leder efter nemt og hurtigt? Eller leder de efter det i lang tid - i værste tilfælde giver op? Derudover har vi kigget på indholdet på undersiden Kom ud i verden. Vi har snakket om, at det er tungt med den tekst, der står som introduktion. Den skræmmer mere end den tænder. Man får et indtryk af, at det er rigtig svært at komme ud i praktik, og at der er rigtig mange, uoverskuelige krav. Desuden mener vi at det er et problem at navngive menupunktet, Kom ud i verden. Det er ikke tydeligt for alle at det omhandler udlandspraktik og studieophold. Vi har tænkt os at lave en 5 grundigere analyse i afsnittet Informationsarkitektur. 4 A Practical Guide to Information Architecture, s. 4 5 Informationsarkitektur, s

11 Grib Verden 6 Grib Verden er en kampagneside i samarbejde med Ministeriet for Forskning, Innovation og Videregående Uddannelser Styrelsen for Videregående Uddannelser. Dens formål er, at skabe en stærkere dialog mellem danske studerende og studierelaterede udlandsophold. Vores projekt ligger tæt op ad, hvad Grib Verden formidler, og vi har derfor tænkt os bruge denne side som inspiration. Den indeholder blandt andet en video - som også er et af vores produktkrav - hvor man bliver præsenteret for forskellige studerende, som opfordrer en til at tage på udlandsophold, og et kort så man kan se, hvor man kan komme hen i verden. Det er relevant for os at have dette website med i vores overvejelser, så vi kan få inspiration til, hvad der fungerer godt og hvad der fungerer knap så godt. Erhvervsakademi Århus Vi har valgt undersøge, hvordan andre erhvervsakademier præsenterer udlandsophold, og har i 7 denne forbindelse kigget på Erhversakademiet Århus. På Erhvervsakademi Århus hjemmeside klikker man ind under den uddannelse man tager og læser sig hurtigt frem til noget om mulighed for at tage en del af denne uddannelse i udland. Man kan klikke på et link nederst i teksten og finder så en side med nogle korte videoer om folks udlandsophold. Man kan klikke på Praktikvirksomheder i venstre menu og får herved serveret en simpel liste med navne over virksomheder der tidligere har haft studenter i praktik. Herfra forventes den studerende formodentlig selv at undersøge virksomhederne nærmere og eventuelt kontakte dem. Dette fungerer udmærket idet man hurtigt kan kopiere navnet og lave en google-søgning på hver enkelt virksomhed. Erhvervsakademiet Sydvest 8 På Erhvervsakademi Sydvest s website er der en menu på startsiden kaldet Mest for studerende, som er en expanding menu, hvorfra man hurtigt finder Praktik- og jobportal. På er/praktikvirksomheder

12 denne underside finder man bla. en ansøgningsvejledning, som hjælper den studerende igennem dette lidt overfladisk, og links til websites, der slår praktikpladser op. Derudover bliver der under hver uddannelse linket til Grib Verden, så man kan finde ud af mere der inde. Fælles for de to erhvervsakademiers undersider vedrørende udlandsophold er, at de - ligesom Easj - er lidt kedelige at se på. Det virker til at være en generelt tendens, at der ikke bliver gjort det helt store ved dette emne. Umiddelbart ser vi ingen konkurrenter, da ingen har den helt store, prangende informationsside, hvor de studerende kan finde information om deres udlandsophold. Den største inspirationskilde for os vil være Grib Verden, da det er den, der giver det bedste overblik og virker til at være den, der vil fange en bruger mest via videoer, billeder og et spændende indhold. Målgruppen Målgruppen, som kunden har defineret, består af studerende fra Erhvervs Akademi Sjælland, der skal på udlandsophold. Dette er vores primære målgruppe. Vi har også en sekundær målgruppe, da easj.dk er en side der er til, for at tiltrække potentielle, nye studerende. Disse er derfor også en målgruppe, samt studerende på andre studier, der ønsker at søge information om udlandsophold. Vi har dog valgt kun at fokusere på den primære målgruppe, da sektionen Kom ud i verden tilbyder Easj s partnere, og disse er for Easj s studerende. Vores hypoteser Da vi selv er en del af målgruppen, har vi nogle hypoteser om, hvordan denne tænker. Vi har taget udgangspunkt i vores egne erfaringer, efter vi har lavet desktop research easj.dk. Websitet benyttes ikke. Vi har antaget at målgruppen ikke benytter EASJ s website i deres dagligdag. De fleste ved, at siden eksisterer og hvad den hedder, men føler ikke at den er relevant. Fordi easj.dk ikke benyttes så meget, kender målgruppen heller ikke til undersiden Kom ud i verden. Websitet er svært at finde. De studerende, der har et brændende ønske om at komme i praktik i udlandet, vil søge information ad mange forskellige veje, før de finder frem til undersiden Kom ud i verden. De vil ofte starte på Google og søge viden den vej. 12

13 Meget, uoverskuelig information. Flertallet af studerende har ikke en særlig omfattende viden omkring udlandspraktik og overvejer ikke selv at undersøge det yderligere i tilstrækkeligt god tid. De synes at det er for besværligt at undersøge informationen og få det hele til at fungere i praksis. Umotiveret målgruppe. Det vil være svært at motivere hele målgruppen på lige fod, da den er så bred. Dels i kraft af de forskellige uddannelser, og dels i kraft af de forskellige individers livssituation mht alder, familieforhold m.m. Interviews For at undersøge vores hypoteser og egne tanker om målgruppen, har vi udført en kvalitativ 9 undersøgelse. På denne måde sikrer vi os, at vi ikke er farvet af opgaven, og at vi dermed får det bedste resultat. Vi har valgt at lave et kvalitativt interview, da vi har mulighed for at få en dialog i gang med vores adspurgte personer, og de har mulighed for uddybe deres svar. På denne måde får vi mere ud af undersøgelsen, da vi kan analysere på deres svar, frem for blot at kunne konstatere en tendens ud fra nogle kvantitative svar. Vi har brugt en gruppe af repræsentanter fra målgruppen bestående af tre administrationsøkonomer fra EASJ Campus Køge, som vi interviewede. Dette foregik ansigt til ansigt, hvor to personer interviewede og observerede målgruppen, mens en tredje person skrev noter. Derudover har vi interviewet en 10 bygningskonstruktør fra EASJ Campus Næstved. Ud fra vores interviews fandt vi ud af, at vores repræsentanter ikke fandt det relevant at komme i praktik i udlandet. De synes også, det virker uoverskueligt at skulle undersøge alle de praktiske ting, og easj.dk s hjemmeside gør det kun mere uoverskueligt. For det første kendte de slet ikke nok til easj.dk, så de var ikke bekendte med undersiden Kom ud i verden. Derudover ville de aldrig gå ind på hjemmesiden for at søge om praktikinformation, men derimod søge på Google. De synes, at indholdet på hjemmesiden fik det til at virke meget krævende at skulle i praktik, fordi teksten er så tung. De anbefalede selv at teksten kunne suppleres af billeder eller video. 9 Målgruppeanalyse s Interview med målgruppen, bilag nr. 2 13

14 De ønsker mere information om de forskellige lande, man kan søge praktik i, og at indholdet på undersiden Kom ud i verden gerne måtte være lidt mere interessant at se på. De synes også, at hjemmesidens struktur er lidt forvirrende, blandt andet at navngivningen af nogle af menupunkterne er misvisende. Vi har ydermere også lavet et énmands interview med en mandlig bygningskonstruktørstuderende fra EASJ Campus Næstved. I modsætning til de ovenstående repræsentanter, ønsker han at komme i praktik i udlandet. Han havde søgt information gennem en studievejleder, og fik først kendskab til easj.dk da studievejlederen anbefalede siden. Han synes, at sidens indhold er fint nok, men han mangler stadig flere informationer, og at det bliver lidt mere spændende at se på. Han foreslog også en virksomhedsprofil for de partnere der i forvejen er tilknyttet EASJ, således at man kan se en præsentation af virksomheden, samt den vigtigeste info. Konklusion af målgruppe Ud fra vores interviews har vi erfaret, at mange af vores hypoteser er blevet bekræftet. Websitet benyttes ikke: Der er generelt en manglende viden omkring easj.dk, og især undersiden Kom ud i verden. Websitet er svært at finde: Målgruppen ville bruge Google til at søge efter information, frem for at gå ind på easj.dk. Meget, uoverskuelig information: Vi fik ikke direkte bekræftet denne hypotese, men målgruppen sagde, at inde på easj.dk manglede der information om emnet. Umotiveret målgruppe: Nogle fra målgruppen mente ikke, at udlandsophold var relevant for dem, mens vores enkelt-interviewede person allerede søgte det. Dermed får vi bekræftet, at det vil være sværere, at ramme nogen end andre, da det er en bred målgruppe vi arbejder med. Blandt de der ikke mente at det var relevant blev det også nævnt at hvis de skulle tage praktik i udlandet ville de i hvert fald være meget sikre på at have solide og pålidelige kontakter med personer i udlandet først. 14

15 Vi har set to eksempler på typer indenfor målgruppen: Den utrygge type, og den opsøgende type. Den utrygge type skal tages lidt i hånden og føres igennem processen med at finde en praktikplads. Den opsøgende tager selv initiativ til at finde informationer, men bremses lidt pga. manglende mulighed for at finde relevant information. For begge typer er det gældende, at de gerne vil have et mere spiseligt indhold, som giver dem lyst til at komme ud og opleve verden. Baseret på vores egen bedømmelse samt de interviewedes reaktioner og kommentarer til siden mener vi, at sidens informationsarkitektur kan optimeres og at indholdet kan præsenteres på en mere spændende og muligvis mindre teksttung måde. Det er desuden af stor vigtighed at gøre de studerende opmærksomme på sidens Kom ud i verden -sektion i god tid så de kan undersøge denne mulighed og få følelsen af at det er noget der er relevant for dem og som kan give dem en hel masse udbytte. Delkonklusion på Discovery-afsnit I dette afsnit har vi indsamlet data ved at have foretaget desktop research, skabt hypoteser om målgruppen og herefter interviewet målgruppepersoner. Vi har fået indblik i målgruppens opfattelse af kom ud i verden -sektionen og får ud fra dette stof til at udvikle vores produkt i overensstemmelse med brugernes behov. De områder der hovedsageligt skal bearbejdes på easj.dk s kom ud i verden -sektion, er ifølge vores informationsindsamling; siden skal generelt fremstå mere spændende, at strukturen bør optimeres, at labels bør præciseres, at partnere ønskes mere visuelt og udførligt præsenteret. 15

16 Interpretation I dette kapitel vil vi komme ind på vores anden fase af arbejdet. I interpretation-fasen vil vi fortolke den data og viden, vi har fået igennem første fase. Vi finder her, ud fra vores fortolkninger og analyser, noget viden vi kan bruge længere fremme i projektet til at udvikle produktet ud fra. Personas og scenarie 11 Personas er fiktive versioner af målgruppepersoner, sammensat af den viden vi har om målgruppen og især den research vi har lavet. Vi har valgt at arbejde med personas, da disse er repræsentanter for målgruppen, og det gør det dermed nemmere for os som designere at sætte os i en brugers sted. På denne måde kan vi lettere tage design-beslutninger uden nødvendigvis at skulle have fat i en bruger, da personaen hjælper os med at have brugeren i tankerne. 12 Personas kan man efterfølgende sætte ind i et brugerscenarie. Et brugerscenarie beskriver, hvordan personaen bruger et bestemt produkt, og ved dette kan man udlede hvilke vigtige beslutninger personaen tager - og hvad der dermed skal tages hensyn til i ens endelige design. Persona 1 13 Vores første persona er Ann Jensen på 20 år, som studerer Administrationsøkonomon på Erhvervsakademiet Sjælland, Campus Køge. Ann repræsenterer den utrygge type som er et typisk familiemenneske. Hun synes, det er uoverskueligt at undersøge alle de praktiske ting i forbindelse med udlandspraktik, og hun ved ikke om hun har lyst til at tage afsted, da hun har en kæreste og familie i Danmark. Persona 2 14 Vores anden persona er Michael Jokumsen på 23 år, som studerer på Erhvervsakademiet Sjælland, Campus Næstved. I modsætning til Ann, repræsenterer Michael den opsøgende type 11 A practical guide to Information Architecture, s A practical guide to Information Architecture, s Persona 1, bilag 3 14 Persona 2, bilag 4 16

17 fra målgruppen. Han har lysten og motivationen til at tage i praktik i udlandet, men han bremses lidt af manglende information og organisering, selvom han har forsøgt at gøre et godt forarbejde. Brugerscenarie 15 I vores brugerscenarie undersøger Ann hvilke praktiske foranstaltninger hun skal tage i forbindelse med udlandsophold, og hvilke muligheder hun har. Dette gør hun på easj.dk, da skolen har oplyst hende om, at hun kan bruge dette website. Mobil website Vi har lavet nogle observationer af det nuværende easj.dk/kom-ud-i-verden på smartphone. Vi har erfaret, at den ikke er responsiv, og der er ikke nogen optimering til smartphones. Hvis man går ind på easj.dk, er man nødt til at zoome ind for at kunne læse tekst og for at kunne trykke på knapper/links. Hver gang man bevæger sig hen på en ny side, nulstilles zoom-niveauet og man er tvunget til at zoome igen. Dette er et irritationsmoment der kan få mange brugere til at opgive. Indholdet på Kom ud i verden sektionen består af meget tekst og stort set intet visuelt, hvilket er svært at overskue, især på en lille skærm. Dette øger efter vores mening sandsynligheden for at brugeren opgiver. Da vi har vurderet, at easj.dk ikke fungerer særlig godt på mobil og tablet, har vi valgt at der skal laves et mobil website. Det mobile website skal være til den person, der er på farten. F.eks. Ann Jensen, der på skolen har hørt om, at man kan komme i praktik i udlandet, og at man kan se mere inde på easj.dk. Hun har lang vej hjem fra skole, og får tiden til at gå med at undersøge, hvad dette med praktikophold i udlandet går ud på. Ud fra dette lille scenarie er det klart, at det derfor kun skal være de mest nødvendige ting, der skal være med på et mobilt website. De tunge informationer ville man i højere grad undersøge på desktop, da det er mere overskueligt at læse meget tekst på en større skærm. På det mobile website skal vi sørge for, at vi fanger den studerendes opmærksomhed og skaber en interesse for emnet, så de får lyst til at undersøge det nærmere når de kommer hjem. Det er vigtigt, at man er aktuel på alle digitale platforme, hvis man vil blive set - Moment Of Truth : 15 Brugerscenarie, bilag 5 17

18 The MOTs are meeting. Our mobile devices are MOT machines. As mobile usage grows, the zero, first and second moments of truth are converging. 16 Der er stor konkurrence om at fange brugernes opmærksomhed, og flere og flere bruger deres 17 mobil eller tablet på farten - og endda derhjemme, selvom de har en desktop til rådighed. Det er altså vigtigt for easj.dk også at have et mobilt website, da de på denne måde fanger den studerenes opmærksomhed med det samme og sørger for, at interessen til videre fordybelse bliver skabt. Det ville være nødvendigt at analysere hele easj.dk for at finde ud af, hvilke sider der er relevante at have på et mobilt website. Vi har blot analyseret sektionen Kom ud i verden og har fundet ud af, at forsiden til sektionen er meget vigtig. Det er her vi skaber opmærksomheden. Derudover har vi tænkt os at lave den alternative datavisualisering, som er en del af produktkravene, til en mobil enhed. Et verdenskort fungerer ikke særlig godt på en lille skærm, og derfor vil vi finde på noget, der passer bedre til dette. Denne skal fungere på samme måde som på desktop - at man sorterer sin søgning, og en datavisualisering viser ens søgeresultater. Informationsarkitektur Informationsarkitektur handler om at strukturere det indhold, der skal være på den side, man laver. Indholdet skal grupperes og navngives på en måde der vil forekomme logisk og let at finde 18 rundt i for brugere af sitet. Hierarki Kom ud i verden sektionen er opbygget efter en bred polyhierarkisk struktur, da der er flere 19 emner i det øverste niveau men færre niveauer. Det brede hierarki kan med fordel bruges, hvis 16 Google ZMOT s Danmarks statistik: BEBRIT15.px&gr_type=1&PLanguage=0 18 A Practical Guide to Information Architecture s A Practical Guide to Information Architecture s

19 man skal skabe et overblik over en informations tung side eller sektion og man kan på den måde opnå en bedre usability. 20 Sektionen er polyhierarkisk da nogle emner kan findes mere end et sted. Fx kan Quick Guide 2 findes både under menuerne ansøg og praktikophold. Navigation Den globale navigation består af menuerne i toppen og den lokale navigation består af menuen i venstre side. Med måden navigationen er struktureret på, kan man faktisk tale om det omvendte L. Med det omvendte L menes en struktur hvor den globale navigation er horisontal og den 21 lokale navigation er vertikal. Til tider er tre menubokse i den lokale navigation. Dette er en stor svaghed og igennem tests, fandt vi ud af at målgruppen ikke fandt det brugervenligt, da navigationen ikke er konsistent og derfor kan være svær at overskue. Dette er suppleret med en ikke eksisterende indikation for, hvor man befinder sig på siderne - hverken i form af et brødkrumme spor eller andet. Labels Labels er betegnelsen for de ord man vælger at bruge i informations arkitekturen. De beskriver grupperinger af indhold og bliver oftest brugt i navigations sammenhæng. De har til formål at fortælle brugeren hvad der skal ske når man klikker på menuen, hurtigst muligt. De labels Kom ud i verden gør brug af forklarer, ifølge vores tests, meget godt hvad der sker når man klikker på menuen, og brugeren har en god idé om, hvad han kan forvente. Vi har lavet et sitemap over den nuværende IA, da dette kan hjælpe os med at få et visuelt 22 overblik over, hvad der skal laves om. Et større billede af sitemappet findes som bilag. 20 A Practical Guide to Information Architecture s A Practical Guide to Information Architecture s Sitemap, bilag 6 19

20 23 Hvordan vi har tænkt os at lave en ny IA kan læses senere i rapporten. Persuasive Thinking Motiverende design er et forsøg på at realisere virksomheders eller organisationers ønske om, at brugerne opfører sig på en bestemt måde eller tager bestemte holdninger til sig under besøget af en hjemmeside. Ideen om motiverende design bygger på, at man undersøger brugernes bevæggrunde til at gøre bestemte ting, og at man konstruerer sin 24 hjemmeside i overensstemmelse med den viden. I vores projekt har vi brugt persuasive thinking til at gøre det lettere for den enkelte bruger at finde lige netop den information, de hver især søger. Dette har vi brugt tre teorier til: Reduction: Med reduction gør man en bestemt opgave lettere at løse for brugeren, f.eks. ved at sørge for, at der ikke skal særlig mange handlinger til, før man kommer frem til det, der var ens mål. Vi har især brugt reduction til vores underside Partnere, hvor brugeren kan sortere i deres ønsker omkring, hvor de vil hen på udlandsophold. Customization/tailoring: Man customization til at få brugeren til at føle, at den information, de finder, er skræddersyet til dem. Dette har vi igen brugt til filtrering på undersiden 23 Ny informationsarkitektur, s Motiverende Design - Speciale i Informationsvidenskab s. 3 20

21 Partnere, da brugeren vil opleve kun at få vist lige præcis de partnere, der passer til deres ønsker - og andre partnere, der også kunne være relevante for brugeren at se på. Tunneling: Vi har tænkt os, at der skal findes en guide, som skal placeres under Ansøg. Til dette kan man anvende tunneling, som bruges til at lede brugeren igennem en handling. Denne guide hjælper brugeren igennem - step by step - hvilke ting man skal huske at ansøge om, og hvordan man gør det. Delkonklusion på Interpretation-afsnit I dette afsnit har vi gennemgået de informationer vi har indsamlet og de observationer vi har gjort os omkring hvordan den nuværende easj.dk/kom-ud-i-verden/ fungerer på en række vigtige områder. Vi har tolket ud fra vores målgruppeinterviews og egne vurderinger at der er problemer med inkonsistens i menuen, mangel på overblik over hvor på sitet man er og at siden ikke er mobilvenlig. Vi har vurderet på baggrund af viden og litteratur at det vil være en stor fordel for brugerne at kunne bruge siden på mobile enheder som smartphones og tablets. Af denne grund har vi også valgt at have den alternative datavisualisering (i stedet for kort) til smartphones /tablets. 21

22 Ideation Det er i ideation vi vil begynde at idé- og koncept udvikle. Dette gør vi ved at bruge de behandlede data, vi har arbejdet med i intepretation. I dette kapitel vises, hvordan vi har tænkt os at udtrykke vores koncept - som ogsåbliver dannet i denne fase. Til dette skabes brainstorms, mindmaps, skitser og wireframes. Konceptudvikling Efter at have analyseret vores indsamlede data, har vi kunne lave et koncept. Dette har vi gjort ved hjælp af brainstorm og mindmap. Brainstorm / Mindmap Brainstorm 22

23 Mindmap 25 Vi har lavet en brainstorm - hvor vi dog så småt lod processen flyde over i mindmap-struktur. Vi har nemlig besluttet, at brainstorm-processen skulle efterfølges direkte af mindmap, og de to flød derfor lidt sammen. Det første vi har lavet ligner visuelt et mindmap, men er blevet tænkt og brugt mest som brainstorm. Vi lod alle ord vi mente der hørte til emnet blive skrevet på en tavle usorteret. Herefter sorterede vi lidt af ordene fra, idet vi ikke mente de skulle have indflydelse på websitet. Vi har herefter lavet et mindmap. Mindmappet lod os strukturere de mange løse ord, vi havde samlet usorteret sammen i vores brainstorm. Vi har forbundet ordene med streger ud fra hoved-emnet og derunder sorteret i de underemne-grupper, der er opstået, så vi kan vælge emne-grupper til og fra. Konceptet Vores koncept er, at synliggøre mulighederne der er i et udlandsophold for brugeren, og gøre al informationen lettere at overskue. Vi har tænkt os at vise mulighederne ved at have bla. testimonials, hvor studerende fortæller om deres gode oplevelser i udlandsophold. Derudover har vi en datavisualisering som også viser brugeren, hvilke muligheder de har med hensyn til, hvor de kan tage hen. Denne skal give dem appetit til at komme videre i processen, og i sidste ende søge om udlandsophold

24 Vi vil også lave en partnerprofil for de tilknyttede partnere, hvor man vil kunne finde information om den enkelte partner, så man kan se hvad de kræver og kan tilbyde. For at gøre al den praktiske information lettere at overskue, har vi tænkt os at der skal laves en guide, som hjælper dem med ansøgningsprocessen - og med de vigtige ting, der skal tages hensyn til som bolig, økonomi osv. Budskab EASJs nuværende budskab er at informere studerende om udlands- og praktikophold. Vores budskab vil lægge fokus på både at informere - men ikke mindst motivere at de studerende. Generelt set, skal sektionen Udlandsophold sælge sig selv bedre, ved at fortælle om mulighederne, istedet for begrænsningerne og alle de mange krav. Hele konceptet kan opsummeres i et enkelt budskab: Du skal tage på udlandsophold fordi det giver dig masser af muligheder, fremmer dine kompetencer og styrker din faglige-, såvel som din personlige udvikling. Sidens opbygning Skriftlig kommunikation Sektionen som den er nu består af en masse tekst og links der fører til endnu mere tekst. Vi har dog vurderet, at al teksten under sektionen sådan set er relevant. Den skriftlige kommunikation er overvejende fin, men enkelte steder er den for fagligt indforstået i forhold til de brugere, den henvender sig til. Det største problem for indholdets kommunikation til brugeren er præsentationen. Præsentationsformen af indholdet kunne gøres anderledes på flere forskellige måder. Primært har vi valgt, at der skal nogle visuelt fangende elementer ind - især på forsiden - og at disse skal 26 ligge i en kommunikationsmæssigt god rækkefølge. Dette er baseret på både vores egen vurdering af siden og understøttet af vores målgruppepersoners udtalelser. Der findes også andre måder at gøre tekstmæssigt indhold på en side lettere for brugere at overskue. Det kunne gøres ved hjælp af typografiske justeringer. Man kunne vælge at skrive nogle tekststykker i 26 Kommunikation i Multimediedesign, s

25 punktform for at give brugeren hurtigt overblik over de vigtige ting som teksten indeholder. Derudover har det betydning for læsevenligheden hvor tæt teksten står - altså man bør sørge for tilpas linjeafstand og tilpas mængde afsnit. Dette har vi besluttet at sektionen generelt bør gøre i større omfang. Til små overskrifter bruger siden lige nu kun fed skrift, der er på størrelse med brødteksten. Disse korte tekster kunne fange brugeren bedre hvis de var en smule større og eventuelt havde en anden farve. Alle disse små typografiske justeringer har vi vurderet, at teksten på siden bør have; det gælder både tekst der står som det første på en side og tekst der påtænkes at være i expanding-menuer. Generelt om sproget kan man også sige, at det er meget fagligt og kan virke en smule kedeligt - dette lagde målgruppen også meget vægt på, og de følte, at de blev skræmt lidt væk af teksten. Et eksempel på sproget, er vist i dette citat: Du skal have sprogkundskaber i det relevante sprog på et niveau svarende til en IELTS på IELTS er en type sprogtest som anvendes internationalt til at angive en studerendes sprogniveau. Niveauet 6,0 6,5 svarer til et niveau, hvor du kan anvende et fremmedsprog flydende og ubesværet. Andre sprogtests kan også anvendes, f.eks. 27 TOEFL. Sproget burde være tilpasset læserne i højere grad, hvilket sandsynligvis ville øge både forståelse og motivation. Skitser Vi har benyttet os af skitser i ideationfasen. Vi har brugt skitserne til at få en masse forskellige ideer på bordet i forhold til udseendet af websitet. Skitserne bruges til at visualisere ideer til farver, former, placeringer og generelt udseende af elementer på websitet. Skitser kan laves på forholdsvis kort tid, og er en hurtig måde at få mange forskellige tanker visualiseret, så man herefter kan udvælge det, der vil fungere bedst

26 Brødkrummesti 28 På nuværende easj.dk/kom-ud-i-verden er der ikke en særligt udførlig brødkrummesti. Det har vi fundet frem til, at vi kan optimere. Brødkrummestien kan gøre det hurtigere og lettere for brugeren at bevæge sig mellem forskellige niveauer på siden, fremfor - som det er nu - at man kan havne på en underside af en underside, og der kræves flere klik at komme tilbage. Vi har 29 lavet en række skitser til udseendet af en brødkrummesti. For at den ikke skal trække for meget opmærksomhed fra de andre elementer - fx i forhold til kortet og partnere - har vi valgt at brødkrummestien skal bestå af tekst og ikke kasser eller andre figurer. Expanding menuer Under de forskellige undersider skal vi have en del tekst, så den besøgende kan finde lige præcis dén information, de har brug for. Vi har tænkt over, hvordan vi kan lave en informationsrig side med meget tekst, men uden at gøre det uoverskueligt for den besøgende. Dette har vi blandt 30 andet tænkt os at gøre, ved at lave nogle typografiske ændringer, som vi tidligere har nævnt. Vi 31 kiggede på forskellige måder at gøre det på rent visuelt, og fandt stor inspiration fra ug.dk. Ved at bruge denne form for expanding menuer, kan de besøgende finde lige præcis den information, de ønsker, inden for et bestemt emne (undermenu). Dette bidrager til at volumen af tekst ikke virker så markant, dog bevares overblikket fortsat, uanset hvad man læser herunder. Menuerne virker også ved at den opsøgende type vil have hurtig adgang til de informationer, vedkommende skal bruge. 28 A Practical Guide to Information Architecture, Donna Spencer, 2010 s Skitser: Brødkrummesti, bilag 7 30 Skriftlig kommunikation, s

27 Datavisualiseringer Vi har overvejet mange forskellige typer datavisualiseringer, for at finde den bedste løsning til desktop og smartphone. Vi skulle i alt bruge to visualiseringer til at visualisere vores data fra databasen. Den ene har opgavenbeskrivelsen defineret på forhånd som et geografisk kort, der skulle kunne visualisere samarbejdspartnere. Den anden skulle visualisere det samme, men være et alternativ eller et supplement til kortet. Vi valgte derfor at prøve at lave en visualisering, der kunne fungere på vores mobilversion af siden Men hvordan skaber man denne, der skal kunne håndtere og visualisere så meget information, på så lidt plads? Det første vi tænkte var at lave en liste, lidt a la den man ser på fx 32 Hotels.com. Men kunne vi gøre det på en anden og måske bedre måde? For ikke at lade os begrænse af en smartphones størrelse, lod vi os løsrive fra den og begyndte at tænke ude af boksen.det sværeste ved at skulle lave denne form for visualisering var, at finde en der kunne arbejde med vores datatype. Havde vi haft med tal, der skulle sammenlignes at gøre, kunne man plotte dem ind på forskellige grafer eller diagrammer, såsom cirkel- og søjle diagrammer. Vores data er ikke numerisk og derfor er det svært at indsætte den i et almindeligt diagram eller tabel, så derfor har vi prøvet at finde på forskellige løsninger til en alternativ 33 visualisering. Vi overvejede en visualisering der tager udgangspunkt i en cirkel, hvor partnere og lande kredser omkring. Når man har valgt en partner, ville denne blive highlightet sammen med landet. Da vi selv fandt denne visualisering svær at få forstå, valgte vi at bruge en liste til mobilsiden alligevel, da denne ville give et langt bedre overblik og flere parametre er&ymcheckin=2013%7c12&dayinmonthcheckin=10&ymcheckout=2013%7c12&dayinmonthcheckout=1 1&roomInfoList%5B0%5D.numberOfAdults=1&roomInfoList%5B0%5D.numberOfChildren=0&numberOfRoom s=1&destinationid= &hotelid=&lids= 33 Skitser: Alternativ visualisering, bilag 8 27

28 Forsiden 34 I skitsefasen, hvor vi har tegnet en masse forskellige skitser, er der både nogle der indeholder ikoner, nogle der indeholder tringuides, samt nogle der har lidt af hvert. De ting har vi valgt at have en blandet version af på forsiden. Vi har lavet en overordnet guide med tre punkter på forsiden. Denne kommer til udtryk gennem tre farvede cirkler med ikoner for hvert trin: Før opholdet, Under opholdet og Efter opholdet. En skitse indeholdt blandt andet idéen med at have en række ikoner i højre side af forsiden imens en anden indeholdt idéen om en tringuide som dog er åben for at brugeren selv kan vælge hvilken rækkefølge de ønsker at læse tingene i. Vi valgte denne løsning for at give brugeren en overskuelig tilgang til de forskellige faser i det at tage et udlandsophold. Guiden på forsiden af sektionen bidrager desuden til at kunne tage den lidt tilbageholdende 35 persona i hånden. Guiden skal hjælpe til at gøre projektet udlandsophold lidt mere overskueligt og håndgribeligt og føre brugeren lige fra de spæde overvejelser omkring udlandsophold til gennemførelse og sluttelig hjemkomst-fasen. Vi har overvejet om guiden kun skulle ligge under ansøg, men har besluttet at den er god også at have allerede på forsiden, hvor den fanger opmærksomheden. Selvom brugeren så vælger i stedet at bruge venstremenuen til en systematisk gennemlæsning af emnet, vil brugeren stadig være klar over tilstedeværelsen af guiden. Brugeren kan derfor vende tilbage til forsiden af sektionen hvis vedkommende ønsker at skabe sig overblik over hvilken rækkefølge der kan være praktisk at overveje hvad i. Partnersiden Til partnersiden har vi ligeledes lavet en række forskellige skitser over hvordan partenere skulle 36 stilles op og vises praktisk. Siden skulle have et geografisk kort over partnere. På vores skitser har kortet været placeret forskelligt, og vi har overvejet og besluttet hvor på siden det skulle placeres, samt hvorfor i vores skitse fase. For eksempel har vi skitser, hvor kortet fylder det meste, og andre hvor det spiller en 34 Skitser: Forsiden, bilag 9 35 Persona 1, bilag 3 36 Skitser: Partnerside, bilag 10 28

29 mindre rolle. Den løsning vi bestemte os for som værende den bedste er en, hvor kortet spiller en central rolle og får folk guidet fra at vælge land til at vælge en konkret virksomhed. Wireframe 37 Ved hjælp af et wireframe har vi præcist fundet ud af, hvordan opbygningen af sektionens forside skal se ud, ud fra vores skitse. Til at starte med har vi bedømt, hvor godt forskellige 38 elementer virker. Vi har derefter bedømt, hvilke elementer der ville passe bedst til vores website. Vi blev enige om, at billede, video og datavisualisering passede bedst til vores opgave, da disse skaber mest blikfang og bedst viser vores information. 39 Mens vi byggede wireframes op, brugte vi AIDA. AIDA er en kommunikationsmodel, som man kan bruge til at bygge et konkret grafisk materiale op om, eller en hel kampagne. Den kan enten bruges i opbyggelsen af produktet, eller som en test for at se, om alle ens intentioner med produktet lykkes. AIDA modellen er ikke en statistisk strategi for succes, men kan virke vejledende, og som et godt værktøj til at komme på rette spor. Vi har i denne sammenhæng brugt AIDA til at bygge et konkret grafisk materiale op; vores wireframe. 37 Wireframe, bilag Pros and cons, bilag Kommunikation i multimediedesign, s

30 Attention: Vi har valgt at placere et billede øverst på sidesektionen, da det skaber stort blikfang og er hurtigt at vurdere. Under attention sørger vi for, at den besøgende bliver på websitet, og ikke finder et andet. Interest: En salgstekst under billedet, som introducerer den besøgende for, hvad man kan læse om på siden, og som vækker interessen for at undersøge websitet nærmere. Desire: Vi har valgt at lægge vores video længere nede på sitet. Først snakkede vi om, at lægge den øverst i stedet for billedet, men blev enige om, at dette ikke var en god idé. En video tager tid at se, og vi må ikke risikere at miste den besøgendes opmærksomhed allerede i starten. Videoens opgave er at give lyst til at tage ud og opleve verden. Action: Som action har vi valgt at lave et link til undersiden Partnere, hvor vores datavisualisering ligger. På denne måde sørger vi for, at den besøgende kommer godt i gang med at undersøge websitet, og vi gør det lettere for dem at finde ud af, hvor det er en god idé for dem at starte, hvis de skal søge udlandsophold. 30

31 Som nævnt, kan AIDA også bruges til at bygge en kampagne op om. Hvordan vi har forestillet os 40 dette, kan ses i bilag. Efter skitser og wireframes er debatteret, og vi i gruppen har valgt de overordnet bedste løsninger, skabes der prototyper via mockups og kodning. Delkonklusion til ideation I vores arbejde i ideation fasen har vi arbejdet for at komme på de bedste idéer og løsningsforslag vi kunne komme frem med. Vores koncept skal synliggøre de muligheder man får af udlandsophold, overskueliggøre informationen på siden og guide brugeren. Dette vil vi gøre vha en bedre præsentation af det skriftlige indhold, en forbedret IA med eksempelvis brødkrummesti og relevant data visualisering med mulighed for at filtrere efter behov. Desuden skal vores sektions-forside være fangende og partnersiden skal effektivt hjælpe brugeren på rette vej. 40 AIDA overordnet, bilag 13 31

32 Experimentation I experimentation begynder vi at producere vores nye informationsarkitektur og vores produkt, så vi har en prototype. Dette gør vi ved at udforme vores endelige design via mockups, og derefter kode det i html, css, php, javascript/jquery og en database i MySQL. Herefter testes prototypen med bruger- og prototypetests. Ny informationsarkitektur For at skabe en god informationsarkitektur er det vigtigt at planlægge, hvad man vil opnå, således at man kan organisere og beskrive sit indhold effektivt. Derefter er det vigtigt at skabe gode muligheder for brugeren at få adgang til indholdet. 41 Derfor har vi fulgt følgende 6 trin : 1. Hvad har vi brug for? Man starter med det øverste niveau og finder derefter de understående niveauer. Da vi skulle skabe en forbedret informationsarkitektur, startede vi med at finde ud af, hvad vi havde brug for og hvilke elementer vi skulle have med. Vi har fundet ud af, at informationsarkitekturen skal laves lidt om, for at brugeren kan få et overblik over siden. Dette har vi fundet ud af, ved at analysere den nuværende informationsarkitektur, og ved at udlede de samme observationer fra det interview vi har 42 haft med målgrupperepræsentanterne. Vi har blandt andet fundet ud af, at der skal skabes mere overblik over navigationen. Det er vigtigt, at der kun er én lokal navigation, da dette giver bedst overblik for brugeren. Vi har tænkt os at beholde den brede polyhierarkiske struktur, da dette fungerer godt til en 43 informationsrig side. I forbindelse med denne, vil vi lægge en form for brødkrummer ud, så brugeren nemt kan finde tilbage, og ikke farer vild på siden. 41 A Practical Guide to Information Architecture s Interview med målgruppen, bilag? 43 A Practical Guide to Information Architecture s

33 Ud fra vores interviews med målgruppen kunne vi også udlede, at overskriften Kom ud i verden kan være lidt misvisende. Istedet har vi tænkt os at kalde sektionen for Udlandsophold, og overskriften i menuboksen for Kom ud i verden - vi bytter simpelthen bare om på dem, så der slet ikke er tvivl om, hvad sektionen handler om. Vi fjerner også undersiden Gode råd, da vi har tænkt os at placere dem på forsiden istedet, og deler dem derudover ud på de forskellige, relevante undersider. Vi har ikke tænkt os at gøre mere ved labels og ændringer i menuen, da vi synes de ting, der er nu, er relevante og vigtige for brugeren at have. I vores IA analyse af easj.dk fandt vi ud af, at det er en bred polyhierarkisk struktur. Idéen med denne form for hierarki er god til denne side, men vi synes ikke, at udførelsen af den er optimal, da nogle relevante links mellem sider ikke eksisterer på det nuværende website. F.eks. er det meget relevant, at der er et link fra Udlandsophold til Praktik, og fra Udlandsophold til Praktikportalen. 2. Lav det! I denne fase starter vi udarbejdelsen af vores informations arkitektur. Vi har samlet informationen til nu at kunne udarbejde noget visuelt til der kan illustrere hvordan vi ønsker at sitet opbygges. Dette har vi valgt at gøre ved at lave et sitemap. Til at starte med behøver det ikke være præcist, men kan starte som en skitse eller whiteboardtegning over det man forestiller sig baseret på den viden man nu har erhvervet sig i de foregående faser af ens projekt. Det vigtigste på dette punkt er bare at man begynder at lave det man forestiller sig. 33

34 44 3. Check og test det På dette trin er det vigtigt at teste det, man har lavet, for selv for de mest erfarne folk i branchen kan det tage mere end ét forsøg at få skabt den rigtige løsning for netop den side, man arbejder på. Man skal danne sig en ide om, hvorvidt ens løsning vil give mening for brugerne. Vil de kunne forstå måden hvorpå ting er grupperet sammen og vil de labels, man har valgt, give mening for dem? Her skal man også danne sig et overblik over, om al indholdet kan passe ind et sted - eller om der for eksempel er noget indhold, der ikke logisk passer ind bestemte steder. 45 På dette trin har vi ikke til fulde gennemtestet sitet, men i kraft af de test vi dog har foretaget, har vi alligevel dannet os en idé om, hvor på det nuværende site brugerne oplever problemer, og derfor hvilke områder der skal ændres på. Desuden har målgruppens udtalelser også gjort, at vi kan forestille os hvilken løsning der vil være nærliggende; her for eksempel med henblik på overskrift-labels der blot blev byttet om. 4. Lav det igen På dette trin forbedrer man arkitekturen ud fra det, målgruppen har sagt under testene. Man ser på det, man allerede har og gennemgår det igen - endnu grundigere og mere i dybden. Man skal overveje grundigere alle de steder, brugeren kan få forvildet sig hen, og 44 Nyt sitemap, bilag Fejlkilder, s

35 hvordan dette område fungerer. Denne fase har vi ikke gennemgået på grundig og praktisk vis, da vi ikke har testet nok på målgruppen Stop i tide Man skal vide, hvornår man skal stoppe, så man ikke bruger for lang tid på det. Denne fase er, når man har gennemarbejdet sin løsning så mange gange, at det virker logisk, let og dermed færdigt. 6. Diskutér Det er en god idé at diskutére resultatet med andre. Dette kan gøres med kunden, med kollegaer eller målgruppepersoner. Det vigtigste er, at man får andres respons på det, man har lavet. Hvis de adspurgte begynder at tale om detaljer, så ved man, som udgangspunkt, at man overordnet har ramt rigtigt med det meste. Her er vi heller ikke nået til med vores nuværende version at sitet, men har dog løbende adspurgt både hinanden og kollegaer omkring løsninger47. Mockups Vi har lavet mockups efter at skitse og wireframe faserne er overstået. Herunder præsenterer vi vores endelige mockups over udlandsopholds-sektionens forside, partner-side-flowet og vores alternative datavisualiseringsvalg - til mobile enheder. Desktop forside Vores endelig mockup af forsiden ser ud som på billedet her. Vi har gennemgået en del forskellige udkast på skitsestadiet og på mockup stadiet, før vi syntes at det ramte præcist det, vi ville have. Det vi har prioritet er, at forsiden skal fange brugerens interesse og opmærksomhed (og holde fast i brugerens Fejlkilder, s. 60 Fejlkilder, s

36 opmærksomhed i de første og vigtigste sekunder hvor brugeren møder siden.) 48 Det bliver gjort gennem både billeder, farver, kort tekst og en kort video. Farver Vi har brugt de grønne farver som designmanualen indeholder til de tre steps i guiden øverst til højre. De grønblå og grønne nuancer giver et overvejende roligt indtryk farvemæssigt. Den lysegrønne cirkel øverst til højre er dog lidt mere iøjnefaldende og er bevidst lagt øverst og lavet i denne farve for at fange brugerens blik, dog uden at blive det dominerende blikfang på siden. Vi har netop valgt de tre grønne farver frem for nogle orange eller røde farver, som ellers også er en del af designmanualens farvepalette, da vi synes de røde og orange farver bliver for dominerende i denne sammenhæng. Mockups til partnerside Partnerprofil: Vi benytter en profil til partnerne, hvor man kan finde en masse relevant information om den specifikke partner. Dette vil hjælpe brugerne i deres søgen efter potentielle partnere. På partnere siden vil der være mulighed for at tilgå de specifikke partneres profil -side. Denne skal indeholde: En præsentationstekst, så den studerende hurtigt kan få et overblik over, hvad de foretager sig. Derudover skal der være links til partnerens website og evt. sociale medier, så den studerende har mulighed for at undersøge mere om virksomheden/institutionen gn slide nr

37 Hvilke forventninger der er begge veje: Hvad virksomheden/institutionen forventer af den studerende, og hvad den studerende får ud af opholdet. Her er også testimonials fra tidligere studerende, der har været på samme besøg, så den studerende ved, hvad de kan forvente at opleve. 49 Vores mockups til partnersiden fokuserer mest af alt på at visualisere det flow, brugeren går igennem på denne del af udlandsopholdssektionen. Den version der senere vil være kodet, vil syne mere detaljeret og være mere farverig. Disse mockups viser dog til rimelig nøjagtighed hvilke ting brugeren vil kunne gennemgå i kronologisk rækkefølge på vores færdige version. Det første brugeren møder er et verdenskort hvorpå der kan klikkes for at vælge land. Den orange menu til højre på siden kan lige så vel bruges til at vælge kontinent eller specifikt land, samt bruges til at vælge uddannelsestitel, sprog, og type ophold man ønsker at filtrere partnere efter. Det næste brugeren ser, er at kortet nu fokuserer (zommer ind) på det land eller kontinent, man har valgt. Herefter ses en oversigt over partnere. Det sidste billede i det ovenfor viste flow, er når brugeren har klikket på en konkret partners virksomhed for at læse grundigere information om denne. Mobil website Vi har også lavet mockups af, hvordan datavisualiseringen skal se ud på det mobile website - den alternative datavisualisering -, som vi tidligere har beskrevet, vi ville lave. Vi vurderede, at det ville være mest optimalt at bruge en liste-form, da det er begrænset, hvor meget skærmplads man har på et mobilt website. Vi har overholdt EASJ s designmanual, men brugt strukturen i listen fra hotels.com, da der er plads til den mest nyttige information, og et billede til at gøre det spændende at se på. 49 Mockup: Partnersiden, bilag 15 37

38 50 Vi har ikke lagt yderligere vægt på, hvordan designet af det mobile website ellers skal se ud, da dette ikke var en del af opgaven - vi har blot sat datavisualiseringen ind i nogle rammer, så det er nemmere at forestille sig det i praksis. Kodning I dette afsnit vil vi fortælle lidt om de mere kode-relaterede aspekter af opgaven. Vi vil komme ind på hvad disse ting er og hvordan vi har brugt dem: 50 Mockup: Mobil website, bilag 16 38

39 Database PHP HTML CSS JavaScript Nogle udvalgte udfordringer Wordpress - hvordan kunne vi have integreret vores løsning med wordpress? Database En database gør det let at gemme større mængder af information på en sådan måde at det er let og hurtigt at tilgå kodemæssigt via f.eks. PHP og at man kan søge i det hurtigt. 51 Til dette projekt har vi haft til opgave at oprette en database over EASJ s samarbejdspartnere vedrørende udlandsophold. Denne laver vi som en MySQL database, som vi tilgår via PHP. Yderligere siger vores opgave at vores database skal normaliseres til 2. normalform. Normalisering har til formål at fjerne duplikering af data. Ved at separere nogle af dataene ud i forskellige tabeller kan man undgå at bestemt data går igen. F.eks. så befinder mange af partnerne sig i samme land, så i stedet for at have landets navn stående ved hver partner, kan man blot linke de forskellige partnere til det bestemte land. 52 Vi startede ud med at liste op alle de ting vi kunne tænke os at have tilgængelige i databasen. Dette var ting som partnernavne, information om partnerne, land, kontaktinformation m.m. Da vi havde en liste vi var tilfredse med, gik vi i gang med at lave en foreløbig inddeling af elementerne. Dette resulterede i tabellerne: partner og land. Derefter gennemgik vi 1. normalform. 51 PHP, MySQL, JavaScript, & CSS s PHP, MySQL, JavaScript, & CSS s

40 Første normalform hjalp os med at beslutte at en ting som for eksempel uddannelser, skulle være i sin egen tabel, da et studie godt kunne være relevant for flere forskellige partnere. Det samme besluttede vi for sprog og land, desuden lavede vi en tabel kaldet kontinent, så man kunne inddele landene i kontinenter. Adresser og kontakt-information blev oprettet da vi lavede 2. normalform. Dette valg traf vi da vi mente at en partner godt kunne have flere adresser og sandsynligvis også kunne have flere kontaktpersoner, måske endda en kontaktperson pr. adresse. 40

41 Som det kan ses på billedet herover af databasen, er der yderligere 2 tabeller, nemlig partner_has_sprog og partner_has_uddannelse. Disse to tabeller er resultatet af 53 mange-til-mange relationen mellem partner og henholdsvis sprog og uddannelse. Da en partner kan have flere talte sprog, bør det være mulig at registrere flere sprog hos en partner. Dog er det også muligt for flere forskellige partnere at benytte det samme sprog, for eksempel Engelsk. Derfor skabes en tabel der skaber en relation mellem de 2 relevante tabeller, ved at parre et partner-id med henholdsvis et sprog-id eller et uddannelses-id. Vi lavede denne database med henblik på at den gerne skulle indeholde meget af hvad der kunne være relevant til en fuldt funktionel version, dog ændredes de mulige behov sig lidt efter vi var gået i gang med at kode siden. Således har vi kun lavet en enkelt kolonne til url, hvor at det måske ville være optimalt med flere. I en fremtidig version ville det måske være oplagt at have en url til et billede af partneren, og så url er til testimonial-videoer omhandlende hvordan det har 53 PHP, MySQL, JavaScript, & CSS s

42 været at være hos partneren. Et andet element der måske kunne være relevant i fremtiden er mulighed for en sammenhæng mellem kontakt og adresse tabellerne, så man kan knytte en kontaktperson til en bestemt adresse. PHP PHP er et sprog der ofte benyttes når man skal behandle information på serversiden og så sende det til klienten(brugerens browser). Man kan eksempelvis trække information ud fra en database, behandle den og så sende den ud til brugeren. Man kan også tilføje til, ændre i eller slette fra databasen med PHP. Alt PHP udføres på serveren og sendes så til klienten som HTML. 54 Vi er blevet stillet for at lave et backend interface til vedligeholdelse af databasen. Her skal det være muligt at tilføje, ændre og slette data. Dette gør vi vha PHP og de indbyggede MySQL kommandoer. Desuden benytter vi også HTML til opbyggelsen af vores interface. Vi startede ud med at lave et HTML dokument som vi byggede op så det lignede det interface vi ville lave. Derefter tilføjede vi den PHP kode som vi skulle bruge. Dette blev gjort i flere stadier, da vi faktisk har en håndfuld PHP filer som en del af dette interface. Vi har en PHP fil kaldet functions.php, som er tiltænkt til funktioner vi bruger gentagne gange. I dette tilfælde har vi blot én funktion som vi bruger til at forbinde med vores database og som sikrer at der arbejdes med UTF-8 som tegnsæt, hvilket vi vil komme nærmere ind på senere. Functions.php inddrages så i starten af hvert eneste PHP dokument der arbejder med vores database, vha en funktion kaldet 55 require_once. Denne funktion indsætter det dokument den referer til i det dokument den er skrevet i. 54 PHP, MySQL, JavaScript, & CSS s PHP, MySQL, JavaScript, & CSS s

43 Desuden har vi selve interface siden maintain.php, som er den side hvorfra vores database administrator kan tilføje partnere, ændre partnere eller slette partnere. Desuden kan han også se hvilke partnere der er i databasen. Visuelt er der en formular til tilføjelse og så en liste over oprettede partnere. For at skabe denne funktionelle side, er der nogle bestemte kodesegmenter, der er ret vigtige. Først har vi en formular til tilføjelse af nye partnere. Denne formular består af nogle HTML elementer, som <input type= submit >, <input> og <select>. Den første af disse 3 typer, er knappen man benytter til at sende formularen afsted. <input> er ganske almindelige indtastningsfelter og <select> er dropdown menuer med valgmuligheder. Vha af en kombination af disse inde i et <form> tag, er brugeren i stand til at udfylde alle de nødvendige data, for at uploade en ny partner til databasen. Når brugeren trykker indsend og uploader de nye data, hentes informationen ud af formularen til benyttelse i PHP en vha en forespørgsel kaldet $_POST. Denne funktionen henter informationen 56 og gemmer det i et array med samme navn. Vi tager så og gemmer de relevante data til variabler, og benytter efterfølgende disse variabler i den SQL query vi sender afsted til databasen for at indsætte den nye information i databasen. Faktisk indsender vi 5 queries, da vi indsætter i 5 tabeller. Dernæst har vi listen over nuværende partnere. Denne er genereret vha PHP, hvor vi ved brug af en for-løkke og forskellige MySQL funktioner, bygger listen. Først har vi et SQL SELECT query, 56 PHP, MySQL, JavaScript, & CSS s

44 som vi bruger for at hente de relevante data fra databasen. Vi benytter her udtrykket JOIN til at forbinde flere tabeller til en bestemt tabel, i dette tilfælde til 57 partner tabellen. Når vores query er hentet fra databasen, gemmer vi den i et array kaldet result. Dernæst tjekker vi om query en har været succesfuld eller har fejlet. 57 PHP, MySQL, JavaScript, & CSS s

45 Når vores query er klar, benytter vi forskellige PHP-indbyggede MySQL funktioner til at vise vores data frem på den måde vi ønsker at vise den. I vores opbygning af hver synlig partner, skabes der også en ret og en slet knap. Ret knappen leder hen til en side, edit_record.php, hvor man kan redigere den valgte partners information. Denne side består af en formular magen til den foregående, bortset fra at felterne allerede er udfyldte med partnerens nuværende information og der ikke er en liste over partnere. Når man trykker indsend sendes formularresultaterne til en tredje side, update_data.php, bestående af ren PHP, der udfører handlingen og sender brugeren tilbage til maintain.php. Slet knappen sender brugeren hen til en side der viser den pågældende partners information og spørger om brugeren virkelig ønsker at slette partneren. Trykker man ja, bliver partneren slettet og man bliver sendt tilbage til maintain.php, ellers bliver man blot sendt tilbage til maintain.php. Når man bliver sendt til en anden side automatisk, foregår det vha af denne smule kode: 45

46 header('location: maintain.php'); Tegnsætsdilemmaet Et tegnsæt er kodning af tegn. Der er mange forskellige tegnsæt man kan benytte, hvoraf de 58 fleste er baseret på ASCII kode. Et af de mest brugte er UTF-8, som blandt meget andet, indeholder æ, ø og å. I bund og grund handler det om at man giver hvert tegn en form for kode, som computeren kan læse og dermed levere det ønskede tegn. Da vi havde oprettet databasen og lavet maintain.php blev vi mødt af et problem. Der var mærkelige tegn i stedet for æ, ø og å, rundt om i teksten. Dette var på trods af at vi umiddelbart havde alting indstillet til UTF-8: Vores database var oprettet og stod som værende UTF-8. Vores HTML havde et metatag der indstillede dokumentets HTML til UTF-8. Vores dokument var indkodet som UTF-8. Og vores Apache server var sat til UTF-8 som standard. Hvad vi fandt endnu mere besynderligt var, at det kun var nogle steder at den leverede forkerte tegn, andre steder var der intet problem med æ, ø og å. Yderligere sært blev det, at det skiftede rundt når vi fjernede HTML - metatagget. Hvilket betyder at de steder hvor æ, ø og å ikke virkede, pludselig gjorde, og de steder æ, ø og å virkede, ikke længere gjorde. Vi troede måske at det var databasen der var indstillet forkert, men måtte aflive denne overbevisning da nogle af dataene fra databasen var korrekte nok, og vi havde tjekket databasen grundigt igennem. Desuden stemte dette ikke overens med den virkning det havde at fjerne metatagget. Efter lidt research på nettet fandt vi ud af at det kunne være vores Apache server den var gal med. XAMPP er en lokal server beregnet til udvikling, der benytter Apache server-software. Dette er en nødvendighed når man koder PHP da det kun kan afvikles fra en server. Har man ikke en server installeret, er man nødt til at uploade det til en online server hver gang man skal teste

47 noget. Efter at have rodet godt og grundigt med indstillingerne af vores Apache server, måtte vi konstatere at det heller ikke gjorde nogen forskel. Vi havde så godt som opgivet at løse problemet da vi faldt over en artikel fra 59 stackoverflow.com, der omhandlede dette problem. Denne artikels løsning, var at tilføje 4 linjer kode, lige efter at man havde forbundet til databasen. Alle 4 linjer kode er funktioner der indstiller tegnsæt. Den første og den sidste linje sætter henholdsvis resultater fra databasen og navne på kolonner til at være indkodet i UTF-8. Funktionen mb_language() bruges til at sætte nuværende sprog. I dette tilfælde er den muligvis ikke nødvendig. Funktionen mb_internal_encoding() bruges til at sætte den interne indkodning af dokumentet. Efter at have tilpasset og indsat disse 4 funktioner, forsvandt vores tegnsæts-problem. Partneren der skulle slettes to gange Efter at vi havde oprettet muligheden for at slette en partner rendte vi ind i et mindre problem. Når vi forsøgte at slette en partner, slettede den kun partnerens adresse, kontaktinformation, sprog og uddannelser, som alle lå i separate tabeller. Den slettede ikke selve partneren, før vi trykkede anden gang. Da vi kiggede det kode der stod for sletningen af en partner igennem, gik det hurtigt op for os hvad problemet var. Rækkefølgen hvormed vi slettede en partner, var forkert. Vi forsøgte at slette fra partner-tabellen først og de andre efterfølgende. Dette var et problem fordi at indholdet i de andre tabeller var afhængige af indholdet i partner-tabellen. Eksempelvis er en partners adresse bundet op på den specifikke partners id, og databasen ville ikke tillade at slette

48 partneren fra partner-tabellen, så længe den også var repræsenteret i andre tabeller. Vi løste problemet ved at rykke sletning fra partner-tabellen om i slutningen af vores slette-kode. Frontend Vi har kodet siderne i HTML, CSS, JavaScript og PHP. Hvis vi på en let forståelig måde skal forklare hvad disse sprog gør, ville det være noget i retning af: HyperText Markup Language (eller HTML) er det sprog vi benytter til at fortælle browseren hvilke elementer der er på siden og i hvilken rækkefølge de kodemæssigt befinder sig. 60 Cascading Style Sheets (eller CSS) bruger vi til at forklare browseren hvordan vores side skal se ud. For eksempel hvilke farver bestemte elementer skal have, men også størrelse og hvor på skærmen de skal befinde sig. 61 JavaScript (eller JS) bruges til at skabe dynamiske hændelser eller interaktion på siden. Det er især det sprog vi bruger til at behandle vores datavisualisering. Kortet vi har på partnersiden er et plugin, kaldet jqvmap, til jquery som er et JS bibliotek. 62 PHP har vi beskrevet tidligere i rapporten, i starten af PHP afsnittet. På frontend delen af vores opgave, har vi kodet en forside til udlandsopholdssektionen og en side til partnere. Her var det første vi gjorde at kode en skabelon baseret på udseendet af easj.dk. Denne skabelon kunne vi så benytte til de forskellige sider, så vi ikke skulle lave det samme grundlæggende kode flere gange. Da vi kodede forsiden, brugte vi vores forside mockup til at finde ud af hvilke elementer der skulle være på siden og hvor de skulle befinde sig. Vi benyttede den skabelon vi havde lavet forinden, hvilket betød at de faste rammer stort set allerede var på plads PHP, MySQL, JavaScript, & CSS s PHP, MySQL, JavaScript, & CSS s

49 Siden partnere, indeholder vores kort-baserede data visualisering. Arbejdet med at kode denne satte os noget på prøve og krævede at vi arbejdede med alle 4 sprog. Vi fandt et jquery plugin som vi benytter til at skabe vores kort. Dette kan vi også fordre med data til at farve udvalgte lande. Tanken er, at vi henter data fra vores database og benytter denne til at farve de lande som filtreringen tillader. Når ingen filtrering er valgt, highlightes alle lande der har partnere. Når man så vælger en specifik filtrering udtrykkes den som et SQL kald til databasen, der så returnerer ny data og siden genindlæses. I skrivende stund virker filtreringen desværre ikke, men vi arbejder på at få løst problemet. Wordpress EASJ.dk er baseret på CMS systemet Wordpress. Det fungerer ved at sitet har et tema og en opsætning der er standard for hele sitet, dertil har sidens administratorer et interface de kan benytte til at indsætte og redigere indhold. Vi er dog blevet gjort opmærksomme på at der har været behov for at lave såkaldte hacks for at få bestemte dele af indholdet til at fungere efter 63 hensigten. Hacks er når man bruger noget hjemmelavet kode, til at overskrive noget af den standard kode der er en del af sitet. Dette kan for eksempel være det valgte tema. Yderligere er der mulighed for at tilføje elementer som for eksempel database-vedligeholdelse i Wordpress egen interface. Dette ville gøre en ekstra side som vores maintain.php uoverflødig. Dog har vi også overvejet at det umiddelbart er Ole Kolling (eller andre medarbejdere, der sandsynligvis ikke har adgang til Wordpress-interfacet) der indsætter eller redigerer i partner-databasen. Grundet dette ville vores løsning med en side beregnet til vedligeholdelse af databasen stadig være det optimale. Vores bud på opgaven burde være let at implementere i Wordpress løsningen, dog kan hacks muligvis være nødvendige til at opnå enkelte ting. Tests Vores produkt skal gøres så brugbart som muligt - men hvad hjælper det, hvis brugeren ikke forstår det? Det er her tests kommer ind i billedet. Man kan teste for mange ting på mange 63 Vejleder, Jan Ingemansen 49

50 måder og derved skabe et overblik over de ting som er gode og dårlige, hvad der fungerer og hvad der skal ændres. I vores projekt var det ikke tilladt at teste på multimediestuderende, da der var risiko for, at de ville være farvet af uddannelsen og have en mere faglig vinkel til testen. 64 Man kan dele vores testområder op i tre dele : Funktionalitet Brugere har særlige behov, når de besøger et website, og det er derfor vigtigt at opfylde dem bedst muligt og hurtigst muligt, ellers kan det være svært at fastholde brugeren. Effektivitet Som med funktionaliteten er effektiviteten også en vigtig faktor, da handlingerne skal kunne udføres nemt og hurtigt. Hvis ikke dette er tilfældigt risikerer man igen at miste brugeren. Effektivitet er et konkurrenceparameter, fordi der ofte er andre websites, som brugeren kan søge hen til, hvis de opleves mere effektive. Tilfredshed Da det er meget individuelt og personlig,t hvordan et website opleves, er det vigtigt hvordan sitet føles. Er det motiverende, engagerende, lækkert at bruge? For at opnå dette, kræver det en god brugervenlighed og et godt design for at give brugeren oplevelsen af kvalitet, og det kan være afgørende for websitets succes. 65 Disse tre faktorer danner basis for den mest anerkendte definition på usability, og optimalt bør vi følge dem for at teste de forskellige behov hos målgruppen. Kortsorteringstest En kortsorterings test går ud på at adskille form og indhold, således at det alene er ordene på kortene, testdeltageren skal forholde sig til, og ikke i sammenhæng med grafik, webdesign og 66 teknologi i det hele taget. Denne form for test kan altså benyttes til at samle viden om, hvordan sproget i fx labels bliver opfattet og giver mening i forhold til deres placering af hinanden. 64 Usability s Usability s Usability s

51 Vi udførte en kortsorteringstest på en repræsentant fra målgruppen, hvor vi ville undersøge hvorvidt vedkommende forstod de labels, der er at finde på den eksisterende Kom ud i verden 67 sektion. Vi valgte en lukket test, da vi ville have et indblik i brugerens forståelse af kortenes tekst. Vores testperson forstod ikke hvad en del af labelsne var, og havde derfor meget svært ved at placere dem. Han havde fx svært ved at placere Quick Guide sne og mente at en del af labelsne virkede indforståede, og som om man skulle have kendskab til dem, før man så dem. Resultatet af testen var derfor, at brugeren ikke helt forstod, hvor han kom hen, hvis han klikkede rundt på siden. Vi har brugt denne test til at bekræfte vores hypoteser omkring sproget og den kommunikation, der blev er blevet anvendt. Det har ydermere givet os en fornemmelse af, hvad vi skal ændre og gøre bedre mht. labels. Vi har suppleret kortsorteringstesten med en brugertest, der kan afdække om brugeren kan finde 68 de informationer og løse de opgaver, som websitet er konstrueret til. Brugertest af Rasmus Hansen: Vi udførte denne test, da vi havde lavet et design og mockup, således at han kunne teste brugen af vores datavisualisering. Gennem denne test blev vi både informeret om, at der er plads til forbedringer - og det bekræftede samtidig de antagelser, vi havde på forhånd. Vi ville gerne teste, om han forstod det flow, vi har designet, som brugeren skal igennem for at bruge vores kort og finde Easj s tilknyttede partnere. Han forstod godt flowet, selvom der var en forhindring eller to undervejs. Fx ville han med det samme, da han så kortet, forsøge at interagere med det, og ikke bare bruge vores filtrerings system. Denne tanke blev derfor taget til overvejelse og brugt i en senere iteration. Testen er udført efter tænke højt metoden, hvor testpersonen fortæller om oplevelsen og deler sine tanker igennem hele testen. 67 Usability s Usability s

52 Delkonklusion på experimentation I experimentation fasen har vi brugt al vores indsamlede og fortolkede data til at lave vores bud på produkterne. Vi fik lavet frontend og backend sites, hvor frontend delen effektivt henvender sig til målgruppen efter vi fik forbedret informations arkitekturen og præsentationen af indholdet. Backend delen virker efter hensigten til at vedligeholde databasen, som også fungerer efter hensigten. Vi har gjort brug af et par forskellige brugertests for at få bekræftet vores antagelser om, hvordan brugere vil opfatte og interagere på siden. Vi har fundet ud af, at en del nuværende labels kan virke for indforstået til, at brugeren kan forstå hvad de indebærer, og at de derfor bør ændres. Vi har også erfaret at brugere finder mængden af tekst overvældende. Derudover har vi testet, hvordan brugeren ville interagere med det flow, vi havde tænkt at partnersiden skulle forløbe i, og her opdaget en opførsel der giver grund til at foretage en justering i interaktionsdesignet på den løsning, vi skaber. 52

53 Evolution I evolution samler man op på sine tests og finder ud af, hvad der skal laves om. Herefter kan man starte IDEO s Design Thinking proces forfra, og man kan iterere videre på sit produkt. I vores projekt vil denne fase først komme rigtigt til udtryk, når vi går til eksamen, da vi i tiden mellem rapporten og eksamen har tænkt os at videreudvikle produktet. Videreudvikling For at få det mest optimale produkt er det nødvendigt at videreudvikle det. Nogle arbejder efter princippet Constant Beta som betyder, at et produkt faktisk aldrig er færdigudviklet - der vil altid være plads til forbedringer. I vores projekt ville det blandt andet være nødvendigt at videreudvikle det mobile website, da vi selv kun har lavet forslag til sektionen Kom ud i verden. Dette skulle være fuldt fungerende med hele easj.dk. Det mest relevante information skal præsenteres på en måde, der stemmer overens med det medie man ser det på, altså en smartphone. Når man snakker videreudvikling kan man også snakke markedsføring; hvordan man udvikler en strategi, der kan fremme produktet på markedet. Markedsføring Ud fra vores målgruppeinterviews fandt vi ud af, at der ikke var stort kendskab til sektionen Kom ud i verden, før den blev introduceret til dem. Dette kan skyldes for lidt opmærksomhed omkring udlandsophold, så den studerende simpelthen ikke er klar over, hvor mange muligheder de egentlig har. 69 Vi har ud fra dette og vores egne hypoteser vurderet, at der bør laves en markedsføringsstrategi. Denne skal foregå på uddannelsesinstitutionerne; evt. via flyere, bannere, foredrag og lignende. 69 Vores hypoteser, s

54 Vi har ikke tænkt os at gå yderligere ind og lave en fuldt fungerende markedsføringsstrategi men blot nævne, at sektionen formentlig ville få mere succes, hvis der blev gjort mere opmærksom på den. 54

55 Video Et af produktkravene var at vi skulle lave en video, der introducerer til emnet udlandsophold og skulle give et overblik over muligheder i den forbindelse. Vi gjorde os overvejelser til denne proces under alle de andre processer, da vi først ville udforme selve video konceptet, da vi havde fået fastlagt et overordnet koncept. Vi havde dog alle idéer til det fra starten, så som fx en whiteboard animation eller live-action filming. For at planlægge hvad, hvornår og hvordan vi skulle visualisere vores idé, ville vi udarbejde vi et storyboard, der, trin for trin, forklarer hvad, hvor og hvordan ting skal ske. Men da selve indholdet virkede lidt for abstrakt til at tegne brugbare skitser af, besluttede vi at lave en tidslinje for hvordan videoen skulle forløbe. På den måde sikrede vi os at vi fik inddraget alle de elementer vi skulle have med. Vi overvejede at lave en whiteboard animation, der kort fortalt er en animeret video, hvor man tegner sin fortælling på et whiteboard, men da det er en blanding mellem begreberne stop-motion og timelapse, ville dette dog hurtigt blive en kompliceret proces. Efter lidt 55

56 research fandt vi ud af at der findes software der kan forsimple denne proces og give et hurtigt, men godt resultat. Lige som vi skulle til at starte med dette software, begyndte vi at overveje om det ville blive for simpelt og måske for kedeligt. Vi overvejede derfor en ekstra gang, om det var det vi skulle gå videre med og fandt frem til at denne type video er god til at forsimple komplekst indhold, men ofte skaber den ikke nok blikfang, da den netop er meget simpel. Med dette i baghovedet genovervejede vi så hvordan videoen skulle gribes an. Vi ville gerne lave noget animeret, da vi mente det var begrænset, hvor godt vi ville kunne introducere til emnet ved live-action filming med de relative få midler vi kunne gøre godt med. 70 Vi søgte derfor inspiration i en video lavet af den svenske art director Fred Nerby, der ved hjælp af animationer forklarer sit koncept og visualiseringer af det. Vi har derfor opbygget vores video over EASJ s website med udgangspunkt i sektionen Kom ud i verden. Dette ville også kunne bruges markedsføringsmæssigt, da videoen starter på EASJ s forside og derefter arbejder sig gennem Kom ud i verden, så brugeren får et indblik i hvor man finder sektion og hvad den indeholder. Dette har vi blandet med forskellige testimonials, der hver fortæller lidt om hvordan deres udlandsophold var og hvorfor brugeren skal gøre det. På den måde har vi alligevel fået kombineret live-action filming med animation. Vi har valgt at lave videoen i Adobe After Effects der, til forskel fra Final Cut, er et godt værktøj til at animere i, da man kan styre alt manuelt og opnår langt større frihed, end med fx Final Cut. Det tillader os at gå ned i de mindste detaljer, da man kan animere keyframes, frame for frame

57 Konklusion I dette projekt har vi anvendt IDEO s Design Thinking som udviklingsmetode til at nå frem til vores løsning på den stillede opgave. Vores løsning indebærer et redesign af EASJ s Kom ud i verden sektion med tilhørende database over partnerinstitutioner i udlandet, datavisualiseringer af tilknyttede partnere og en video, der introducerer til emnet udlandsophold. Vi er nået frem til denne løsning ved hjælp af flere forskellige værktøjer. Ud over et grundigt målgruppe-arbejde og udførlig desktop-research, har vi benyttet personaer og scenarier. Som et element i vores idéudviklingsfase har vi udviklet et koncept på baggrund af vores målgruppe, med udgangspunkt i to personaer: en utryg- og en opsøgende type. Igennem persuasive technology, har vi yderligere optimeret hvordan vores prototype henvender sig til vores målgruppe. Vi har yderligere tilføjet skitser, wireframes, mockups og informations arkitektur til vores udvalg af værktøjer. Vores prototype er kodet i HTML5, CSS3, JavaScript og PHP. Desuden har vi gjort brug af MySQL til vores database, som er i tråd med vores prototype. For bedst muligt at tilpasse vores prototype til målgruppens behov, har vi sørget for at teste undervejs. Ud fra alt dette kan vi konkludere at vores brug af IDEO s Design Thinking, har været et glimrende værktøj til at opnå vores mål om en database baseret dynamisk web løsning. Dette fordi den iterative procestype tillader at teste, lære og udvikle projektet undervejs. Ydermere passer processen rigtig godt til vores arbejdsgang. 57

58 Vi har lavet et produkt der både tager hensyn til den utrygge og den opsøgende type i målgruppen. Den utrygge: Guide, så de kan hjælpes igennem processen; bliver taget i hånden + video, som skal overtale dem om, at det er en god idé at tage på udlandsophold. Den ene udtalelse fra testimonials er også en utryg person som synes der var meget at se til, men endte med at have et godt ophold. Den opsøgende: Overskuelig information, dataviz som gør det nemt for dem at finde et sted, de kan tage hen; hjælper dem på vej ved at filtrere så de kun får vist en praktikplads/studieplads, der er relevant for dem. + guiden, der hjælper dem igennem processen. Refleksion & Perspektivering Hele processen i dette projekt har været præget af både positive og negative variabler. Vi har både som gruppe og som individer i sidste ende stået med følelsen af at have deltaget i en rigtig god proces. En af vores store udfordringer var vores projektplan, som vi konstruerede tidligt i processen. Vi endte desværre med at måtte bruge den mere som en to do liste, end en reel plan. Dette var delvist fordi at vi havde fejlvurderet hvor lang tid bestemte faser ville tage og delvist fordi vi havde glemt at indregne buffere til vores vejledninger. Vi oplevede derfor også unødig stress når vores deadlines blev stadigt sværere at overholde. Trods de problemer vi fik med tid i vores proces, oplevede vi også gode ting som en forbedret evne til at fastholde og færdiggøre kedelige opgaver, i forhold til tidligere erfaringer. Vores primære rollefordeling har været særdeles stærk, hvilket helt klart har hjulpet os gevaldigt med at holde kursen. Dog har vi måske ikke været så stærke til at følge op på vores sekundære roller. Det ville sandsynligvis kunne have hjulpet os til at holde kursen endnu bedre. Da vi først begyndte at planlægge vores projekt lavede vi en forventningsafstemning, som vi overvejende har holdt os pænt til. Denne har helt klart hjulpet os ved at sætte klare linjer, dog med en hvis fleksibilitet. Det at vi har været i stand til at møde en smule senere eller at tage hjem/på arbejde tidligere uden sure miner, har også bidraget til en god stemning internt i gruppen. Dette har medvirket til at styrke os som et team og det har vi drevet godt nytte af, når vi 58

59 har haft at gøre med team-opgaver. Når vi har udført disse opgaver sammen som en gruppe, har vi været gode til at få alt frem på bordet. Alt lige fra gode til dårlige idéer har været oppe at vende, før vi har udvalgt det mest brugbare. Vores forsøg på at teste har ikke været så optimale som vi kunne have haft ønsket. Dette har været grund til ærgrelse for os, men vi har forhåbninger om at kunne råde bod på det inden selve eksamen. På trods af, til tider, ophedede diskussioner, har vi aldrig været negative overfor hinanden. Igen et element der har styrket os som gruppe og bidraget til en øget motivation. Den gode motivation har helt klart været en drivkraft til vores positive oplevelse af processen, men har helt klart også været drevet af den gode proces. Noget der har været lidt af en overraskelse for os, har været rapportskrivningen. Vi startede ud med at føle et stort overskud i forhold til rapporten, og formåede at følge nogenlunde med i udformningen af den, som en løbende proces. Vores tidligere erfaringer har sat os i situationer hvor vi trætte har måttet færdiggøre vores rapport kort før deadlinen. Derfor var vi overraskede over at føle et sådant overskud i forhold til selve rapportskrivningen. Vi endte dog alligevel med, i 71 skrivende stund, i en natlig seance kort før deadline at udforme de sidste detaljer. Vi forestiller os, og håber, at det er fordi vi er blevet grundigere til at skrive rapport. Netop vores erfaring er et sted vi kan se en forskel i denne proces i forhold til tidligere opgaver. Vi har været meget bedre til at lave prioriteringer end ellers, og det har kommet os til gode ved at vi som gruppe har fungeret mere som en helhed. Vores erfaring har også givet os mere selvtillid og tilladt os at tage nogle bevidste til- og fravalg. Alt i alt har det været vores mest positive oplevelse med et eksamensprojekt hidtil. Vi har opfyldt vores produktkrav og leveret et produkt, vi godt kan være stolte af. Vores personlige udvikling har været god og tydelig, både i løbet af dette projekt, men især i forhold til tidligere projekter. Når vi tager hjem efter indlevering af rapporten, og straks går i gang med grublerierne om hvordan vi i det nye år skal tackle den kommende eksamen, vil vi være endnu bedre multimediedesignere end da vi gik i gang. 71 The ultimate inspiration is the deadline - Nolan Bushnell. 59

60 Fejlkilder Vores største fejlkilde i dette projekt har været den manglende testning. Vores intentioner var, at der (mindst) en gang om ugen skulle laves en bruger- eller prototypetest, men dette lykkedes ikke helt. Vi fik lavet et målgruppeinterview med tre studerende administrationsøkonomer og en bygningskonstruktør, og yderlige en til test af bygningskonstruktøren. Først og fremmest har vi ikke fået lavet testene helt efter bogen, og dette har kunne påvirke resultatet af testene. Skulle vi have lavet testene efter bogen, skulle vi have testet på flere, over længere tid og flere antal gange. Det vil sige, at vores tests er miniature udgaver af, hvordan man reelt skal gøre det. Dette giver et prej om målgruppen, men der vil altid være en fejlmargen. Det har også været svært at udføre testene korrekt, da de ofte kræver flere ressourcer end vi har til rådighed. Derudover har omfanget af tests været for lille: Hvis det skulle gøres korrekt, skulle vi helst teste alt det nuværende på sitet, vi ville lave om og derefter teste vores ændringer. Dette har også ført til, at vi ikke har udnyttet IDEO s Design Thinking helt, som vi havde planlagt. Meningen var netop, at vi ville teste vores produkt gennem hele forløbet, og ikke kun til sidst i processen. Vi har ikke været helt konsistente i måden vi har analyseret på og dette har givet os varierende fortolkninger af analyserne. Vi burde have analyseret på de samme parametre, de forskellige steder vi har lavet analyser og derved kunne aflæse og sammenligne bedre. 60

61 Litteratur og kilder Bøger Titel Forfatter Årstal Forlag Kommunikation i Multimediedesign Anne Mette Busch, David Engelby, Gunhild Marie Andersen & Torben Larsen 2011 Hans Reitzels A Practical Guide to Information Architecture Learning PHP, MySQL, JavaScript, & CSS, Robin Nixon Donna Spencer 2010 Five Simple Steps Robin Nixon 2012 O Reilly Media, Inc. Usability Målgruppeanalyse Ole Gregersen, Ian Wisler-Poulsen Christian Viktor Rasmussen, Louise Harder Fischer(red.) 2011 Grafisk Litteratur 2008 Nyt Teknisk Forlag Google ZMOT Jim Lecinski 2012 Motiverende Design - Speciale i Informationsvidenska b Design Thinking for Educators Jens Hofman Hansen 2005 IDEO Hentet fra: reducators.com/toolki t/ 61

62 Websites Website BEBRIT15.px&gr_type=1&PLanguage=0 timediedesigner/praktikvirksomheder orenede+stater&ymcheckin=2013%7c12&dayinmonthcheckin=10&ymcheckout=2013%7c 12&dayInMonthCheckOut=11&roomInfoList%5B0%5D.numberOfAdults=1&roomInfoList%5B0 %5D.numberOfChildren=0&numberOfRooms=1&destinationId= &hotelId=&lids= d-web-site-design 62

63

64 Bilag 1, Projektplan

65 Bilag 1, Projektplan

66 Bilag 1, Projektplan

67 Bilag 2, Interview med målgruppen Administrationsøkonomer - Jeg har ikke kigget på siden særligt meget. Ikke så relevant med praktik for dem. Administrations Økonomer undervises ikke på engelsk og det er derfor ikke så relevant mener de. De lærer primært om hvordan ting fungerer herhjemme. - Vi har fået at vide at det var en mulighed men føler ikke at det er så oplagt for os. - hvad kunne have motiveret jer? : - Hvis man kender en virksomhed er det måske relevant. Vi er ikke rigtig blevet præsenteret grundigt for muligheden. Vi skal selv finde vores praktikplads. - det skulle måske også stå som underpunkt forbundet med og UNDER praktik i menuen. - Hvad er så lige det der iets-point? - deadline for det (udlandspraktiksøgning) er svært i forhold til studiet. - Man ved ikke hvor man selv ligger i forhold til kravene måske en ide med noget à la tag en test og se hvor man ligger! (De synes det vil være godt at der er nem tilgang til at teste sig i forhold til kravene allerede når begrebet nævnes) (Om tekst-indholdet på siden): - lidt uoverskueligt kunne godt stilles bedre op - Det ville være en god ide med en video - Vi anede overhovedet ikke at skolen havde partnere.. - hvis nu der var noget der hed praktik? Praktik i udlandet ville det være meget nemmere (at finde i menuen) - Jeg ville først tænke over hvad kan jeg bedst lide (af fag/at lave) + hvad er mine sprogkundskaber i forhold til stedet jeg vil hen. Hvilke sprog kommunikerer virksomhederne på? Kan de fx engelsk eller er det måske endda dansk virksomhed. - Jeg vil helt klart gerne have nogle direkte links og informationer til de konkrete virksomheder hvad beskæftiger de sig mest med og hvilken type studerende søger de. - Det ville være rigtig smart at hjemmesiden fulgte med fx handelsskolen med hensyn til sådan en jobportal med jobopslag (for udlandsopholds-partner-virksomheder)

68 Bilag 2, Interview med målgruppen - Der kunne godt bruges noget bedre kommunikation mellem de studerende, skolen og virksomheder der tager praktikanter ind i udlandet - Jeg ville meget gerne vide noget om kulturelle/sociale regler det sted (land) jeg skulle overveje at søge. - En video på siden måtte gerne være a la visuelt: billeder. Små forskellige interviews med folk der har været forskellige steder. - Jeg ville starte med at søge info på Google. Måske starte med at henvende mig til studievejlederen. Jeg havde slet ikke overvejet skolens side. Bruger den sådan set (næsten) ikke. Rasmus Rasmus kender ikke Kom ud i verden sektionen da skolen introducerede ham til ansøgning af praktikplads. Først da han selv kontaktede en vejleder fik han kendskab til siden. Han har brugt siden til at få en generel viden om hvad der er vigtigt når man skal søge praktik i udlandet. Derefter har han fundet mere viden igennem Google. Han mener sektionens indhold egentlig er brugbart nok, men kunne optimeres ved at gøre det mere spiseligt, evt. ved hjælp af nogle billeder eller videoer. Han ville godt have haft mere info om hvordan man får det rigtige visum. Info om bolig søgning ville også have hjulpet meget, da det kan være et stort puslespil der skal gå op. Han vidste ikke EASJ har partnere i udlandet og men han foreslog at man kunne se deres virksomhedsprofil, så man ville kunne se hvad virksomheden forventer af praktikanten og omvendt.

69 Bilag 3, Persona 1 Ann Jensen 20 år Studerer Administrationsøkonom på Erhvervsakademi Sjælland campus Køge. Private forhold Ann har en kæreste gennem 6 måneder og bor endnu hjemme hos sine forældre i Køge, da hun ikke føler sig klar til at flytte hjemmefra endnu. Hun får hjemmeboende SU og har et deltidsarbejde i Kvickly. Hendes forældre er stadig sammen gennem mange år og hun har en ældre bror og en yngre søster. Hendes økonomi fungerer, men er ikke stærk. I weekenden mødes hun med veninder og går ofte i byen, og ellers er hun der hjemme med sin kæreste og familie. Hun er et familiemenneske, men sætter også stor pris på gamle venskaber, og det er derfor vigtigt for hende, at holde dem ved lige. I ferieperioder camper hun tit med sin familie i Vesteuropa, og hun synes det er sjovt at lave ting med familien som f.eks. at spille minigolf. Hverdag Ann tager til Campus Køge med offentlig transport i ca. 1 time hver morgen. Oftest har hun fri kl 14:15 og finder derfor også tid til at mødes med en veninde eller et par veninder på cafe - gerne mindst en gang om ugen for at holde sig opdaterede om hinandens liv og evt. med lidt shopping bagefter.to dage om ugen arbejder hun efter skole fra kl. 15:00-20:00. Hun bruger derudover noget tid hver dag på at læse lektier. Mediebrug Ann har en iphone som hun bruger meget hver dag. Den benyttes især til at holde kontakt med venner igennem sms er og facebook-app; men også til kalender, billeder og lidt let web-surf. Desuden har hun en Sony Vaio bærbar som hun benytter meget i sin undervisning og til at surfe på internettet og benytte Facebook i sin fritid. Praktik situation

70 Bilag 3, Persona 1 Da Ann var på studietur i Skotland besøgte hun en advokatvirksomhed, der var meget åben for at tage praktikanter ind. Dette syntes hun, kunne være spændende, men da hun har en kæreste og er et hjemmemenneske, ved hun ikke, om det er noget hun vil kaste sig ud i. Derudover synes hun, det virker uoverskueligt med alt det, man skal huske at ordne, inden man tager afsted; boligsituation, økonomi, transport osv.

71 Bilag 4, Persona 2 Michael Jokumsen 23 år Studerer bygningskonstruktør på Erhvervsakademi Sjælland campus Næstved. Private forhold Michael er single og bor i en lejlighed i Næstved. Han får udeboende SU og har et deltidsarbejde i T-Hansen. Han er enebarn og forældrene er også bosat i Næstved. I weekenden mødes han med vennerne, hvor de nogen gange tager i byen, og andre gange tager ud og oplever forskellige ting, f.eks. har de sprunget bungee jump osv. Han har været på mange ferier i udlandet, dels med sine forældre da han var yngre og dels med kammerater efter han er blevet ældre. Han elsker at komme ud og se forskellige ting, når de er på ferie, og at snakke med lokalbefolkningen. Hverdag Michael tager til Campus Næstved i bil hver morgen. Oftest har han fri kl 14:15. Fire dage om ugen arbejder han efter skole fra kl. 15:00-18:00. Han bruger derudover noget tid hver dag på at læse lektier. Han spiller også fodbold en gang om ugen. Mediebrug Michael har en iphone som han bruger dagligt. Den benyttes mest til at holde kontakt med venner igennem sms er og facebook-app, men også til lidt web-surf. Han har desuden en Macbook og en Ipad, da han godt kan lide apples produkter. Han har også en mindre bærbar pc, da de fleste af de programmer han benytter i undervisningen kræver pc. Praktik situation Michael har hørt om mulighed for praktik i udlandet, og vil meget gerne til USA i sin praktikperiode. Han synes dog, at det er lidt svært at få styr på alle de praktiske ting såsom at skaffe visum, finde bolig og transport. Derudover ved han ikke ret meget om, hvilke forventninger praktikpladserne i USA har til ham.

72 Bilag 5, Brugerscenarie Ann Jensen sidder ved sin bærbare computer og ønsker at finde information om praktikophold i udlandet. Hendes holdning til praktik i udlandet er lidt ambivalent. På den ene side kunne det være en spændende oplevelse, men på den anden side har hun ikke lyst til at undvære sin kæreste og familie i så lang tid, hvilket hun aldrig har prøvet før. Hun er især interesseret i, hvor hun kan komme hen og om det er rentabelt. Det er vigtigt, da hun gerne vil have mulighed for at få besøg eller tage hjem på besøg en weekend eller to. Hun har fået viden om easj.dk fra skolen, så hun går ind på siden og finder sektionen Udlandsophold under hovedmenuen. Ann s forventninger til siden er, at hun kan finde den information, hun har brug for i forbindelse med praktik i udlandet. Hun ønsker at få overskuelighed over sine muligheder med praktik, som hvor hun kan tage hen, hos hvilke virksomheder eller institutioner hun kan arbejde hos, og hvilke økonomiske muligheder hun har. Hun håber også at kunne finde fyldestgørende information om de udfordringer, hun bliver stillet af at skulle i praktik i udlandet. Da hun er tilfreds med sin undersøgelse af emnet, har hun behov for noget betænkningstid, inden hun kan tage en beslutning. Hun forventer, at det er nemt at benytte siden til at guide sig selv igennem ansøgningsprocessen, såfremt hun beslutter at tage imod tilbuddet.

73 Bilag 6, Sitemap

74 Bilag 7,Skitser: Brødkrummesti

75 Bilag 7,Skitser: Brødkrummesti

76 Bilag 8, Skitser: Alternativ datavisualisering

77 Bilag 9, Skitser: Forside a b c d

78 Bilag 10, Skitser: Partnerside

79 Bilag 11, Wireframe

80 Bilag 12, Pros and Cons

81 Bilag 12, Pros and Cons

82 Bilag 13, AIDA overordnet Attention: Den studerendes opmærksomhed skal fanges ude på uddannelsesinstitutionen. Dette gøres f.eks. ved, at der bliver holdt et foredrag af studievejlederen, via banners eller flyers. Interest: Interessen skabes, når den studerende går ind og læser mere om udlandsophold på easj.dk. Her findes også en guide til, hvordan man ansøger, og hvilke ting man skal tage hensyn til, så processen ikke virker uoverskuelig. Desire: De testimonials der findes på siden, giver den studerende et ønske om at komme i udlandspraktik; Videoerne viser, hvilke muligheder der er, og hvor gode oplevelser de respektive personer har haft. Action: Den ønskede handling er, at den studerende nu har fået mod på at sende en ansøgning til et studie- eller praktiksted, da guiden også hjælper en på vej med dette.

83 Bilag 14, Nyt sitemap

84 Bilag 15, Mockup: Partnersiden

85 Bilag 15, Mockup: Partnersiden

www.carolinegudme.dk/easj www.carolinegudme.dk/easj/admin http://www.youtube.com/watch?v=9aaoilhz6jq

www.carolinegudme.dk/easj www.carolinegudme.dk/easj/admin http://www.youtube.com/watch?v=9aaoilhz6jq Indholdsfortegnelse Indledning - Ditte, Signe Problemformulering Metode og valg Hvilken udviklingsmetode har vi valgt og hvorfor? - Simone Design Thinking - Ditte Work Breakdown Structure - Ditte Projektstyringsværktøj

Læs mere

FRISØR VEST. Link til hjemmesiden: Frisorvest.github.io. Lavet af: Aleksander, Benjamin, Line & Cathrine

FRISØR VEST. Link til hjemmesiden: Frisorvest.github.io. Lavet af: Aleksander, Benjamin, Line & Cathrine FRISØR VEST Link til hjemmesiden: Frisorvest.github.io Lavet af: Aleksander, Benjamin, Line & Cathrine Case 3: Aleksander, Benjamin, Line & Cathrine. Beskrivelse af gruppens tidsplan Trello: Vi har benyttet

Læs mere

Portfolioudvikling. Line la Fontaine. Multimediedesigner

Portfolioudvikling. Line la Fontaine. Multimediedesigner Portfolioudvikling Line la Fontaine Multimediedesigner Indholdsfortegnelse - Designvalg s. 1-9 - Målgruppe s. 1 - Wireframes/skitser s. 1-5 - Informationsarkitektur s. 6-7 - Farver s. 8 - Typografi s.

Læs mere

I det kommende afsnit vil vi løbende komme ind på de enkelte resultater og samtidig komme med bud på, hvordan disse kunne løses i fremtiden.

I det kommende afsnit vil vi løbende komme ind på de enkelte resultater og samtidig komme med bud på, hvordan disse kunne løses i fremtiden. Opsummeret Feedback Introduktion I dette dokument vil vi opsummere de mest relevante resultater, der kom fra begge de afholdte workshops. De mest relevante resultater var dem, der igennem begge workshops

Læs mere

Grafisk workflow. bl.udbudsnet.dk

Grafisk workflow. bl.udbudsnet.dk Grafisk workflow. bl.udbudsnet.dk Hvad går opgaven ud på? Opgaven gik ud på at lavet et præsentations website for Udbudsnet. Hjemmesiden skulle bruges til at sælge Udbudsnet, på en messe som hedder BL.

Læs mere

Portfolio. Udvikling af min portfolio Link til portfolio: Michell Aagaard Dranig

Portfolio. Udvikling af min portfolio Link til portfolio:   Michell Aagaard Dranig Portfolio Udvikling af min portfolio Link til portfolio: http://dranigdesign.com/ CPH-MD267@CPHBUSINESS.DK ind på en af undersiderne, kom home finde ud af, hvad mit eksamensprojekt Udvikling af min portfolio

Læs mere

Et krav til portfolien var at det skulle udvikles fra bunden uden brug af CSS-frameworks, samt HTML og CSS skulle valideres uden fejl.

Et krav til portfolien var at det skulle udvikles fra bunden uden brug af CSS-frameworks, samt HTML og CSS skulle valideres uden fejl. Indledning Mit sidste projekt her på 1.semester gik ud på at jeg skulle lave et redesign af mit første portfolio, som jeg lavede i starten af semesteret. Formålet var at vise hvad jeg havde lært siden

Læs mere

Afsluttende Projekt - Kom/IT

Afsluttende Projekt - Kom/IT 1 Afsluttende Projekt - Kom/IT Rasmus H. Plaep 1 Billedkilde: http://blog.snelling.com/files/2015/01/business-107.jpg Indhold... 0 Indledning... 2 Problemafgrænsning... 2 Problemformulering... 2 Teori...

Læs mere

Projekt: Kend dine brugere. Tr09mul02 Andreas Münter Jesper Hansen Tommy Pedersen Robin Hansen

Projekt: Kend dine brugere. Tr09mul02 Andreas Münter Jesper Hansen Tommy Pedersen Robin Hansen Projekt: Kend dine brugere Tr09mul02 Andreas Münter Jesper Hansen Tommy Pedersen Robin Hansen Indholdsfortegnelse Introduktion: 3 Marketing: 3 Usability test: 4 Mockup design 6 Opsumering 7 Konklusion

Læs mere

MÅLGRUPPE Alle typer af boligselskaber, ejer- og andelsforeninger samt div. institutioner (store som små) på Sjælland. Ikke private kunder.

MÅLGRUPPE Alle typer af boligselskaber, ejer- og andelsforeninger samt div. institutioner (store som små) på Sjælland. Ikke private kunder. GRAFISK DESIGN KUNDEN PA Vaskeriteknik er en enkeltmandsvirksomhed som startede i 2008. Manden bag er Preben, som gennem 14 års brancheerfaring startede sit eget firma op da han føler at han med sit partnerskab

Læs mere

KOM UD I VERDEN PRODUKTER: Rapport. http://philipsparso.dk/3semeksamen/ TAP - Theis Frimann Sparrewath, Anders Jacobsen & Philip Sparsø

KOM UD I VERDEN PRODUKTER: Rapport. http://philipsparso.dk/3semeksamen/ TAP - Theis Frimann Sparrewath, Anders Jacobsen & Philip Sparsø KOM UD I VERDEN Rapport TAP - Theis Frimann Sparrewath, Anders Jacobsen & Philip Sparsø PRODUKTER: http://philipsparso.dk/3semeksamen/ 3. Semester Eksamen Indholdsfortegnelse Definition af opgave - Theis...

Læs mere

Delaflevering: Webdesign og webkommunikation. Organisation: Københavns Erhvervsakademi. Af Silke Brewster Rosendahl (hold 1) og Marie Anne Svendsen

Delaflevering: Webdesign og webkommunikation. Organisation: Københavns Erhvervsakademi. Af Silke Brewster Rosendahl (hold 1) og Marie Anne Svendsen Delaflevering: Webdesign og webkommunikation Af Silke Brewster Rosendahl (hold 1) og Marie Anne Svendsen Vi har valgt at lave et redesign af KEA s online videnscenter/bibliotek. Organisation: Københavns

Læs mere

sweetbot.design Kodning og design af hjemmeside Navne: Emma Blæsbjerg, Michell Aagaard Dranig og Andreas Oliver Hansen

sweetbot.design Kodning og design af hjemmeside Navne: Emma Blæsbjerg, Michell Aagaard Dranig og Andreas Oliver Hansen sweetbot.design Kodning og design af hjemmeside Navne: Emma Blæsbjerg, Michell Aagaard Dranig og Andreas Oliver Hansen Gruppe: MUL A 10 Email: Michell cph-md267@cphbusiness.dk, Emma cph-eb121@cphbusiness.dk,

Læs mere

HESTBJERG WEB GRAFISK WORKFLOW

HESTBJERG WEB GRAFISK WORKFLOW HESTBJERG WEB GRAFISK WORKFLOW OPGAVE BESKRIVELSE Dette er en hjemmeside jeg har udviklet til Hestbjerg Økologi. Siden skal bruges til at sprede deres budskab. Opgaven Hestbjerg økologi søgte en hjemmeside

Læs mere

AFSLUTTENDE PROJEKT KOM/IT

AFSLUTTENDE PROJEKT KOM/IT 5/5-2017 AFSLUTTENDE PROJEKT KOM/IT Daniel & Frederik Klasse 1.1 Indledning Vi startede med at få valget stillet om vi ville lave noget med e-learning, databehandling og præsentation eller vi kunne lave

Læs mere

Digital Kommuneplan. Kravsspecifikation gennem brugerinvolvering

Digital Kommuneplan. Kravsspecifikation gennem brugerinvolvering Digital Kommuneplan Kravsspecifikation gennem brugerinvolvering Indhold Introduktion Afklaring af behov: Hvad skal digitale kommuneplaner kunne? Udarbejdelse og test af løsning: Hvordan skal digitale kommuneplaner

Læs mere

kollegiekokkenet.tmpdesign.dk Side 1

kollegiekokkenet.tmpdesign.dk Side 1 kollegiekokkenet.tmpdesign.dk Side 1 Indholdsfortegnelse Forord 3 Problemformulering 4 Udviklingsmetode 5 Tidsplan 6 Målgruppe 7 Design brief 8 Logo 10 Typografi og farve 11 Navigationsdiagram 12 Usecase

Læs mere

Gruppe 15. Redesign af bageriet FeelGood Bakery s website. Gruppen Består af: Nanna Søderquist Christian Thorsø Rolf Josephsen Søren Henrik Wilhardt

Gruppe 15. Redesign af bageriet FeelGood Bakery s website. Gruppen Består af: Nanna Søderquist Christian Thorsø Rolf Josephsen Søren Henrik Wilhardt Gruppe 15 Redesign af bageriet FeelGood Bakery s website Gruppen Består af: Nanna Søderquist Christian Thorsø Rolf Josephsen Søren Henrik Wilhardt Link til redesignet website: www.feelgoodbakery.thorsoe.dk

Læs mere

Jonas Krogslund Jensen info@j-krogslund.dk +45 2635 6096. Iben Michalik ibenmic@hotmail.com +45 2877 0664

Jonas Krogslund Jensen info@j-krogslund.dk +45 2635 6096. Iben Michalik ibenmic@hotmail.com +45 2877 0664 SENIOR LAND Jonas Krogslund Jensen info@j-krogslund.dk +45 2635 6096 Iben Michalik ibenmic@hotmail.com +45 2877 0664 Michael Himmelstrup eycoco@gmail.com +45 2720 7222 Peter Stillinge Dong peterstillinge.dong@gmail.com

Læs mere

Bilag 2. Noter. Alternativ: Skriv pakkelabel i søgefeltet Klik på linket ved teksten øverst: pakke labels

Bilag 2. Noter. Alternativ: Skriv pakkelabel i søgefeltet Klik på linket ved teksten øverst: pakke labels Bilag 1 Bilag 2 Projekt 1 - usability test og marketing Gruppe: Senia, Agnete, Andreas, Ninette Website: postdanmark.dk Undersøgelsesområde: navigation og funktionalitet Tests: Brugertest (funktionalitet)

Læs mere

Selv om websites er yderst forskellige i deres fremtræden, så kan de stort set alle sammen passes ind i den skabelon som er illustreret herunder:

Selv om websites er yderst forskellige i deres fremtræden, så kan de stort set alle sammen passes ind i den skabelon som er illustreret herunder: Design en praktisk guide. Et design udtrykker dit websites grafiske udseende, lige fra hvilke skrifttyper der anvendes op til hvor navigationen er placeret og hvilke interaktive elementer der skal benyttes.

Læs mere

Kend dine brugere. Om brugertest. 2 sem., feb. 2010 Multimediedesigner, København nord

Kend dine brugere. Om brugertest. 2 sem., feb. 2010 Multimediedesigner, København nord Kend dine brugere Om brugertest 2 sem., feb. 2010 Multimediedesigner, København nord Andreas Frandsen, Ninette Nielsen Agnete Gnistrup, Senia Lundberg Side 1 af 7 Indholdsfortegnelse Indledning s. 2 Valg

Læs mere

Udover denne simple tidsplan har jeg også lavet et GANTT-kort for at vise den reelle tid jeg har brugt på hver opgave.

Udover denne simple tidsplan har jeg også lavet et GANTT-kort for at vise den reelle tid jeg har brugt på hver opgave. Portfolioudvikling Planlægning Da jeg startede på projektet lavede jeg en tidsplan, til at starte med gav jeg de forskellige opgaver lidt ekstra tid eftersom jeg synes man altid formår at bruge lidt mere

Læs mere

Portfolio redesign. Kia Dahlen! cph-kd51@cphbusiness.dk! 1. semester eksamen! MUL-A 2013! !!! www.mul17.itkn.dk/portfolio/index.html!

Portfolio redesign. Kia Dahlen! cph-kd51@cphbusiness.dk! 1. semester eksamen! MUL-A 2013! !!! www.mul17.itkn.dk/portfolio/index.html! Portfolio redesign Kia Dahlen cph-kd51@cphbusiness.dk 1. semester eksamen MUL-A 2013 www.mul17.itkn.dk/portfolio/index.html Underviserer: Ditlev Skanderby Frederik Tang Ian Wisler-Poulsen Jesper Hinchely

Læs mere

Projekt om Københavns Musikteater

Projekt om Københavns Musikteater Projekt om Københavns Musikteater Spørgsmål og områder til første vejledning Vi har tænkt os at lave et redesign af Københavns Musikteaters hjemmeside med følgende undersider: o Forside o Forestillinger

Læs mere

Introducering af Flip MinoHD: http://celikshadow.dk/flip/

Introducering af Flip MinoHD: http://celikshadow.dk/flip/ Introducering af Flip MinoHD: http://celikshadow.dk/flip/ Ahmad Hahmoud Besir Redzepi Jeffrey Lai 04/05-2009 2.semester 3. projekt Indholdsfortegnelse: 1.0 Forord 3 2.0 Kommunikationsplan 4 3.0 Navigationsdiagram

Læs mere

TESTPLAN: SENIORLANDS WEBSHOP

TESTPLAN: SENIORLANDS WEBSHOP TESTPLAN: SENIORLANDS WEBSHOP Indledning Vi vil i vores brugervenlighedsundersøgelse teste Seniorlands webshop 1. Vi vil teste hvor at webshoppen fungerer set ud fra en bruger af Internet. Vi vil blandt

Læs mere

Cindie Mortensen, Merete Koudahl, Pernille Tramp Webdesign, gruppeprojekt exercise 7. Menu A/S

Cindie Mortensen, Merete Koudahl, Pernille Tramp Webdesign, gruppeprojekt exercise 7. Menu A/S Menu A/S Problemfelt MENU A/S (MENU) er en dansk design virksomhed og producent. MENU har specialiseret sig indenfor skandinavisk design samt deres evige stræben efter at lave noget originalt. De repræsenterer

Læs mere

grafisk design Se webappen på din mobil

grafisk design Se webappen på din mobil ideudvikling Jeg har valgt at bruge kulturbegivenheden Aarhus Festuge, som udgangspunktet i min svendeprøve. Jeg vil redesigne deres marketingsmateriale såsom logo, magasin, plakater m.m. Derudover vil

Læs mere

Forside 1: Bagside og bogryg:

Forside 1: Bagside og bogryg: Bagside og bogryg: Bagsiden og bogryggen er lavet i de samme farver som forsiden for at opnå et gennemgående og sammendhængende look. Stregen som skal forestille jernbanen er også fortsat på både bogryggen

Læs mere

Yosef Saleh, Ilyas Tulumcu Oguzhan Polat, Mohammad Kaddoura Kom/IT C Kl. 1.2

Yosef Saleh, Ilyas Tulumcu Oguzhan Polat, Mohammad Kaddoura Kom/IT C Kl. 1.2 1/ Indholdsfortegnelse Indledning... 3 Dokumentation... 4 Hjemmeside og logo design... 14 Valg af skrifttype... 15 AIDA... 16 Arbejdsroller og opgaver... 17 Logbog for vores proces (Ugevis)... 19 Konklusion...

Læs mere

Grafisk Design 70% Skitser

Grafisk Design 70% Skitser Grafisk design Grafisk 2 PRODUKT Som et led i den online markedsføring af BBQ Wing it, har jeg valgt at lave et website, med fokus på information. Det er et website, der er baseret ud fra lærte funktioner

Læs mere

Medvind en vejrapp for cyklister

Medvind en vejrapp for cyklister Medvind en vejrapp for cyklister Jeg har valgt at lave en vejrapp, der primært er til cyklister, som gerne vil vide om de får modvind eller medvind på deres tur. Den mere præcise målgruppe er tiltænkt

Læs mere

Stine Dorry Meulengracht Madsen Rapport Multimedie og kommunikation

Stine Dorry Meulengracht Madsen Rapport Multimedie og kommunikation Portfolioudvikling I denne rapport vil du kunne læse om mit porfolios tilblivelse. Det skal give læseren indblik i mine designvalg og hele processen bag projektet. Hjemmesiden er kodet fra bunden i HTML

Læs mere

15-11-2013 TANDLÆGE KAMPAGNE. Marc Sztuk, Simon Drabsch og Marcus Rasmussen

15-11-2013 TANDLÆGE KAMPAGNE. Marc Sztuk, Simon Drabsch og Marcus Rasmussen 15-11-2013 TANDLÆGE KAMPAGNE Marc Sztuk, Simon Drabsch og Marcus Rasmussen Forord Vi har tilmeldt os konkurrencen fra Tandlægeforeningen, om at lave en kampagne for at få flere unge til at tage til tandlæge.

Læs mere

Delaflevering FUA.4 Betina Korsbro, Mi Louise Hansen, Jesper Led Lauridsen og Knud Back

Delaflevering FUA.4 Betina Korsbro, Mi Louise Hansen, Jesper Led Lauridsen og Knud Back Delaflevering FUA.4 Betina Korsbro, Mi Louise Hansen, Jesper Led Lauridsen og Knud Back 1 Indhold 1.1 Generelt i forhold til projektet 1.1.1 Problemformulering Kalundborg kommune har gennem de senere år

Læs mere

FACEBOOK MARKETING. Simple teknikker der kan booste virksomhedens salg og omsætning via Facebook.

FACEBOOK MARKETING. Simple teknikker der kan booste virksomhedens salg og omsætning via Facebook. FACEBOOK MARKETING Simple teknikker der kan booste virksomhedens salg og omsætning via Facebook. Hvorfor skal jeg bruge Facebook Marketing? Mange virksomheder spørger sig selv dette spørgsmål. Men de skal

Læs mere

Oliver Marco van Komen Afsluttende opgave 02-05-2014. Kost ved slidgigt. Case 2. Personlig fysisk hjælp

Oliver Marco van Komen Afsluttende opgave 02-05-2014. Kost ved slidgigt. Case 2. Personlig fysisk hjælp Kost ved slidgigt Case 2. Personlig fysisk hjælp Problemobservering Sygdommen slidgigt også kaldes artrose er den mest udbredte led sygdom overhovedet, det kan medføre voldsomme smerter. Sygdommen påvirker

Læs mere

ELEMENTER Jeg vælger fonten Raleway, som er en af Googles mange gratis webfonte. Det er en grotesk skrift, som især bruges til websites, da de på

ELEMENTER Jeg vælger fonten Raleway, som er en af Googles mange gratis webfonte. Det er en grotesk skrift, som især bruges til websites, da de på Grafisk design Design af hjemmeside til indretningsarkitekt med firma navn enrico indret, som jeg tidligere har designet logo for. Firmaet laver udelukkende erhvervsindretning og målgruppen for sitet er

Læs mere

GRAFISK WORKFLOW. Hjemmeside design til Chem-Tec Plating

GRAFISK WORKFLOW. Hjemmeside design til Chem-Tec Plating GRAFISK WORKFLOW Hjemmeside design til Chem-Tec Plating REDEGØRELSE Hvad går opgaven ud på Virksomheden Chem-Tec Plating, som specialisere sig i metallisk overfladebehandling, havde været igennem et generationsskiftet

Læs mere

IsenTekst Indhold til Internettet. Manual til Wordpress.

IsenTekst Indhold til Internettet. Manual til Wordpress. Manual til Wordpress Sådan opdaterer du din hjemmeside i Wordpress. Dette er en manual til de mest grundlæggende ting, så du selv kan redigere indholdet eller tilføje nyt på din hjemmeside. Guiden er skrevet

Læs mere

Redesign af Cinnober. Analyse af hjemmesiden Cinnober

Redesign af Cinnober. Analyse af hjemmesiden Cinnober Redesign af Cinnober Gruppe 25 Vi har i denne uge arbejdet på at redesigne hjemmesiden til butikken Cinnober, som ligger på Strøget i København. Cinnober sælger bøger og andre kontorartikler. Deres hjemmeside

Læs mere

Metoder og produktion af data

Metoder og produktion af data Metoder og produktion af data Kvalitative metoder Kvantitative metoder Ikke-empiriske metoder Data er fortolkninger og erfaringer indblik i behov og holdninger Feltundersøgelser Fokusgrupper Det kontrollerede

Læs mere

GRAFISK DESIGN. Kenneth Friis Petersen

GRAFISK DESIGN. Kenneth Friis Petersen GRAFISK DESIGN Kenneth Friis Petersen Kenneth Friis Petersen - Svendeprøve 2015 Opgavebeskrivelse Total redesign af hjemmeside til Trademark Textiles A/S, både layout og kodning af side. Trademark textiles

Læs mere

Grafisk produktion & workflow

Grafisk produktion & workflow Grafisk produktion & workflow WORKFLOW & PRODUKTION WEBSITE NATURSPEJDERNE Dokumentation I 2 OPGAVEN Opgaven Jeg har lavet dette fiktive website der kunne være en mulighed for en nyopstartet spejderforening.

Læs mere

HHBR. Design. Kvalitets vurdering. Opgaven. Målgruppe og Budskab. De Grafiske valg

HHBR. Design. Kvalitets vurdering. Opgaven. Målgruppe og Budskab. De Grafiske valg Opgaven Der skal designes en hjemmeside til en pensioneret revisor, som ønsker at starte en fritids beskæftigelse op, som privat revisor. Han Ønsker en hjemmeside der skal kort fortælle om hans forretning.

Læs mere

Disse har alle sammen hjulpet til at skabe min hjemmeside. Ved at give inspiration og få ideerne ned på papir, før de blev vist til omverdenen.

Disse har alle sammen hjulpet til at skabe min hjemmeside. Ved at give inspiration og få ideerne ned på papir, før de blev vist til omverdenen. Introduktion til webdesign Jeg har igennem webdesign projektet arbejdet med en masse forskellige processer, i alt 6 processer. Disse er skab moodboard fra en side, informationsdesign, navigationsdesign,

Læs mere

INNOVATION. BLOGS. KU. DK

INNOVATION. BLOGS. KU. DK $ SPØRGEGUIDE TIL BRUGERTEST INNOVATION. BLOGS. KU. DK Katapult og Katalyst interviewer ca. 8 brugere af innovation.blogs.ku.dk for at samle viden om deres adfærd og behov i relationen til udvikling og

Læs mere

Website projekt 3, 2. semester. Responsive design. Lasse M. Bruun Overgaard www.lbodesign.dk. Mark Halding www.markhalding.dk

Website projekt 3, 2. semester. Responsive design. Lasse M. Bruun Overgaard www.lbodesign.dk. Mark Halding www.markhalding.dk Website projekt 3, 2. semester. Lasse M. Bruun Overgaard www.lbodesign.dk Mark Halding www.markhalding.dk Peter Konrad http://cph54.webkn.dk/ Anders Rein www.andersrein.dk Responsive design Projekt: www.andersrein.dk/projekter/hjemmesider/responsiv

Læs mere

Førsteårsprøven 2015. Projektbeskrivelse 2. Semester Multimediedesigner

Førsteårsprøven 2015. Projektbeskrivelse 2. Semester Multimediedesigner Førsteårsprøven 2015 Projektbeskrivelse 2. Semester Multimediedesigner Projektbeskrivelse Formål Som afslutning på første studieår skal I gennemføre et tværfagligt projektforløb, der skal afspejle væsentlige

Læs mere

Manual til WordPress CMS

Manual til WordPress CMS Manual til WordPress CMS 1. Log ind på din Wordpress-side For at arbejde på din hjemmeside skal du først logge ind på administrationsdelen. Muligvis har du et direkte link på siden. Ellers er adressen

Læs mere

IT opgave. Informationsteknologi B. Vejleder: Karl. Navn: Devran Kücükyildiz. Klasse: 2,4

IT opgave. Informationsteknologi B. Vejleder: Karl. Navn: Devran Kücükyildiz. Klasse: 2,4 IT opgave Informationsteknologi B Vejleder: Karl Navn: Devran Kücükyildiz Klasse: 2,4 Dato:03-03-2009 1 Indholdsfortegnelse 1. Indledning... 3 2. Planlægning... 3 Kommunikationsplanlægning... 3 Problemstillingen...

Læs mere

Afsluttende opgave - Kommunikation/IT C Klasse 1.1

Afsluttende opgave - Kommunikation/IT C Klasse 1.1 11-05-2015 Affaldshåndtering Afsluttende opgave - Kommunikation/IT C Klasse 1.1 Hans Rasmussen & Kevin Kumar ROSKILDE TEKNISKE GYMNASIUM Indhold Affaldshåndtering i Grønsted kommune... 2 Krav... 2 Design...

Læs mere

Gruppe 9 Visuel Interface Design, 27/09/2011

Gruppe 9 Visuel Interface Design, 27/09/2011 Gruppe 9 Visuel Interface Design, 27/09/2011 Først øvelse. Lav en designanalyse i tekst og billeder af det udleverede website www.kariyer.net. Vi startede med en hjemmeside, der så ud som følgende: Gennemgående

Læs mere

Responsive design Der er ingen breaking points på hjemmesiden. Det er et astatic website, da det ikke er responsivt.

Responsive design Der er ingen breaking points på hjemmesiden. Det er et astatic website, da det ikke er responsivt. Gruppe 11 Asta, Björk, Marie-Louise, Sofie. http://arice.dk/scherninghtml/forside1.html Husk at trykke på den første ørering inde under smykker. Brug venligst inspectoren når i tjekker tablet og mobil

Læs mere

Programmering C Eksamensprojekt. Lavet af Suayb Köse & Nikolaj Egholk Jakobsen

Programmering C Eksamensprojekt. Lavet af Suayb Köse & Nikolaj Egholk Jakobsen Programmering C Eksamensprojekt Lavet af Suayb Köse & Nikolaj Egholk Jakobsen Indledning Analyse Læring er en svær størrelse. Der er hele tiden fokus fra politikerne på, hvordan de danske skoleelever kan

Læs mere

Cykelhandler projekt KOM / IT

Cykelhandler projekt KOM / IT 2015 Cykelhandler projekt KOM / IT Indhold Indledning... 2 Tidsplan... 2 Fase 1 - Problemanalyse... 3 Informations problem... 3 Markedsundersøgelse... 3 Analyse af deres eksisterende medieprodukter...

Læs mere

IA WORKSHOP #1 NAVIGATION #2 IA STRUKTUR #3 WIREFRAME

IA WORKSHOP #1 NAVIGATION #2 IA STRUKTUR #3 WIREFRAME IA WORKSHOP #1 NAVIGATION #2 IA STRUKTUR #3 WIREFRAME # 1 NAVIGATION DESIGN BRUGERENS VEJ TIL INDHOLD NAVIGATION ER ALLE DESIGN ELEMENTER DER GUIDER BRUGEREN TIL INDHOLDET HVOR ER JEG LAD BRUGEREN VIDE

Læs mere

Projekt 1 Re-design af Odense Bunkermuseum

Projekt 1 Re-design af Odense Bunkermuseum Erhversakademiet Lillebælt OEAMM18FDA 1.semester d. 08.03.2018 Projekt 1 Re-design af Odense Bunkermuseum prototype: video i ZIP-fil Gruppe 5 medlemmer: Simon Tagge, Sofie Florczak, Mathias Bøgedal, Anne

Læs mere

srum Fritidsaktiviteter 04-12-2008: 1. Semester. Multimediedesigner Projektstart: 17/11-2008 Aflevering: 4/12-2008

srum Fritidsaktiviteter 04-12-2008: 1. Semester. Multimediedesigner Projektstart: 17/11-2008 Aflevering: 4/12-2008 Gruppe 9: Besir Redzepi, Jacob Pedersen, Garwun Jeffrey Lai og Sean Rørgren srum Fritidsaktiviteter 04-12-2008: 1. Semester. Multimediedesigner Projektstart: 17/11-2008 Aflevering: 4/12-2008 Indholdsfortegenelse

Læs mere

Kulløse Miljømesse. Nikolaj, Tobias og Jesper

Kulløse Miljømesse. Nikolaj, Tobias og Jesper Kulløse Miljømesse Nikolaj, Tobias og Jesper I denne rapport vil vi forklare hvordan vi lavede en reklame som handler Kulløse Miljømesse samt hvordan vi afprøvede den og fik resultater. Dette er et projekt

Læs mere

VELKOMMEN INNOVATIONSAGENTUDDANNELSEN 2014 DAG 2 WORKSHOP A

VELKOMMEN INNOVATIONSAGENTUDDANNELSEN 2014 DAG 2 WORKSHOP A VELKOMMEN INNOVATIONSAGENTUDDANNELSEN 2014 DAG 2 WORKSHOP A HVAD SKAL VI IGENNEM DAG 1 DAG 2 DAG 3 DAG 4 DAG 5 DAG 6 1. AFKLARE OG DEFINERE EN UDFORDRING 2. FORVENTNINGSAFSTEMME SUCCES OG MÅL 3. FORSTÅ

Læs mere

It-sikkerhed Kommunikation&IT

It-sikkerhed Kommunikation&IT It-sikkerhed Kommunikation&IT Dette projekt handler om IT-sikkerhed. Gruppen har derfor valgt at have om Facebook, hvor vi vil hjælpe folk med at færdes rigtigt på nettet. Dette vil gøre ved hjælp af at

Læs mere

Analyse af website: cinnobershop.dk

Analyse af website: cinnobershop.dk Analyse af website: cinnobershop.dk Gruppe 12: Brit, Caroline, Line & Søren v1_7/3-16 Indholdsfortegnelse ANALYSE Kommunikation 3 Wireframes - Home 4 - about 5 - webshop 6 - webshop/betaling 7 Grafiske

Læs mere

Portfolio Redesign Kamilla Klein 1. Semester eksamen

Portfolio Redesign Kamilla Klein 1. Semester eksamen 2014 Portfolio Redesign Kamilla Klein 1. Semester eksamen Lærene: Ditlev Skanderby Frederik Tang Ian Wisler- Poulsen Jesper Hinchely Merete Geidemann Lützen Morten Rold Thomas Hartmann Erhvervsakademiet

Læs mere

Indledning: Testen foregår på tid, da jeg ønsker at finde ud af, hvor lang tid brugeren er om at komme til disse mål.

Indledning: Testen foregår på tid, da jeg ønsker at finde ud af, hvor lang tid brugeren er om at komme til disse mål. Indledning: En brugertest er et godt redskab at bruge, når man skal teste brugervenligheden på en hjemmeside. Det er en af de mest anvendte usability testmetoder. Testen kan have to formål: at informere,

Læs mere

Case: http://www.julius-nielsen.dk/

Case: http://www.julius-nielsen.dk/ Case: http://www.julius-nielsen.dk/ Hjemmesidens formål og målgruppe Formålet med hjemmesiden må være at informere potentielle kunder om firmaet, da hjemmesiden indeholder informationer om firmaets historie,

Læs mere

GRAFISK DESIGN. Diner no. 34 Hjemmeside + Visuel identitet

GRAFISK DESIGN. Diner no. 34 Hjemmeside + Visuel identitet GRAFISK DESIGN Diner no. 34 Hjemmeside + Visuel identitet Diner no. 34 9 Opgavebeskrivelse Fiktive opgave. Redesign af visuel identitet og design af ny hjemmeside. Materialet skal skabe et genkendeligt

Læs mere

Dokumentation. Inspiration S34 S35. Opgavens art Fiktiv opgave af opbygning af en hjemmeside.

Dokumentation. Inspiration S34 S35. Opgavens art Fiktiv opgave af opbygning af en hjemmeside. Grafisk Design Dokumentation Inspiration Opgavens art Fiktiv opgave af opbygning af en hjemmeside. Kort om opgaven Hjemmesiden, skulle være oplysende om produkter og virksomheden, den skulle være enkel

Læs mere

JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN.

JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN. JEG GIVER SELLS.DK NYT LIV MED ET MODERNE RE-DESIGN. Grafisk design Grafisk design Opgaven Jeg har fået til opgave at re-designe Sells.dk. Sitet skal benytte elementer fra en kampagne, der tidligere er

Læs mere

Rapport på Kommunikation IT projekt

Rapport på Kommunikation IT projekt Rapport på Kommunikation IT projekt Dato: 06.05.2011 Skrevet af Martin Jensen Fag: Kommunikation IT Vejleder: Bartlomiej Rohard Warszawski Skole: Roskilde Tekniske Gymnasium Klasse 1.4 Studieretning: Matematik

Læs mere

GRAFISK WORKFLOW REDESIGN AF HJEMMESIDE

GRAFISK WORKFLOW REDESIGN AF HJEMMESIDE GRAFISK WORKFLOW REDESIGN AF HJEMMESIDE 2 REDESIGN AF FUTURECOM BUSINESS SOLUTIONS HJEMMESIDE OPGAVEN Den gamle hjemmeside skulles redesignes da den daværende hjemmeside var forældet (indhold og udseende)

Læs mere

Avisforside. Vi har skrevet en avis om studier ved Aarhus Universitet

Avisforside. Vi har skrevet en avis om studier ved Aarhus Universitet Avisforside Vi har skrevet en avis om studier ved Aarhus Universitet Vi vil meget gerne høre dine umiddelbare tanker om forsiden til avisen. Hvad forventer du dig af indholdet og giver den dig lyst til

Læs mere

grafisk workflow OPGAVE: EMBRACE-IT WEBSITE

grafisk workflow OPGAVE: EMBRACE-IT WEBSITE grafisk workflow OPGAVE: EMBRACE-IT WEBSITE BESKRIVELSE GRAFISK WORKFLOW BESKRIVELSE Den tidligere nævnte virksomhed Embrace-IT, forsøger i takt med at virksomhen vokser, at opdatere og optimere deres

Læs mere

Marc Vinther Mikkel Borg Svendsen Nanna Bak Eliassen Sebastian Frank. Tourist Campaign

Marc Vinther Mikkel Borg Svendsen Nanna Bak Eliassen Sebastian Frank. Tourist Campaign Marc Vinther Mikkel Borg Svendsen Nanna Bak Eliassen Sebastian Frank Tourist Campaign Indledning Vi er et visuelt markedføringsbureau som har fået til opgave, at lave en kampagne for et lokalt turistbureau

Læs mere

BRUGERTESTEN Introduktion

BRUGERTESTEN Introduktion BRUGERTESTEN Introduktion BAGGRUND Når man udfører en eller flere brugertests gøres det ud fra en idé om brugerinddragelse. Brugerinddragelse handler om at forstå brugernes behov, motivation og adfærd.

Læs mere

Manual til Wordpress. 1. Log ind på din Wordpress-side. Indhold:

Manual til Wordpress. 1. Log ind på din Wordpress-side. Indhold: Manual til Wordpress Sådan opdaterer du din hjemmeside i Wordpress: Dette er en manual til de mest grundlæggende ting, så du selv kan redigere indholdet eller tilføje nyt på din hjemmeside. Guiden er skrevet

Læs mere

1 // Grafisk design. Hjemmesiden før. Kunde. Produkt. Opgave. Målgruppe. Bogforlaget Frydenlund A/S. www.his2rie.dk

1 // Grafisk design. Hjemmesiden før. Kunde. Produkt. Opgave. Målgruppe. Bogforlaget Frydenlund A/S. www.his2rie.dk Kunde Bogforlaget Frydenlund A/S Produkt www.his2rie.dk Opgave Hjemmesiden før Redesign af hjemmesiden www.his2rie.dk, som ejes af forlaget. Min opgave lød på, at udforme et nyt design til hjemmesiden,

Læs mere

Guide til projektledere: Succesfuld konceptudvikling, kommunikationsstrategi og eksekvering af dit projekt på BetterNow

Guide til projektledere: Succesfuld konceptudvikling, kommunikationsstrategi og eksekvering af dit projekt på BetterNow Guide til projektledere: Succesfuld konceptudvikling, kommunikationsstrategi og eksekvering af dit projekt på BetterNow version 1.0 maj 2012 Indholdsfortegnelse 1. Indledning... 3 2. Definer budskabet

Læs mere

Delaflevering. Webdesign og webkommunikation, (hold 2), IT Universitetet, f2011. Kim Yde, kyd@itu.dk. Kenneth Hansen, kenhan@itu.

Delaflevering. Webdesign og webkommunikation, (hold 2), IT Universitetet, f2011. Kim Yde, kyd@itu.dk. Kenneth Hansen, kenhan@itu. Delaflevering Webdesign og webkommunikation, (hold 2), IT Universitetet, f2011. Kim Yde, kyd@itu.dk Kenneth Hansen, kenhan@itu.dk 1 Indholdsfortegnelse Problemfelt - Problemformulering... 3 Målgruppe...

Læs mere

Præsentationsrapport

Præsentationsrapport easj køge multimediedesign 1. semesterprojekt 2016 Præsentationsrapport kunde: køge bmx klub gruppe 6: hans ubbesen hcubbesen.com thomas bay mmtbay.dk pernille nybo sørensen pernillenybo.dk monique n.

Læs mere

WORKFLOW & PRODUKTION

WORKFLOW & PRODUKTION OPGAVE Jeg har lavet et fiktiv website for en hundekennel. Det er mit bud på hvordan sådan en eventuelt kan se ud. PROGRAMMER Photoshop Dreamweaver Illustrator WORKFLOW & PRODUKTION KENNEL BISCO Dokumentation

Læs mere

GRAFISK DESIGN DOTHOST HJEMMESIDE

GRAFISK DESIGN DOTHOST HJEMMESIDE DOTHOST HJEMMESIDE Opgavebeskrivelse Gammelt design Nyt design Dothost er et nyopkøbt firma af ATZnet. Jeg blev ansat til at lave et redesign af siden og få det mere nutidigt og troværdigt. Jeg har igennem

Læs mere

Hassansalem.dk/delpin User: admin Pass: admin INTERFACE DESIGN

Hassansalem.dk/delpin User: admin Pass: admin INTERFACE DESIGN Hassansalem.dk/delpin User: admin Pass: admin INTERFACE DESIGN 1/20 Indledning Dette projekt er den afsluttende del af webudvikling-studiet på Erhvervs Lillebælt 1. semester. Projektet er udarbejdet med

Læs mere

1. SEMESTER SYNOPSIS. Erhvervsakademi Aarhus. Kristian Peter Lund Drewsen E-konceptudvikling EKU-12d (1ek12d1) 1. Semesters Mundtlig Eksamen

1. SEMESTER SYNOPSIS. Erhvervsakademi Aarhus. Kristian Peter Lund Drewsen E-konceptudvikling EKU-12d (1ek12d1) 1. Semesters Mundtlig Eksamen E-konceptudvikling EKU-12d (1ek12d1) 1. SEMESTER SYNOPSIS Den 19 12-2012 Erhvervsakademi Aarhus 1. Semesters Mundtlig Eksamen 1. Semester Synopsis De tre opgaver der er beskrevet i denne synopsis er blevet

Læs mere

ActiveBuilder Brugermanual

ActiveBuilder Brugermanual ActiveBuilder Brugermanual Forfatter: TalkActive I/S Dato: Juni 2004 Version: R. 1.01 Sprog: Dansk Copyright 2004 - Talk Active - all rights reserved. Indhold: 1. INDLEDNING...2 2. QUICK-START...3 3. OPBYGNINGEN

Læs mere

Indhold Formål:... 3 De 6 faser:... 3 Fase 1: Problemanalyse... 3 Fase 2: K-strategi... 3 Fase 3: Idéudvikling... 4 Fase 4: Medieproduktion...

Indhold Formål:... 3 De 6 faser:... 3 Fase 1: Problemanalyse... 3 Fase 2: K-strategi... 3 Fase 3: Idéudvikling... 4 Fase 4: Medieproduktion... Indhold Formål:... 3 De 6 faser:... 3 Fase 1: Problemanalyse... 3 Fase 2: K-strategi... 3 Fase 3: Idéudvikling... 4 Fase 4: Medieproduktion... 4 Fase 5: Test... 5 Fase 6: Offentliggørelse... 5 Kanyle-modellen:...

Læs mere

Projekt 1 Spørgeskemaanalyse af Bedst på Nettet

Projekt 1 Spørgeskemaanalyse af Bedst på Nettet Projekt 1 Spørgeskemaanalyse af Bedst på Nettet D.29/2 2012 Udarbejdet af: Katrine Ahle Warming Nielsen Jannie Jeppesen Schmøde Sara Lorenzen A) Kritik af spørgeskema Set ud fra en kritisk vinkel af spørgeskemaet

Læs mere

Eksamenscase: Cevea delaflevering

Eksamenscase: Cevea delaflevering Eksamenscase: Cevea delaflevering 1. Generelt Casen Cevea Cevea er en centrum-venstretænketank, som blev oprettet i 2008 blandt andet som modspil til den højreorienterede tænketank Cepos. Organisationen

Læs mere

KONCEPT NAVIGATION STRUKTUR KEA

KONCEPT NAVIGATION STRUKTUR KEA KONCEPT NAVIGATION STRUKTUR FOR NYT.DK KONCEPT NAVIGATION STRUKTUR DEN VIDERE PROCES AGENDA DEN PRESSERENDE GRUND FOR ET NYT WEBSITE ER, AT DER ER BRUG FOR FØLGENDE MÅLET MED DET HELE MEN ER IKKE SAT I

Læs mere

Musikvideo og markedsføring

Musikvideo og markedsføring EAL Erhvervs Akademi Lillebælt Multimediedesign (MMD) Musikvideo og markedsføring 1. SEMESTER, PROJEKTOPGAVE 2 December, 2014 Line Falkenberg Jensen Cpr. Nr.: 281293-1558 E- mail: linefalkenberg93@gmail.com

Læs mere

Kvikguide til Navision Stat 7.0

Kvikguide til Navision Stat 7.0 Side 1 af 12 Kvikguide til Navision Stat 7.0 ØSY/STO 26. maj 2015 Konceptet bag den nye brugergrænseflade Overblik Formål Denne kvikguide omhandler konceptet for brugergrænsefladen, som Navision Stat 7.0

Læs mere

Portfolie Redesign. Forord. Det tekniske. Tema ide. Css. opløsning.

Portfolie Redesign. Forord. Det tekniske. Tema ide. Css. opløsning. Portfolie Redesign dette er en gennemgang af opbyggelse af mit portfolie, med samtilige begrunderlser af design valg. Forord Min portfolie hjemmeside er fra start af ment som et startplatform og ikke et

Læs mere

Guide til din computer

Guide til din computer Guide til din computer Computerens anatomi forklaret på et nemt niveau Produkt fremstillet af Nicolas Corydon Petersen, & fra Roskilde Tekniske Gymnasium, kommunikation & IT, år 2014 klasse 1.2 12-03-2014.

Læs mere

OPGAVEN PROGRAMVALG. Jeg har brugt Illustrator til at lave logo og ikoner.

OPGAVEN PROGRAMVALG. Jeg har brugt Illustrator til at lave logo og ikoner. GRAFISK DESIGN OPGAVEN Min kæreste er medstifter af en vinloge. Medlemmerne af logen kunne godt tænke sig et sted, hvor de bl.a. kunne få et overblik over, hvilke vine de har bedømt og hvornår næste loge

Læs mere

GRAFISK WORKFLOW BESKRIVELSE. KUNDE Meyer & Munk PRODUKTIONSÅR 2012. PROGRAMMER Xmind, Photoshop, Illustrator. MÅLGRUPPE Nye og nuværende kunder

GRAFISK WORKFLOW BESKRIVELSE. KUNDE Meyer & Munk PRODUKTIONSÅR 2012. PROGRAMMER Xmind, Photoshop, Illustrator. MÅLGRUPPE Nye og nuværende kunder Kompentence- og mentaludvikling GRAFISK WORKFLOW KUNDE Meyer & Munk PRODUKTIONSÅR 2012 PROGRAMMER Xmind, Photoshop, Illustrator MÅLGRUPPE Nye og nuværende kunder BESKRIVELSE Meyer & Munk Kontakt - øverst

Læs mere

DIO. Faglige mål for Studieområdet DIO (Det internationale område)

DIO. Faglige mål for Studieområdet DIO (Det internationale område) DIO Det internationale område Faglige mål for Studieområdet DIO (Det internationale område) Eleven skal kunne: anvende teori og metode fra studieområdets fag analysere en problemstilling ved at kombinere

Læs mere

Få optimeret dit firmas website til mobilen og styrk dit image ud af til.

Få optimeret dit firmas website til mobilen og styrk dit image ud af til. Få optimeret dit firmas website til mobilen og styrk dit image ud af til. Hvorfor? Vi danskere vil være på nettet overalt. Og det kan ses på mængden af datatrafik, vi henter og sender til og fra vores

Læs mere