NKF web design 1

Introduksjonskurs iweb design 1.0

HistorikkKundeanalyseInformasjonsarkitektur

Are SlevelandVJU Brand and Business Innovation

Are Sleveland

Melvær& Lien VJUHaave ReklamebyråMin Design

MMM

1997 2012

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://vju.no/

http://apps.no

http://apps.no

http://apps.no

Egersund

Grøsfjell Slakterforretning

Design følelsen av et nettsted

God design løser oppgaver, påvirkerog skaper verdi

Hovedfaser

1. Informasjonsarkitektur

2. Wireframing

3. Design

- Planlegge nettside

- Lage skisser

- Visuell kommunikasjon

- Every pixel counts

- Responsivt design

- Bildekonvertering

- Sosiale medier

- Apps vs web

Dagen idag

1. Print vs web2. Introduksjon3. Historikk4. Online designer5. Utlevering av oppgave6. Kundebrief7. Planlegge webside struktur

Print

Statisk innhold

Begrenset Interaktiv

mye design kontroll

Tekst, bilder, former, tekstur

Fastsatt etter publisering

Kostbar publiserings prosess

1-veis kommunikasjon

Web

Dynamisk innhold

Svært interaktiv

mindre design kontroll

Tekst, bilder, former, tekstur, audio, video, animation

Justerbar etter publisering

Billig og direkte publisering

2-veis kommunikasjon

250 år

Sir Tim Berner Lee

http://livepage.apple.com/



If you can't link to it, like it, tweet about it...If you don't put it on the web, you lose.

Sir Tim Berner Lee

publisertinnhold

bruker-generertinnhold

45 millioner brukere

1996

«Read-only web»

Web 1.0

250.000 sider

http://www.angelfire.com/super/badwebs/





























































































































publisertinnhold

bruker-generertinnhold

1 milliard+ brukere

2006

«Read-write web»

Web 2.0

80.000.000 sider

http://facebook.com/

http://facebook.com/

http://behance.net/

http://behance.net/

Web 3.0

Eric Schmidt - Google

«Web 3.0 ultimatelywill be seen as applications that are pieced together»

Augmentet RealityEt bindeledd mellom virkelig og virtuell verden

http://folken.no/

http://folken.no/

http://folken.no/

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

Informasjonsarkitektur

Gjør det enkelt for brukeren å finne fram

Gjør det lett å skjønne hvor nytt innhold hører hjemme.

Er skalerbar, så den kan utvides med nytt innhold uten at du trenger å bygge den om.

Innhold ikke blir duplisert i løsningen.

Informasjonsarkitektur

Education

NKF web design 1