Proces

Første Sprint

Vi startede ud med en tur ud til klienten. Her blev vi introduceret til vores case, og fik et kig på stedet. Derefter så fik vi lavet en gruppekontrakt til vores gruppe, hvor vi fik sat standarden for hvordan bl.a. vore kommunikation skulle fungere.

Derudover så fik jeg også til opgave at lave vores risikoanalyse hen over weekenden, hvor de andre fik lavet risiko analyse og projektplanen.

På den første dag der fik vi opsat, vores SCRUM-board, samt tidsestimeringer.

Derefter fik vi lavet en KWHL-chart, og udeligeret hvad research vi skulle på derfra. Hver skulle jeg kigge på, UI tendenser indenfor event og glamping, samt generelle UI trends og tendenser.

Efter vi var færdige med research, så begyndte jeg på at opsætte et spørgeskema i google forms, også fik jeg lavet en flyer som de andre så kan ligge rundt omkring. Derudover så fik jeg delt spørgeskemaet på diverse Facebook grupper, som bl.a. tilhørte København, Odense, Århus og Aalborg område.

Jeg var også med til at lave et telefonisk interview med Bibi, som er vores klient for dette projekt. Og der fik vi en masse god viden som vi kan gøre brug af senere i forløbet.

Andet Sprint

I andet sprint der startede jeg ud med at lave userflows baseret på vores personas goals og user stories.

Og da jeg havde lavet userflowsne så fik jeg lavet wireframes baseret på de userflows jeg havde lavet. Wireframesne kan ses nedenfor

Torsdag der var hele gruppen i Fredericia, for at hjælpe til “UCL rykker ind”. Så det eneste vi lavede der var at få planlagt vores midtvejs pitch.

Til midtvejs pitchen der fik vi en masse gode pointer fra alles oplæg, som bl.a. at vi skal huske at kunne argumentere for vores design valg, og ikke bare skal have synsninger.

Tredje Sprint

Her begyndte vi at en mockup af vores hjemmeside, og lavede det til en hi-fi prototype. Hvor vi så derefter fik brugertestet den på 5 personer. Her fik vi en masse feedback, til hvordan vi kunne forbedre vores design. Efter vi havde fået opdateret vores design, så fik jeg opsat vores designsystem. Hvilket ikke var så svært da jeg kunne tage meget af opsætningen som jeg havde brugt i projekt 4.

Som noget af det sidste som vi fik lavet i dette sprint var at komme i gang med vores kode, her der stod jeg igen for at få alt html’en og css’en implementeret. Derudover så fik jeg lavet en liste over de ting som skulle laves i JavaScript, hvor de andre i gruppen så får en ting hver, og jeg tager resten af det der skal laves.

Om fredagen der tog vi ud hos Bibi og filmede content og tog en masse billeder. Da vores projekt fokusere på de allerede eksisterende glamping gæster, så ville vi gerne tage nogle billeder som kunne illustrerer de her børne familier. Dog så skulle vi bruge et barn til at kunne hjælpe os, hvilket ikke altid er helt nemt at skaffe. Dog så sagde Bibi at vi godt kunne låne hendes søn, så det var hvad vi gjorde.

Derudover så fik jeg leget en hel del med hendes hund, og fik sagt hej til hendes ponyer, hvilket var highlightet for min dag

I weekenden der arbejdede jeg på at komme længere med html’en og css’en, samtidig så hjalp jeg Josefine med hendes JavaScript om lørdagen, hvor vi endte med at komme i mål med den del.

Fjerde Sprint

Dette er den sidste uge inden vores projekt skal afleveres. Om mandagen så stod det på mere html og css, her hjalp jeg så også Dicte med hendes JavaScript, så hun kunne blive færdig med det hurtigere end hvis hun nu selv skulle sidde og lave det. Derudover så blev det en lang dag for mig, da jeg endte med at sidde på skolen indtil kl. 18:45, og var stadig ikke færdig med html og css delen. Det har været en meget besværlig hjemmeside at skulle kode, og med rigtig mange billeder, som bare ikke har lyst til at samarbejde, og når man finder en løsning til at fikse et billede, så virker den ikke altid på alle de andre billeder.

