Præsentationsportfolio – 1 Semester eksamen

Til vores 1 semester afslutnings eksamen, skulle vi lave en præsentationsfolio omkring os selv. Her skulle vi præsentere vores evner og kunnen igennem grafik og cases.

Vi havde nogle meget specifikke krav til denne eksamen:

• Hjemmesiden skal kodes fra bunden i HTML5 og CSS
• Koden skal validere ifht. godkendte webstandarder(alle sider)(benythttp://validator.w3.org/+http://jigsaw.w3.org/css-validator/)
• Hjemmeside skal være responsiv
• Billeder på hjemmesiden skal optimeres (https://bit.ly/3kmT655)
• Benyt C.R.A.P. principperne og andre relevante designmetoder
• Fremhæv dit personlige brand i kommunikation og udtryk
• Fremhæv professionelle egenskaber du kan bidrage medhos en virksomhed
• Udvælg relevant materiale der er udarbejdet i løbet af semesteret (både privatog undervisningsrelateret) og præsenterer det i præsentationsportfolioen
• Der skal være mulighed for at kontakte dig (kontaktinformation,kontaktformular etc.)

Indledning

Jeg vil producere en professionel og personlig hjemmeside, som bærer mit præg og kunnen. Den skal vise hvad jeg kan byde på, samtidig med hvem jeg er som person. Jeg vil finde frem til mit endelige resultat ved hjælp af research omkring mig selv og den branche jeg ønsker at arbejde i. Her skal jeg bruge Design thinking, som hovede design modellen fordi den har nogle meget vigtige trin og strukturere udviklings processen af et produkt, som i sidste ende kommer til at hjælpe mig med at lave et veludført arbejde.

Derudover vil jeg bruge andre modeller inden i de forskellige faser af designmodellen for enten at opdage eller løse problemer med modeller såsom:

• Kanban board
  For at få et overblik over projektet og holde styr på hvilke opgaver er blevet gjort færdigt og hvad der mangler at gøres, bruges et kanban board.

• Design thinking
  Modellen er brugt, for få en overordnet struktur over dokumentationen og udviklingsprocessen af præsentationsportfolioen.

• Desk research
  Generelle informationer om målgruppen, sit brand, som man kan finde via research.

• C.R.A.P
  En model der bærer fundamentale designprincipper og er valgt til at få en intuitivt struktur over selve præsentationsportfolioen design.

• Gestalt principperne
  Gestalt Principperne er blevet anvendt her, for at få et indblik og forstå hvordan mennesker psykologisk opfanger bestemte visuelle opsætninger.

• Persona
  For at få et indblik i hvem min målgruppe er, har jeg brugt persona til at visualisere dem og forstå deres behov.

• Brainstorming
  Brainstorming metoden er brugt for at udfolde mine idéer og sætte mine kreative tanker i gang, for at komme frem til det mest optimale resultat.

• Visual research
  En måde at blive inspireret på, ved at undersøge de virksomheder man er interesseret i, at blive ansat hos og design trends.

• AIDA
  For at strukturere mit budskab til målgruppen, er AIDA modellen blevet anvendt på designet.

Afgrænsning

Jeg har valgt at fokusere på de ovenstående metoder, da de rammer bredt og går ind i alle de punkter jeg behøver for at udarbejde et projekt.

På grund af de udfordringer vi har med Corona i dag, har brugertesten ikke været Ideelt, vi har været nødt til at begrænse dem og brugerteste af på enten vores nærmeste eller klassekammerater og ikke potentielle kunder. Planlægningen af dem har også været en udfordring og derfor blevet taget meget sent.

Planlægning

Inden jeg begyndte på den aktuelle opgave, satte jeg også et kanban board op for at kunne planlægge hvad jeg skulle nå at gøre og huske på hvad jeg har klaret og er igang med.

Analyse

Design thinking modellen består af 5 faser og det her er hvad jeg gjorde i de foreskellige faser.

Discovery fasen

I Discovery fasen er man på opdagelse, her finder man alt den information frem man kan finde om f.eks kunder, produktet man vil sælge hvad der er på market og således. I denne opgave gav det god mening at finde ud af hvem jeg er, som person hvad jeg kan lide at lave, min historie og hvad der findes af virksomheder man kan arbejde hos på market, hvilken ville passe inden for min målgruppe. Det kan jeg blandt andet gøre ved at lave en brainstorm om mig selv og lave field research.

Jeg startede ud med at lave en Brainstorm, hvor jeg fandt ud hvad jeg fandt interessant at udforske.

Jeg fandt nogle virksomheder, som tilbød mine interesser og begyndte at research deres værdier og historie.

Interpretation fasen

Interpretation fasen, prøver jeg at forstå alt den information jeg har fået samlet mig. Jeg lavede et Visual board af mine tanker, for at få et overblik af hvad det var jeg prøvede at kommunikere om mig selv. Jeg fandt en masse fede illustratoner og ting jeg synes var fedt. Her samlede jeg det sammen og fik en forståelse for hvad det var jeg havde en passion for.

Herfra fik jeg en idé om hvad der var vigtigt at jeg kommunikerede og hvad for en tone jeg skulle udstråle. Min tone skulle specielt udstråle mit sind, stil og kreativitet, så jeg står ud og viser at jeg kan byde på nye og moderne løsninger.

Med det valgte jeg en virksomhed: MorningTrain og udformede en persona, om en fiktiv person der eventuelt skulle ansætte mig.

Som den afsluttende del af fasen, lavede jeg et moodbord for at få visulaseret det endelige udtryk af min præsentationsportofolio.

Ideation fasen

I ideation fasen begyndte jeg specielt at producere diverse sketches både omkring hvordan hjemmesiden skulle se ud, men også hvordan dens funktioner skulle fungere. Jeg bragte så mange idéer jeg kunde til bordet, som muligt og designet med Gestalt principperne i sinde.

Når jeg følte at jeg havde den overordnet struktur planlagt, begyndte jeg at lave en low fi prototype op for at se det digitalt. Jeg arbejde specielt med C.R.A.P her og Gestalt principperne der elementerne i deres mest basiske form gør det nemmere for mig at arbejde med deres afstand og sammensætninger.

Derefter lavede jeg en higher-fi prototype, for at tjekke om afstande var fint også med tekst, der når boksene bliver lavet om til tekst ændre på atmosfæren.

Desuden brugte jeg også Kanlyemodellen AIDA, for at struktuere mit budskab til de besøgende med noget der skaber opmærksomhed, fanger deres interesse giver dem ønsker og til sidst bider på og kontakter mig.

Med struktueren på plads, hev jeg farverne ud fra mit moodboard og begyndte at definere mit design.

Med tilestyle på plads, begyndte jeg at pålægge min struktur farver og design.

Expermitation fasen

Det endelige mockup passer perfekt i forhold til de detaljer, der er gennemgået tidligere i processen.

Jeg har lagt stærk vægt på min kreativitet, samt min moderne tilgang til Webdesigns.

Designet følger også C.R.A.P modellen tydeligt, med godt hierarki ved hjælp af contrast, alignment og whitespace.

Teknologier

For at sætte hjemmesiden op til Web, har jeg valgt at kode min hjemmeside i HTML5 og bruge CSS til styling.

HTML5 var designet til at overkomme mange af de problemer HTML4 havde, som XHTML også prøvede på. Dog har HTML5 endnu flere features, som gør den mere relevant samt dens semantiske elementer.

Flex og Grid
Inden for CSS har jeg brugt en blanding af Flex og Grid til at strukturere mine elementer.

Media Queries
Har anvendt media quarries til at gøre min hjemmeside responsive, så den fungere på mobilen også.

Validators
Jeg har brugt Markup Validation Service og CSS Validation Service fra W3C, til at sikre mig at min kode følger standarderne.

Kun et 1 element følger ikke CSS validation, fordi den er ret ny og firefox ikke understøtter den endnu: backdrop-filter: blur(5px), denne feature bliver dog permanent hos alle browsere.

Exploration fasen

User test af portfolio setup
På grund af Corona var testen opsat online. Brugeren blev forklaret, at der ikke fandtes forkerte svar og de skulle forsøge at navigere hjemmesiden, imens deres skræm blev delt.

Resultater
Der var problemer med at skulle scroll hele vejen ned eller op, for at kunne få tilgang til navigationen, hvilket skabte en smule frustrerende oplevelse.

Næste iteration
Enten få hovedmenuen til at være fixed til toppen af siden, eller have en knap der giver en hele vejen tilbage til top menuen. Sticky menu foretrækkes.

Refleksioner

Inden jeg startede på uddannelsen, havde jeg allerede en god del kompetencer for mange af fagene vi får. Jeg har allerede web-integrator og mediegrafiker uddannelsen, som jeg begge har bestået med 10 og 12 tal. Så man kan måske godt undre sig over hvorfor jeg har valgt at tage denne uddannelse, men sagen er, at stadig føler mig svag inden for dokumentation’s og argumentations delen af at være designer, det med at skulle tænke over sine valg og researche sig frem til det bedste resultat.

Jeg ønsker at blive en UX UI / Webdesigner, hvilket passer meget godt ind i multimediedesigner uddannelsen, jeg føler at jeg er blevet godt udfordret inden for dokumentations skrivning og ville ønske jeg kunne få mere vejledningen inden for dét, da jeg stadig er usikker på om jeg gør det rigtigt og om det jeg laver giver mening.

Jeg har lært en masse nye ting og er blevet præsenteret for flere modeller jeg hidtil ikke har hørt om, som kommer til at hjælpe mig fremad i den retning jeg gerne vil, som også er noget jeg gerne vil grave mig dybere ned i efterhånden, som vi bruger modellerne. Så jeg er glad for stadig at kunne udvikle mig fagmæssigt, da det var en af mine bekymringer i multimediedesigner uddannelsen. Jeg ser frem til at blive en dygtig Webdesigner.