NKF web design 2

Introduksjonskurs iweb design 2.0

Responsivt designSkjermoppløsningWireframes

Are SlevelandVJU Brand and Business Innovation

Dagen igår

1. Introduksjon2. Historikk3. Kundeanalyse4. Informasjonsarkitektur

Kundebrief8-punkts modellen

1. Hva er målet?

- Letter å navigere- Mer brukervennlig- Innbydende- Sterkere identitet- Forenklet - ta vekk unødvendig informasjon- Få fram det viktigste på forsiden- Vise bredde. Grottene og Akvariet.- Mer bruk av lokalene

2. Hvem snakker vi til?

- Studenter- Konsertgjengere

3. Hva hindrer oss i å nå målet?

- Ulike interne oppfatninger- Forvirrende identitet- Tung strukturert nettside- For mye informasjon på forsiden- Utdatert informasjon- Lange tekster

4. Hva kan vi gjøre?

- Rydde i strukturen- Forenkle budskap- Fjerne unødvendig informasjon- Gjøre alle lokalene tydeligere- Fremheve Grottene som et fritidssted

5. Hva mener de om oss?

- Svart og skummelt- Skittent- Snevert tilbud - Jeg passer ikke inn her- Lite gjennomført

6. Hva vil vi de skal mene?

- Åpent for alle- Ikke bare konserter- Billig utested for studenter- Samlingspunkt- Bredt tilbud

7. Hva kan vi kommunisere?

- Billig for studenter- Varierte tilbud- Alle rettigheter i Grottene- Åpent for alle

8. Hvordan kan vi si det?

- Reindyrke image- Klarere struktur- Bevisst på budskap- Happy Hour- God gjenkjennelses effekt. Nett, Facebook, Twitter

Dagen idag

1. Inspirasjon2. Fonter3. Skjermoppløsning4. Responsivt design5. Grid6. Wireframes

Inspirasjon

http://moma.org/

http://moma.org/

http://moma.org/

Sikker typografi

Responsivt webdesign,et landskap i endring

1024 px

768 px

Men... nettet er ikkeslik lenger

1280x960 px1024x768 px800x600px

1920x1280px1680x1050px

1366x768 px1280x760 px

1024x768 px

960x640 px

26 %

56 %

2 %

16 %

1024x768 1280x800++ 800x600 Andre

Skjermoppløsning

960x600 px

Nettstedet bør fungere på telefoner og nettbrett

Antall smarttelefoner i Norge

Bruk av internett på mobil

Egne mobilnettsteder

m.vg.no

touch.vg.no

vg.no

Et nettsted

vg.no

http://jotul.no

http://jotul.no

http://jotul.no

http://kreftforeningen.no/



http://bi.edu/

http://bi.edu/

http://bi.edu/

12 part grid

12 part grid

12 part grid

12 part grid

12 part grid

12 part grid

12 part grid

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

http://moma.org/

Wireframing

Informasjonsarkitektur

Education

NKF web design 2