Tirsdag der endte jeg endelig med at blive færdig med html og css delen, og skal så i gang med mit eget JavaScript. Dog så mangler der stadig en del finpudsning i html’en og css’en, som fx. så skal der sættes de rigtige billeder ind, der skal laves en footer, også skal den laves responsiv.

Jeg blev færdig med min JavaScript tirsdag aften. Koden består af at lave booking systemet til at virke, ved at udregne prisen for ens ophold baseret på, mængden af dage, om man har valgt lavsæson eller højsæson, om man er mere end 4 personer, og om man har valgt at købe ekstra events til.

Onsdag der fik jeg skrevet vores abstract, også selvom at der stadig var en del kodeting som manglede at blive gjort. Men blev nødt til at skrive noget for ligesom at kunne sige at jeg har fået bidraget med noget til rapporten. Rapporten var så endelig skrevet færdig, og selvom at jeg ikke rigtig har bidraget til at få skrevet den, så tror jeg de andre er meget taknemlige for at jeg har taget mig af alt koden i stedet for, hvilket har taget meget længere tid end jeg selv havde regnet med at det ville. Men kan dog også sige at jeg er ret stolt af det produkt jeg så har fået lavet.

Efter jeg havde skrevet abstract så begyndte jeg på alle de små ting som manglede til koden. Jeg startede ud med footeren, og gik videre til at udskifte alle billederne til de rigtige, også brugte jeg en del tid på at få koden til at være responsiv. Og da alt det var klaret så kunne jeg endelig få det hele kodevalideret, og da det var done så fik jeg smidt det hele på nettet.

Så vores endelige prototype kan ses på dette link: https://projekt5.flipdesign.dk/index.html

Refleksion

I starten af dette projekt, der føltes det som om at vi var langt bagud i forhold til de andre grupper. Dog som tiden gik fremad, så endte vi faktisk med at ligge nogenlunde samme sted som de andre grupper, uden at vi var gået på kompromis med vores produkter. Da vi kun har været 3 mand til dette projekt, så har der været en del mere tidspres, men jeg synes nu faktisk at vi kom igennem det ret godt, og med nogle produkter vi kan være stolte af.

Vores prototype endte med at være en del mere omfattende kodemæssigt, hvilket gjorde at jeg brugte mere end 4 dage på at sidde med html og css, hvor de andre så har fået skrevet på rapporten i mens. Jeg brugte også noget tid på at hjælpe de andre med deres JavaScript, fordi jeg vidste at de kun ville bruge maks. 1 dag på det, hvor hvis de skulle sidde med det selv ville det måske have taget dem et par dage, som de så kunne have bruge på at lave noget mere af opgaven på. Derfor så hjalp jeg dem glædeligt, også selvom at det så også fik udskudt min egen opgave. Men der har jeg så været taknemlig for at de er taknemlige for at jeg ville stå for koden og de så kunne skrive rapporten. Da jeg nemlig har lige så svært ved at skulle skrive, som de har med at skulle kode. Så de hjalp mig ved at skrive rapporten, da hvis jeg skulle have hjulpet til der så ville vores prototype ikke have været blevet så færdig som den er blevet.

Samarbejdet i vores gruppe har fungeret super fint, der har været lidt mere pres på fordi vi kun var 3, men vi har igen stadig haft mange forskellige kompetencer. Hvori at jeg jo stod for koden, hvilket de andre er lykkelige over at jeg gjorde.

Fuck jeg hader at skulle style billeder i css tror jeg har brugt omkring 50% af min tid med at prøve at få dem til at skulle gøre som jeg vil have dem til. Og så snart man finder en løsning til et billede så har man kun fundet løsningen til det ene billede, og det vil højst sandsynligt ikke virke på de andre billeder. Og vi har fucker mange billeder på vores side, (hvilket er hvad vi gik efter for ligesom at kunne ramme vores målgruppe) som alle bare skal være anderledes. Så efter at have siddet med det i alt for lang tid, så begyndte jeg at være lidt ligeglad med hvordan og hvorledes de så ud. Man kan se vores reelle vision på Figma.

