Mandag d. 28/04 2025 havde vi kick-off på semesterets tredje og sidste projekt, eksamensprojektet. Vi fik tildelt projektbeskrivelsen inden weekenden, så vi kunne forberede spørgsmål til kick-off.
Projektbeskrivelse
I dette projekt skulle der udarbejdes en præsentationsportfolio, der skulle kodes fra bunden med den viden om html og css man har tilegnet sig. Foruden ens præsentationsportfolio, tager eksamen udgangspunkt i ens procesportfolio samt en plakat, der beskriver proces bag udvikling af sin præsentationsportfolio.
Procesbeskrivelse
De første par dage efter kick-off gik, for mig, med at lave en overordnet plan så jeg havde et over blik over, hvad der skulle laves og hvor meget til, der skulle allokeres hver opgave.
Discovery
Målgruppe
Som min målgruppe for dette projekt, har jeg valgt at fokusere på Morningtrain.dk, som er et digitalt bureau.
Interview
Jeg kontaktede Morningtrain.dk i håb om et fysisk interview, men måtte nøjes med, at gennemføre interviewet via mailkorrespondance
Foruden Morningtrain.dk, tog jeg kontakt til 3 andre lignende bureauer, hvoraf et vendte tilbage med tilbuddet om et interview.
I forbindelse med interview tog jeg udgangspunkt i KWHL
Know – what do we know?
På forhånd vidste jeg, at de i virksomheden var medarbejdere med multimediedesign uddannelsen. Derudover kunne jeg ud fra deres ’mød os’ side fornemme, hvad der har betydning på målgruppevirksomheden ift. den typer person, der passer ind i deres team.
What – what do we want to know?
For at appellere bedst muligt til min målgruppe, ønskede jeg at blive klogere på dem og hvad der i deres øjne gør en portfolio god og hvad jeg bør undgå. Med det formål at samle inspiration, vil jeg analysere portfolier fra andre multimediedesignere, jeg finder på nettet
How – how can we find out?
Min metode for at indsamle relevant information involverede blandt andet, at foretage interviews med målgruppen og lignende virksomheder i branchen – både fysisk og over mail. Foruden interviews samlede jeg viden om min målgruppe ved at undersøge deres ”mød os” side, hvor man få information om de fleste af medarbejderne. Desuden researchede jeg, hvordan andre multimediedesignere havde opbygget deres portfolier ved at søge på nettet.
Learned – what have we learned?
Gennem de interviews jeg foretog, fik jeg tilegnet mig en god mængde viden om min målgruppe og hvad der for dem er vigtigt i en portfolio. Nogle af svarene kan ses nedenfor.
Hvordan ville du beskrive din virksomhed med 5 ord?
Fællesskab, udvikling, tillid, åben, afslappet.
Hvilke værktøjer gør i hovedsageligt brug af?
React, WordPress, JSX, Docker, Tailwind, Git, WooCoomerce, BEM, JavaScript, PHP, Lando, Laravel, Next.js, Figma, Ray.
Hvad er det første, du lægger mærke til i en portfolio?
Farvevalg og layout.
Har du set en portfolio for nylig, der gjorde et særligt godt indtryk? Hvorfor?
Ja portfolier hvor kandidaten skinner i gennem og det ikke bare ligner en eller anden skabelon. Samtidig er udtalelser også mega nice.
Er der noget, du savner i de fleste portfolier, du har set?
Flere udtalelser og mere mod på at vise mere af sin egen personlighed, i stedet for at være lidt stiv i betrækket
Interpretation
I interpretation-fasen har jeg tolket på den viden jeg tilegnede mig fra research og interviews nedenfor har jeg samlet de mest fremtrædende svar og observationer:
Interview
Herunder er en kort opsamling på de mest forekommende responser omkring, hvad der er vigtigt, og mest iøjnefaldende i portfolier:
Vis personlighed – fantasi og kreativitet
Brug spændende, engagerende farver
Layout – alignment skal være skarpt
Udtalelser – hvis man har nogle af dem
Research
I løbet af min research, stødte jeg på bestemte elementer eller indhold, som gik igen i de fleste, hvis ikke alle, portfolier:
Logo
Stort, iøjnefaldende billede/portræt/animation af personen
Runde/afrundede billeder
Nævne værktøjer og kompetencer
CTA’er – kontakt – mail, tlf.nr., insta, facebook
Kort præsentation på index-siden
Persona
Ud fra den viden jeg tilegnede mig i discovery-fasen, har udarbejdet en persona.
Ideation
I forbindelse med ideation-fasen brugte jeg min viden fra de foregående faser til idegenerering. I denne fase har jeg gjort brug af visual research, moodboards og brainstorm.
Visual research
Jeg brugte Pinterest og min målgruppes hjemmeside til at lave visual research.
Brainstorm
I forbindelse med denne fase brainstormede jeg ideer til bl.a. stil, farver og feel.
Moodboard
Ud fra ovenstående punkter, lavede jeg et moodboard. Jeg ønskede at fange målgruppens stil samtidig med, at jeg bibeholdt min egen stil.
Experimentation
I denne fase har jeg gjort brug af styletile, wireframes og C.R.A.P. Derudover er det også i denne fase, vi har haft silent feedback.
Styletile
Mit tidligere arbejde, især fra ideation-fasen, har været springbræt for udarbejdelsen af min styletile.
Silent feedback
Vi havde silent feedback mandag d. 05/05 2025. Hertil havde jeg forberedt første ide til wireframes til lille og stor skærm, da jeg ønskede at få feedback og eventuelle forbedringer til layoutet. Derudover medbragte jeg et moodboard, starten på en styletile og starten på en persona.
Silent feedback gik ud på, at vi alle gik rundt og så, hvad vi hver især havde forberedt til dagen, og skrev feedback og eventuelle ideer på et stykke A3, der lå ved hver computer. Den feedback jeg modtog kan ses her:
C.R.A.P.
Jeg har arbejdet med C.R.A.P. principper i løbet af min beslutningsproces.
C:Jeg har anvendt contrast på en sådan måde, at jeg fremhæver det indhold eller de elementer, jeg ønsker mest fokus på. Her har jeg både gjort brug af mine udvalgte farver og typographical hierarchy.
R: For at sikre overensstemmelse gennem hele mit design har jeg benyttet mig af de samme visuelle elementer gentagende gange på tværs af mine portfoliosider. Dette inkluderer typografier, skriftstørrelser, farver, kasser og knapper.
A: Alignment er et af de punkter jeg har haft meget fokus på eftersom det spillede en central rolle i mine respondenters opfattelse af personen og deres professionalisme ud fra portfolien.
P: Jeg har på min portfolio kasser, der indeholder billeder og tekst. Det er dermed let ved første øjekast at se, hvilke elementer, der relaterer sig til hinanden.
Wireframes
Mine wireframes til big og small screen kan ses nedenfor:
Kodning
I forbindelse med min kodning har jeg søgt hjælp og vejledning ved koden for andre hjemmesider, YouTube-videoer samt spurgt mig til råds hos ChatGPT.
Jeg valgte egentligt at kode uden jeg havde mock-ups, da jeg faktisk ikke var helt sikker på, hvad jeg kunne udrette med min kode, og derfor ikke ville udfordre eller tilbageholde mig selv for meget. Jeg havde dog stadig min wireframe at gå ud fra, og havde derfor også en grundlæggende ide om hvad, der skulle være hvor, og hvordan jeg egentlig gerne ville have det til at se ud.
Jeg har som udgangspunkt arbejdet mobile-first. Enkelte steder har jeg dog lavet big-screen først, og derefter arbejdet ned til small-screen. Kigger man på min kode, er det dog stadig bygget op på en måde, så den del af koden, der ikke har en media query er min small-screen.
Mens jeg kodede har jeg forsøgt at minimere min brug af JavaScript. Det har jeg valgt da jeg ville fokusere på at bruge den kode vi havde lært i undervisningen, og dermed selv kunne forstå størstedelen af min kode.
Evolution
Evolution-fasen finder først sted efter afleveringsdatoen, jeg kan derfor ikke skrive så meget om det. I denne fase skal der udarbejdes en testplan og -script samt brugertestes. Efter mine brugertests, er det tid til næste iteration
Refleksion
Nok min største udfordring for dette projekt har været, hvordan jeg skulle disponere min tid og overholde de deadlines jeg lavede for mig selv i forløbet. I starten havde jeg et overblik over, hvad jeg gerne ville have færdig hvornår, hvornår jeg gerne ville begynde at kode og hvornår jeg gerne ville være færdig med min kode. Men alt mellem jeg begyndte og var færdig med kodningen flød lidt sammen for mig. Jeg lavede to dos dag for dag, som ikke altid blev overholdt enten fordi jeg tidsrammen, overvurderede egne evner eller stødte på uforudsete udfordringer.
Da vi ved kick-off fik at vide, at vi i bund og grund havde lært alt vi behøvede for at udføre dette projekt og kode vores egen portfolio fra bunden, havde jeg meget svært ved at tro på, at det rent faktisk var sandt. Jeg følte mig langt fra ready til en så stor opgave, men det lykkedes og det synes jeg er en megafed følelse!
Der er selvfølgelig plads til forbedringer i organisationen, valgte tags, og mon ikke også det stadig halter lidt med BEM. Men så ved jeg da, hvad jeg skal øve mig på.
Det er første gang jeg koder et stort projekt, det eneste andet jeg har kodet, er de øvelser vi har lavet i kodeundervisningen. Det har derfor også været svært af finde ud af og afgøre, hvad jeg forventede af mig selv for dette projekt. Efter nogle forsøg og fejl på at følge min tidsplan og to do lister, gik det op for mig, at den største forventning, og nok også en af de eneste, var, at jeg blev færdig med projektet, og endte ud med et produkt, jeg er tilfreds med og kan stå inde for, og ikke sammenligne det med, hvad nogle af de andre har lavet.
I projekt 1 var jeg lidt udfordret på at køre et ordentligt work/life blance. Det ærgede mig, og virkede en smule demotiverende, derfor var mit mål fremadrettet også at priotere fritid selv hvis man derfor også er nødt til at gå en smule på kompromis med, hvor meget man kan nå et lave eller kvaliteten heraf. I projekt 2 synes jeg det lykkedes mig at finde den rette balance, og jeg har helt klart også været god til at prioritere fritid noget mere under eksamensprojektet – måske en tand et den gode side. Jeg tror også det kommer af, at man har arbejdet alene og derfor ikke nødvendigvis har aftalt en bestemt tid og sted man fokuserer på, at arbejde på det. Så til en anden gang vi skal lave individuelle projekter, er det helt klart noget jeg igen skal have fokus på.
Refleksion over studiegruppe
Jeg har i eksamensprojektet været i studiegruppe med Rebecca, Teodor, Oliver, Maria og Freja.
Inden vi skulle have silent feedback, aftalte vi som gruppe et møde over Discord. Mødet brugte vi til at vise, hvad man havde fået lavet indtil det punkt, så man kunne få noget feedback, som man kunne arbejde videre med. Ud over feedback på eget projekt kunne man også drage inspiration fra det, de andre havde lavet eller tænkt.
Vi mødtes også på skolen af nogle omgange. Den ene af gangene havde vi booket medialab, så vi kunne få taget nogle flere/bedre billeder til brug på sin portfolio, hvis man havde brug for det. Derudover aftalte vi en dag at sidde sammen på skolen og arbejde.
Som studiegruppe, havde vi også aftalt at tage nogle dage i en af gruppemedlemmernes sommerhus, så man kunne slappe af og hygge, men også hjælpe hinanden med at holde koncentrationen og skubbe hinanden i gang igen, hvis man stødte på nogle bump. Desværre kunne jeg ikke deltage alligevel, men spurgte mig stadig til råds over discord eller snapchat.
De af os, der havde tid, mødtes desuden på skolen for at få styr på både Github og Filezilla, så vi kunne vejlede og hjælpe hinanden, skulle der påstå tvivl eller udfordringer
Gennem hele projektet har jeg snappet rigtig meget med især Freja, hvor vi sendte videoer frem og tilbage om hvordan det gik, hvilke problemer man oplevede eller havde fået løst, tanker og ideer til forbedringer og forsøg på at holde hovedet højt.
Alt i alt har jeg været superglad for min studiegruppe. Dog ville jeg ønske, at vi arbejdede noget mere sammen, derfor er jeg også megaærgerlig over at jeg ikke kunne være med i sommerhuset. Set bort fra det, har det været superfint. Vi havde en gruppe på Discord, og når man skrev om et problem eller stillede et spørgsmål, kunne man ret hurtigt forvente noget respons. Jeg har også været glad for snapchat-videoerne, da det er meget nemmere at vise ens udforinger eller bare vise, hvor langt man er nået og hvordan det går.