Oblig. 06 Visuell fremstilling

En del av obligatorisk 06 var å skape en visuell fremstilling (knyttet til historien bak HTML og/eller CSS). Jeg valgte å lage en enkel illustrasjon.

Tanken bak min visuell fremstilling var å skape en litt annerledes tidslinje over utviklingen av HTML og CSS. Med en alfakrøll/snabel-a som en sirkulær tidslinje (som samtidig skal symbolisere internett) og med tekstlinjer med info som går ut fra denne. Jeg ville skape noe enkelt men samtidig noe som kunne oppfattes som dynamisk selv om det var statisk. (Hadde jeg hatt mer kunnskap og tid ville jeg gjerne laget denne dynamisk)

Oblig. 06 Navigasjon

Jeg valgte et design på nettsiden som krevde en vertikal meny.
Nettsiden jeg skapte designet jeg i Photoshop og brukte slice tool før jeg deretter satt den sammen igjen i Dreamweaver. Menyen er derfor knapper jeg lagde i Photoshop, og disse knappene plasserte jeg på nettsiden ved hjelp av CSS.

Jeg var litt usikker på om jeg skulle velge en vertikal meny til å begynne med, da det virker som om det blir først og fremst brukt når man har menyer som tar plass (og jeg skulle ha en enkel meny uten mye innhold). Men etter å ha lest artikkelen “Showcase of beautiful vertical navigation designs” på nettsiden Smashing Magazine hoppet jeg ut i det.

Jeg valgte også å benytte meg av en mouseover effekt, da jeg synes dette er en fin måte å gjøre menyen mer dynamisk og spennende på en enkel måte. Brunfargen på effekten har jeg hentet ut ifra bakgrunnen på siden.

Oblig. 06 font & farger

Typografi
Til dette prosjektet valgte jeg å benytte meg av 3 ulike fonter.
Jeg valgte disse tre fontene først og fremst ut av at det er tydelig forskjell mellom alle tre, og de passer fint sammen.

Overskrifter har fonten Lobster (som jeg bruker via Google Web Fonts), denne fonten valgte jeg fordi jeg ville ha en dekorativ font som skilte seg litt ut og sto i stil sammen med resten av designet mitt. Lobster er en håndskreven/fantasy font.

Til underoverskriftene har jeg benyttet meg av fonten Arial Black, da dette er en veldig tydelig og lettleselig font. Arial Black er en neo-grotesk sans-seriff font.

Til mengdetekst valgte jeg Palatino, mye på grunn av at seriff fonter er best leselig og Palatino er en av seriff fontene jeg liker best.

 

Fargebruk

Jeg skapte en mørk bakgrunn og har lekt mye med mørk-lys kontrast og blandet duse brune farger inn i dette for å skape harmoni og myke opp den sterke mørk-lys kontrasten. Fargene jeg valgte å benytte meg av danner en nøytral dempet fargepalett og passer sammen til den nøytrale bakgrunnen jeg bruker på nettsiden.

Oblig. 06 Forproduksjon

06 – Enkelt Nettsted.

Jeg jobbet mye med forproduksjonen av dette prosjektet og gikk igjennom alle relevante punkter i arbeidsgjennomgangen på Moodle. Etter å ha fått konkretisert prosjektet skapte jeg en sitemap for å skape en oversikt.

Deretter satte jeg sammen et moodboard av ulike nettsider for å få inspirasjon til mitt nettsted.

 

Tegnet så opp ideskisser over ulike (veldig enkle) wireframes.

 

Utifra ideskissene tegnet jeg opp wireframen litt mer nøyaktig (arbeidsskisser).

 

Og tilslutt skapte jeg en veldig røff presentasjonsskisse.