Selve projektet synes jeg har været alt for stressende ikke kun fordi vi kun var 3 mand, men fordi vi skulle nå at lave så mange forskellige ting. Som fx at vi både skulle skrive en rapport og en klient rapport. Der føler jeg lidt at man godt må holde sig til enten eller. Eller have givet et par dage mere til klientrapporten, så man ikke behøvede at skulle aflevere den sammen med rapporten. Eller også så skulle man have haft mere tid. Derudover så hader jeg når projekter starter på en fredag, da man ikke rigtig har tid nok til at kunne planlægge hvad man hver især skal gøre, også har man jo en weekend hvor der så ikke bliver lavet noget.

Proces

I løbet af dette projekt har vi brugt scrum, hvor vi har været igennem 5 forskellige sprints.

Første sprint: Planlægning

Vi startede ud med det første sprint som handlede om planlægning.

Her der lavede vi bl.a. vores gruppekontrakt. Efter det så valgte vi hvilken velgørenheds organisation vi ville arbejde med, hvor vi endte med at vælge at arbejde med Blå Kors Danmark. Efter vi havde valgt hvilken virksomhed vi ville arbejde med, så lavede vi interessentanalyse, risikoanalyse og målformulering.

Derudover så lavede vi en projektplan over vores fremtidige sprints, og planlagde hvad vi skulle lave i de forskellige sprints. Efter vi havde lavet vores projektplan, lavede vi et KWHL-diagram, for at kunne lave en oversigt over vores eksisterende viden, samt hvad vi havde brug for at vide for at kunne komme i mål med vores projekt.

Andet sprint: Research

På baggrund af KWHL-diagrammet, så har vi alle lavet noget desk research, hvor jeg undersøgte målgruppen og deres frivillighed.

Derefter så lavede jeg et spørgeskema som kunne blive sendt ud på Blå Kors’ sociale medier.

Vi fik også lavet et interview med Kirsten Marie som er distriktschefen hos Blå Kors. Samtidig med så blev der lavet en persona, baseret på den data vi har fået fra vores research samt spørgeskema.

Tredje sprint: Ideudvikling og midtvejspitch

Vi startede på ideudviklingen, hvor vi lavede en brainstorm for at kunne finde frem til hvilket slags produkt og hvilke typer content vi ville lave.

De 3 forskellige slags content der fandt vi frem til at skulle lave.

De 3 forskellige slags content ideer, der kom vi bl.a. frem til

Den første ide var en outfit-inspiration, som skal hjælpe målgruppen med at se potentialet i genbrugstøj.

Den anden ide omhandler at vise hvad der sker med det tøj man donerer.

Og den sidste ide er at lave en samlingen på priserne på nyt tøj vs. prisen i genbrugen.

Og til vores produkt kom vi frem til at lave en app, som skulle hjælpe en med at finde forskellige outfit ideer.

Efter vores ideudvikling så begyndte jeg at hjælpe med at lave lo-fi wireframes, af vores produkt. Som kan ses på billederne nedfor:

Efter vi blev færdige med lo-fi wireframesne, så hjalp jeg med at lave en slags style tile, hvor der blev indsat de forskellige farver og skrifttyper, som kunne findes på blå kors’ hjemmeside. DETTE VAR IKKE NEMT. De bruger sådan 3 forskellige blå farver på deres hjemmeside.

Baseret på de fundne farver og skrifttyper, og de lo-fi wireframes, så lavede jeg en hi-fi prototype på en computer.

Som kan prøves nedenfor:

Derudover så blev der også lavet en hi-fi telefon prototype.

Som kan prøves nedenfor:

Den sidste dag i sprintet der havde vi midtvejs pitch, som gik super godt. Vi fik en masse brugbar feedback, som vi kan bruge senere i processen.

Fjedre sprint: Udvikling af produkter

