Dokumentation
Min dokumentation af arbejdsmetoder og udvikling i min portfolio
Portfolio udvikling
Projektplan
I starten af projektet udarbejdede jeg en Gantt model, hvor jeg definerede mål, krav og deadlinesprioritering af opgaver.
Jeg udarbejdede også PBS, WBS og OBS. Dette gav mig et overblik og sikrede, at jeg kunne arbejde struktureret gennem hele forløbet. Formålet var at skabe et personligt portfolio-website, der præsenterer mine projekter, mig som designer og min faglige udvikling.
Projektplanen tog udgangspunkt i en faseopdelt proces bestående af research, idéudvikling, design, prototyping, kodning og evaluering.
Research & ideudvikling
For at få inspiration til udtryk, researchede jeg forskellige portfolio-websites med fokus på minimalistisk design og personlig branding.
Jeg lavede derudover moodboards med farver, billeder og typografi-eksempler, der hjalp mig med at finde retningen for mit visuelle udtryk.
Under idéudviklingen brugte jeg skitser og wireframes for at afprøve forskellige layoutstrukturer. Fokus var at skabe et site, der både viser kreativitet og professionalisme, uden at det føles rodet.
Styletile
Styletile er anvendt til at fastlægge det visuelle udtryk for min portfolio inden den endelige design- og udviklingsfase.
Mit style tile samlede alle mine visuelle valg ét sted: farver, logo, typografi, elementer og billeder.
På den måde kunne jeg kunne bevare designet gennem hele processen.
Style tile-arbejdet gjorde det lettere at navigere mellem kreative valg og sikre, at alt visuelt hænger sammen fra start til slut.
Kodning
Websitet er udviklet i VS Code med HTML og CSS.
Hvor jeg har arbejdet med semantisk HTML-struktur, responsivt design med mobile-first princippet og tilgængelighed.
Jeg har fokuseret på at skabe en brugervenlig navigation med en venstrestillet sidebar og overskuelige sektioner.
Målgruppe
Målgruppen er primært potentielle arbejdsgivere og praktiksteder og undervisere der skal bedømme mit arbejde.
Websitets design, struktur og indhold er tilpasset målgruppens behov for hurtigt overblik, tydelig formidling af kompetencer. Samt et visuelt udtryk, der signalerer kreativitet og faglighed.
Layout
Layoutet er simpelt, luftigt og opdelt i tydelige sektioner, så brugeren let kan navigere rundt.
Jeg har arbejdet med whitespace for at give ro og fokus på indholdet.
Visuelt har jeg kombineret runde elementer, ikoner og illustrerede baggrunds-mønstre for at give sitet personlighed.
Cards
Cards er implementeret for at formidle projekter og flow-arbejde i et overskueligt og modulariseret format.
Card-designet gør det nemt for brugeren at skimme indhold, samtidig med at det understøtter et responsivt layout.
Denne komponentbaserede tilgang gør websitet fleksibelt og udvidelsesvenligt.
Informationsarkitektur
Informationsarkitekturen er udviklet med fokus på klarhed og logik.
Websitet er opdelt i tre hovedsektioner: Om mig, Portfolio og Kontakt. Portfolioen er yderligere struktureret i flows og egne projekter for at synliggøre både arbejdsprocessens faser og de færdige produktioner.
Sidebar-navigationen gør strukturen gennemskuelig og forbedrer brugervenligheden.
Websitets samlede arkitektur
Den samlede arkitektur er et resultat af en sammenhængende og brugerdrevet designproces.
Der kombinerer moderne visuel designpraksis, klar informationsstruktur og teknisk velfungerende implementering.
Hjemmesiden fungerer som en helhedsorienteret præsentation af min faglighed som multimediedesigner og afspejler min evne til at arbejde målrettet, analytisk og kreativt med digitale løsninger.
Modeller og teori
AIDA-modellen
Attention: Hero-billedet med en personlig præsentation
Interest: Min "Om mig" sektion og visuelle portfolio-kort
Desire: Uddybning af mine projekter og min proces
Action: Kontaktformularen og sociale medier i footeren
CRAP-modellen
Contrast: Lys baggrund + mørke elementer, forskel i typografier
Repetition: Genbrug af farver, knapper, cirkler og ikoner
Alignment: Struktureret grid med tydelige linjer
Proximity: Relaterede elementer er grupperet tæt sammen
Gestalt-lovene
Nærhedsloven: Sektioner er opdelt med afstand
Lighedsloven: Faste stilregler gør siderne genkendelige
Kontinuitet: Brugerens øje guides ned gennem siderne
Figur/grund: Tydelige kontraster mellem kort og baggrund
Styleguide
Styleguide
Min styleguide fungerer som et fast referencesæt for websitets visuelle og typografiske standarder.
Formålet er at skabe et konsistent og genkendeligt visuelt udtryk samt sikre, at designet kan udvides uden at miste sin identitet.
Styleguiden har således været et centralt værktøj i både design- og udviklingsfasen.
Farver
Farvepaletten er udviklet med afsæt i farveteori og visuel kommunikation.
Jeg valgte en afdæmpet, harmonisk og moderne palette, der understøtter websitets professionelle udtryk og samtidig sikrer høj læsbarhed.
Farvevalget understøtter brandets identitet uden at overdøve indholdet, som er centralt i et portfolio.
Logo
Mit logo er designet ud fra en minimalistisk, typografisk tilgang, der afspejler mit visuelle DNA som designer.
Jeg har lagt vægt på skalerbarhed, genkendelighed og funktionalitet, så logoet fungerer konsistent på tværs af digitale kontekster.
Logoet bidrager til websitets helhedsidentitet og skaber en professionel visuel ramme om indholdet.
Typografi
Jeg valgte Gelicia som primær typografi, fordi den kombinerer modernitet med et elegant, håndtegnet udtryk.
Den fungerer godt til overskrifter, hvor den skaber personlighed og blødhed.
Typografivalget understøtter min branding: personlig, kreativ og moderne.
Grids
Grid-systemet fungerer som en strukturel rygrad i layoutet.
Ved at benytte grids har jeg sikret et harmonisk og konsistent visuelt udtryk, hvor elementernes placering fremstår kontrolleret og afbalanceret.
Dette styrker både det æstetiske og funktionelle niveau af designet.
Tone of voice
Sproget på s0phie.dk er professionelt og personligt.
Kommunikationen er klar, direkte og let tilgængelig med fokus på formidling af designprocesser og faglighed.
Tone of voice understøtter websitets visuelle udtryk og sikrer et konsistent og troværdigt brand på tværs af alle sider.