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 Lyngby
Indholdsfortegnelse PORTFOLIO... 3 MIN UDVIKLING... 3 PROJEKTPLANLÆGNING... 4 DET GAMLE DESIGN... 4 GANGSTERTEST... 5 DET NYE DESIGN... 6 WIREFRAME... 6 SKITSER... 7 INFORMATIONS ARKITEKTUR... 11 DESIGNPRINCIPPER... 11 FARVEVALG... 12 TYPOGRAFI... 12 2
Portfolio Portfolio er en mappe eller et website der indeholder de materialer, som man gerne vil vise frem. Det er nogle projekter, som man har haft arbejdet på, og som man gerne vil vise frem for eventuelle kunder. Altså, en portfolio skal vise det arbejde man har arbejdet med og vise ens tidslinje. På den måde kan man hurtig få et overblik over hvad man ligger inde med. Min udvikling Da jeg startede på uddannelsen havde jeg ikke en speciel stor viden om hvad de forventede på uddannelsen eller om hvilke redskaber vi skulle benytte os af. Da vi blev præsenteret for fagene, var det meget fremmed sprog for mig. Men, som det hele udviklede sig blev det hele meget mere genkendeligt og meget spændende. Jeg vidste fra begyndelsen at det var den rigtige linje, og at der ville vente mig en masse udfordringer. Da jeg ikke havde beskæftiget mig med Adobes programmer førhen var jeg fra begyndelsen på begynder niveau, men allerede efter 1. Semester er mine egenskaber indenfor redskaberne blevet øget. 3
Projektplanlægning Jeg har valgt at selv at lave et kort over min planlægning af mit projekt. Planlægningen har jeg brugt for selv at give mig nogle krav for hvornår tingene skulle være færdig. Det har derfor været mig en udfordring at skulle arbejde indenfor begrænsninger. Men, samtidig har det givet mig et større overblik over projektets forløb. Det gamle design Mit gamle design blev lavet i Wordpress, som var vores første projekt på uddannelsen. Wordpress et redskab til at støbe en hjemmeside, som gør det nemt at administrere. Word- Press giver en masse forslag til nogle ideer, og det er så derefter vores opgave at tilpasse siden. På den måde kan man skabe sin egen hjemmeside, og helt frit selv bestemme indholdet og hjemmesidens design. 4
Dette design var på det daværende tidspunkt et udgangspunkt i at gøre det enkelt og vise noget af min personlighed i den, ved at benytte de billeder jeg selv har haft taget. Gangstertest Gangstertesten foregår på den måde at man finder en underside, som en bruger skal navigere rundt fra. Til testen stiller man personen en række spørgsmål, som brugeren så skal navigere rundt på og tildeler point til hver spørgsmål, for at vise hvor svær eller hvor let det har været at finde. Jeg fandt en test person, som jeg stillede disse spørgsmål, og følgende er testpersonens svar. 1. Hvilke overordnet sektioner findes der på hjemmesiden? om mig, projekter, læring, kursusaktivitet og kontakt Point: 3 2. Er det nemt at finde vej til projekter? Ja, da det er et menupunkt. Point: 3 3. Hvilke muligheder har du på dette niveau? Jeg kan trykke på 1. semester, og så kan jeg se de forskellige projekter. Point: 3 4. Hvilken underside befinder du dig på? Bannerprojekt, som er tydeligt at se, da der er en overskrift på siden, og projekter er skrevet med fed, så jeg ved at bannerprojekt er inde under projekter. Ellers er det besværligt at se hvor man befinder sig, da der er ikke er nogle stig. Point: 2 5
5. Hvordan kommer du tilbage til forsiden? Jeg trykker på logoet, som er oppe i venstre hjørne. Point: 2 Gangstertesten har scoret 13 ud af 15 point, og man kan derfor sige at navigationen har været god. Det nye design Det nye design af min portfolio er bygget op fra bunden i HTML og CSS. Wireframe Wireframe bruges til at kunne se hvordan man har forstillet sig sin hjemmeside. Jeg har haft valgt at bygge min hjemmeside op af en header, div og footer. For mig er det med til at gøre siden enkel, som jeg ønsker. 6
Informations arkitektur Dette er et overblik over den struktur der er på min side og af de hierarkier i min portfolio. Designprincipper I min portfolio har jeg valgt at benytte mig af nogle design principper. Fra begyndelsen havde jeg gjort mig nogle overvejelser om genkendeligheden, enkelthed, nærhed, lukkethed og ensartethed. Man kan se genkendeligheden ved at jeg i hver side har gennemført Facebook, instagram og linkdin logoet, som for mange er en genkendelighed. Det er en genkendelighed, fordi der er så mange brugere der kender til siderne. Min portfolio er forholdsvis enkel, og det er fordi jeg har valgt at arbejde ud fra enkelthed. På den måde at tingene ikke er så komplekse, og derimod er enkelt. På min forside har jeg arbejdet med nærhed. Dette kan ses ved de fire billeder der er sat op ved siden af hinanden. De alle indeholder samme funktion, og danner derfor kontakt. På alle siderne er der også en hvis nærhed i menuen. Ved brug af boksene på mit website, har jeg arbejdet med lukkethed. Dette er for at ligge fokussen på indholdet. Det sidste designprincip jeg har arbejdet med er ensartethed. Forstået på den måde at du på hver side får det samme design præsenteret. 11
Farvevalg Mit nye Redesign af porteføljen indeholder ikke nogle dissideret farve, da jeg har valgt at benytte mig af et baggrundsbillede, som jeg selv har haft taget i december 2013. Jeg syntes mit baggrundsbillede skaber ro og balance i baggrunden. Det er også med at gøre websitet enkelt, og at man kun skal ligge fokus inde på div et, hvor min menu, logo, tekst osv. er. Jeg har dog valgt at gøre mit div hvidt, og en anelse gennemsigtig for at give siden lidt effekt. Typografi En af de mest brugte skrifttyper på internettet er Georgia. Skrifttypen er designet til skærmbrug og er en skrifttype mange brugere bruger. Mac: 97,48% Windows: 99,40% 1 Derfor har jeg valgt at bruge Georgia, som er i serie med Serif skrifttype. Jeg har valgt Georgia da det er let at læse og ligger naturligt i øjnene. 1 http://cssfontstack.com/ 12