I starten af det fjedre sprint der lavede vi en brugertest på vores hi-fi prototype, for at finde ud af hvad der kunne forbedres, inden det bliver ført over til kode.

I sammenhæng med vores opdaterede hi-fi prototype, så lavede jeg også et design system som skal bruges til at hjælpe med at designe vores interaktive produkt.

Efter det så begyndte jeg med kode delen, her lavede jeg en liste over de ting som produktet skulle indeholde, heri hvilke sider, forskellige slags header og footer, samt funktionalitet, som skal laves med JavaScript.

Jeg endte med at lave en liste med alle de forskellige funktionaliteter som skulle laves med JavaScript, hvor jeg opdelte dem efter hvor omfattende jeg tænker at de ville være.

Efter det så begyndte jeg at opsætte vores html og css, baseret på vores hi-fi prototype samt designsystem.

Og da vi alle skal lave noget JavaScript, så fik vi aftalt hvad vi hver især skulle lave, ud fra den liste jeg kom frem til. Hvor jeg ender med at skulle lave en smule mere end de andre, dog så arbejder jeg ikke med content delen, så det går lige op.

Femte sprint: Rapport

I det femte sprint der er der blevet skrevet på rapporten, samt finpudsning af de sidste kode detaljer, og få filmet min forklaring af mit JavaScript.

Vi startede ud med at opdele hvem der skulle skrive hvad i rapporten. Hvor jeg endte med at skulle skrive om Projektstyringsmetode, Værktøjer og løsningsforslaget.

Som altid så har det været pisse svært at få skrevet, så har fået meget hjælp fra de andre i gruppen.

Derudover så stod jeg også for reference listen og indholdsfortegnelsen

Refleksion

Vores digitale løsning endte med at være end del mere avanceret at skulle kode, end jeg først havde regnet med. Hvilket gjorde at jeg brugte Copilot til meget af min JavaScript.

Som altid så har samarbejdet været så stærkt i denne gruppe, vi har mange forskellige kompetencer som vi bidrager med, hvilket gør at alle har noget de kan bidrage med.

Det gode ved dette projekt har bl.a. været vores planlægning, som vi allerede fra starten af havde fået sat op, så man vidste hvad der skulle laves hvornår.

Som altid så har jeg det ekstremt svært ved at skulle skrive akademiske rapporter, dog så er jeg så glad for at den gruppe jeg er i, at der er nogle som er gode til det, og derfor også tager noget mere på sig, hvilket gør at jeg ikke skal skrive lige så meget.

En af de fejl vi endte med at begå, var at vi ikke vidste nok om målgruppen og hvad vi ville have ud af dem da vi lavede vores første spørgeskema. Så vi skulle i starten af projektet have brugt noget længere tid på at få undersøgt og forberede hvad vi ville vide.

Vi mødtes stort set på UCL hver dag fra 9-15 for at arbejde på projektet, hvilket har fungeret så godt. Og er noget jeg altid vil foretrække fremover.

Alt i alt så synes jeg at dette projekt er gået meget godt, der er altid forbedringer man kunne have lavet, og ting som man i bakspejlet skulle have gjort anderledes, men jeg synes nu at det er gået meget godt alligevel.

Vores endelige interaktive prototype kan ses her:

https://projekt4.flipdesign.dk/aboutUs.html

Til dette projekt skulle vi re-implementere en eksisterende hjemmeside i HTML, CSS og JavaScript(JS), med fokus på at hvert gruppe medlem skulle lave en JavaScript funktion, på siden, som skulle indeholde alt det vi havde haft om ugen inden.

Vi valgte at gå med H&M, da vi nemt ville kunne finde forskellige slags JS som vi kunne prøve at implementere.

Vi valgte at re-implementere 2 sider, forsiden og en produktside. De forskellige JavaScript opgaver vi kom frem til var:

• Sidemenu
• Login
• Billedgalleri
• Produktvalg
• Læg i kurv

Hvoraf jeg fik til opgave at lave produktvalget, da jeg allerede havde arbejdet med JavaScript før, og har okay styr på det, fik jeg en af de mere avanceret opgaver.

