Projekt 5 Eksamens opgave Re-design af portfolio Af Jonas Lunding

Transkript

1 Projekt 5 Eksamens opgave Re-design af portfolio Af Jonas Lunding

2 BRAINSTORM Tema: Vinter, alaska, bjerge, blå & hvide farver. Farver: Colourlovers eksempler: Side-design: Menu i toppen, der er låst til skærmen uanset hvor du scroller hen, én lang side. Måske små under emner ved portfolio delen: 1. Semester, 2. Semester, Egne projekter. Menu punkter: Forside, Portfolio, Kompetencer, Om mig, Kontakt Billeder: Bjerge, træer - billederne skal være tegnet. Logo: Et træ med mit navn Ting at overveje: Engelsk eller Dansk, eller mulighed for begge. OPDATERINGSGRUNDLAG Tankerne bag mit wordpress portfolio var, at give et lyst og lækkert design, der var nemt at orientere sig igennem. Jeg valgte at bruge farverne brun og hvid, da det giver en god kontrast, hvor på jeg kunne lave sort tekst på den hvide og hvid tekst på den brune baggrund. Billederne er nogle jeg har hentet fra Deviantart.com, som passer godt ind i den konstruktion jeg har lavet på siden. På baggrund af den moderne verden, med smartphones, tablets etc., valgte jeg derfor at lave et responsive design, der kunne anvendes på en pæn måde på alle apparater, uden at det havde store konsekvenser for designet og opsætningen. Jeg har efterfølgende valgt at bruge min brugertest og egne idéer til at udforme et nyt og forbedret portfolio i HTML5, CSS3 og Jquery.

3 BRUGERTEST RESULTAT Igennem min brugertest søgte jeg at finde ud af, hvad ville gøre siden mere overskuelig. Der var flere testerpersoner der mente at der kunne ændres på kompetence og lærings delen af hjemmesiden. Desuden var der enighed i brugertesten mellem testpersonerne, at jeg gerne måtte lave siden anderledes i farverne, da hvide sider er meget anvendt i dag, og det gør dem lidt kedelige. Desuden var der også eftersøgning på tydelig kontakt information, da to ud af fem testpersoner, gerne ville have nemt ved at kontakte mig, hvis de skulle bruge mine kompetencer. Jeg har anvendt 5 testpersoner i alderen år, som jeg intet personligt kendskab har til De stillede spørgsmål til brugertesten lød: Du er på hjemmesiden, hvad er det første du lægger mærke til? Hvor kan menuen findes? Er den nem at finde? Er den overskuelig? Du har set side 1 nu, hvad kan du godt lide og hvad kan du mindre godt lide? Du har set side 2 portfolio-delen, hvad er dit indtryk? Er der nogle ting du savner på siden? Du har set side 3, hvad ser du her og er det overskueligt? Hvad er din vurdering af denne side? Side 4 kompetencer, er en side med kompetencer, er den overskuelig? Hvad ville du ændre? Til sidst, hvad kan du bedst lide og hvad kan du mindst lide ved siden?

4 PLAN OG PROCESS Opgave 1 Lave et brugbart layout, der er klar til indhold. En tidshorisont for indholds arbejdet. Ugeplanlægning Uge 1: Mandag PLANLÆGNING AF PROJEKTET, SIDE OPSÆTNING OG INDHOLDS SKRIVNING Tirsdag MENU OG NAVIGATION (RESPONSIVE) Onsdag ARBEJDE MED GAMLE PROJEKTER DEL 1 Torsdag MODELLÉR LOGO OG TILPASNING AF DET PÅ SIDEN Fredag ARBEJDE MED GAMLE PROJEKTER DEL 2 Lørdag FRI DAG Søndag ARBEJDE MED GAMLE PROJEKTER DEL 3 Uge 2: Mandag TILPASNING OG OPFØLGNING Tirsdag FINPUSNING evt. TILFØJE LÆKRE DETALJER (OPSUMMERING MED MADS) Onsdag ARBEJDE MED GAMLE PROJEKTER DEL 4 Torsdag FINPUSNING KLAR TIL AFLEVERING Fredag AFLEVERINGSDAG

5 SIDEOPSÆTNING SIDE 1 INTRODUKTION Et stort logo eller et billed SIDE 2 - PROJEKTER (med mulighed for at udvide) Side sem., Wordpress portfolio Side sem., gamedesign Side sem., JB plast hjemmeside Side sem., KBH SSF hjemmeside SIDE 3 - KOMPETENCER SIDE 4 OM MIG OG KONTAKT INFORMATIONER SIDE 1 Stort logo eller et billed SIDE 2 De 4 mest relevante projekter. (Med mulighed for at udvide) SIDE 3 Kompetence niveau sat op, så det fremstår klart hvor jeg er lige nu. (Med mulighed for at udvikle med dato og udvikling) SIDE 4 Kort om mig og hvad der interessere mig mest ved mit studie.

6 LOGO OG DESIGN Website design Jeg har valgt at lave et fullpage design, hvor jeg har brugt fullpage plug-in 1, til at optimere mit ønske, om en fullpage hjemmeside med slides. Jeg havde ikke selv prøvet at lave en før, så derfor valgte jeg at designe en, ud fra et plug-in, og lave mine version af sådan en side. Jeg har derefter valgt at lave det tema, jeg havde udtænkt fra starten, et gråt bjerg tema. Jeg kan godt lide de grålige farver jeg har valgt, da jeg syntes det er det nye sort. Desuden havde mine brugertestere også sagt, at de syntes en hvid farver ville ligne for meget, mange andre sider. Det har bestemt også en betydning for mig, at min side er lidt unik, for det er hvad jeg selv syntes, mine designs er. Logo design Mit logo er udtænkt, som et symbol for min nuværende situation, som studerende. Et træ symbolisere liv og udvikling, og det har derfor været min tanke lige fra starten, at det skulle være mit logo. Den hvide farve er valgt for, at give logoet en kontrast på siden. 1

7 Læringsproces Projekt 5 Eksamens Opgave Kort beskrivelse Jeg har i denne opgave skulle forbedre/optimere de forrige projekter, med forbehold for det feedback vi har fået på opgaverne. Det har derfor været mit mål at optimere de mest nødvendige kommentarer vi har fået på projekterne. Projektet har også omhandlet min personlige portfolio, som jeg skulle lave fra bunden denne gang, og det har været en lærerig oplevelse, at prøve at få lavet det helt rigtige design fra bunden. Jeg har udviklet mig gevaldigt på det vigtigste punkter, nemlig mine egne interesse punkter, som er framework og kodning. Kompetence udvikling Diagramtitel Planlægnig og process Photoshop Jquery HTML5,CSS3 0% 10% 20% 30% 40% 50% 60% 70% Før Efter Tilbage til siden