Jeg skulle lave produktvalg, som skulle gøre at man kan vælge forskellige farver hvor den skifter billederne til selve produktet så det matcher med den farve man har valgt, samt så skulle den vise de størrelser som er tilgængelige til den tilsvarende farve.

Først før vi kunne gå I gang med noget som helst, så skulle selve sidens html og css op og køre. Her fik jeg til opgave at lave produktsiden I html.

For at få den så tæt på den virkelige side, har jeg inspectet H&M’s side, hvor jeg har taget deres CSS, for at være sikker på at forholdene svarede nogenlunde overens.

Da jeg var færdig med HTML delen, begyndte jeg så på at lave Javascripten, her startede jeg med at lave alle de forskellige farve valg om til objekter, så jeg havde noget at gå ud fra når jeg gik videre til den egentlige funktion ved koden. I selve ugen hvor vi skulle arbejde med projektet, var jeg også tutor for de nye elever. Hvilket gjorde at den mængde arbejdstid jeg havde var meget begrænset, dog gjorde dette ikke noget da jeg startede om tirsdagen og blev færdig tirsdag aften.

Resten af ugen der hyggede jeg mig med at prøve og hjælpe de andre, med deres opgave. Og torsdag der kom jeg igen på arbejde da vi skulle merge alle vores ændringer. Hvilket er besværligt når ikke alle er færdige endnu, så jeg skulle først vente på at alle blev færdige før jeg kunne gøre det. Og her hjalp jeg Dicte til at forstå og prøve at tænke sig frem til hvad hendes kode skulle indeholde. Og da hun endelig blev færdig så færdiggjorde jeg mergen, hvor github ikke var alt for hjælpsom, men fordi jeg har arbejdet meget med det, så kunne jeg nemt fikse det der endte galt.

Om fredagen der mødtes vi som en gruppe, hvor vi fik uploadet vores side til et domæne, samt fik godkendt videoen, også fik vi afleveret.

Link til Forside:  https://jsvarre.dk/JavaScriptProjekt/index.html

Link til Produktside:  https://jsvarre.dk/JavaScriptProjekt/produktside.html

Refleksion

Dette projekt var meget for at få en genopfriskning på JavaScript. Da jeg allerede har arbejdet med det før, så har jeg ret godt styr på hvad koden gør. Dog har jeg flere problemer med at finde ud af hvad min kode skal indeholde, for at få den funktionalitet jeg søger efter. Her bruger jeg ofte ChatGPT, for at kunne give mig et forslag til hvordan det kan se ud, men jeg bruger aldrig kode jeg ikke har sat mig ind i hvad det gør, og om hvorvidt det er nødvendigt eller ej.

Den svære del ved projektet var den korte tidsperiode vi havde til det, samt at jeg var tutor samtidig. Dette gjorde at jeg valgt at få mere hjælp fra chatGPT end jeg normalt ville gøre. Normalt plejer nemlig at gå på google og finde svarene derigennem, men dette kan varier meget med hvor lang tid det vil ende med at tage, da man ikke altid kan finde det rigtige svar til ens problem. Hvorimod chatGPT kan komme med en løsning på 2 sekunder, dog lærer man ikke altid ligeså meget når man bare bruger chatGPT, da den kommer med en meget præcis og ofte kun 1 løsning, samt så har chatGPT en præference at inkorporer mere avanceret kode termer og funktioner som vi endnu ikke har lært, dog hvis man spørger på den rigtige måde så får man noget der kan til svare ens niveau. Hvor hvis man kigger på nettet kan man måske lærer om forskellige slags løsninger, og ting som man ikke selv ville have tænkt på.

Alt i alt så er jeg meget tilfreds med min del af projektet, dog ville jeg en anden gang foretrække at bruge minde chatGPT. Jeg har ikke lært supper meget, da jeg allerede var godt kendt med alt det vi lavede i forvejen. Men jeg har derimod været i stand til at kunne lære fra mig, og hjælpe de andre med deres del.