Hei!

Kjartan Bjørndal MichalsenInteraksjonsdesigner Logica UX

User Experience - Brukeropplevelse

Mobil: 40454554Mail: k@kjartan.info / kjartan@ux.no Twitter: @liksomGtalk: michalsen@gmail.comSkype: kjartan.michalsen

Peppes Pizza

Digital redaksjonell design.

Redaksjonell design på digitale flater.

Nye media.Design.

Media, medium.Gresk: medius = i midten

Interpersonlige media

• Hver deltager i kommunikasjonen har lik kontroll over innholdet som blir kommunisert. • Innholdet blir individualisert til det enkelte individ.

Massemedia

• Nøyaktig det samme innholdet går til alle mottakere • Den som sender har absolutt kontroll over innholdet og form

Nye media

• Unik tilpasset informasjon kan samtidig leveres til uendelig mange mennesker. • Alle individene involvert i kommunikasjonen har lik kontroll over innholdet.

Nøkkelegenskaper - Nye media

1. Nummerisk Representasjon: Kan beskrives matematisk. Et nye media objekt kan manipuleres algoritmisk.

Nøkkelegenskaper - Nye media

2. Modularitet: Mediaelementer er samlinger av kvantifiserbare diskret målinger. Disse objektene kan igjen danne større objekter uten å miste sine identiteter.

Nøkkelegenskaper - Nye media

3. Automatisering: Den nummeriske representasjone og den modulære strukturen tillater automatisering av mange av operasjonene involvert i skapingen og manipulering av mediainnhold. Det tillater også indexering og strukturering av mediaobjekt, og dermed nye muligheter for å søke etter objekt.

Nøkkelegenskaper - Nye media

4. Variasjoner: Et nye media objekt er ikke noe som er fiksert, det er noe som kan eksistere i ulike, potensielt uendelige variasjoner. Dette er en konsekvens av den nummeriske representasjonen.

Nøkkelegenskaper - Nye media

5. Transkoding: Nye media objekt har to ulike lag: Det kulturelle laget og det digitale laget. Den kulturelle forståelsen av mediaobjektet, og den digital datastrømmen som tilsammen lager mediaobjektet.

Det digitale laget påvirker det kulturelle laget, ved at datamaskinen modellerer verden, representerer data og gir oss mulighet til å manipulere innholdet.

Transkoding oppstår når man man tar media objektet og presenterer det samme digitale innholdet på nye måter i det kulturelle laget.

De to lagene påvirker hverandre, og henger sammen.

Konflikten

Konflikten

Tradisjonell billedlig illusjonisme siden renessansen – skjermen (bildet, maleriet) er et vindu til et virtuelt rom. Noe å se inn i, men ikke interagere med.

Konflikten

Ny konvensjon fra 1981 – grafiske grensesnitt på dataskjerm.

Skjermen har et klart definert sett med kontroller, og blir derfor et virtuelt instrumentpanel.

Konflikten

Skjermen blir en slagmark for flere inkompatible definisjoner – Dybde / overflate, transparens / gjennomsiktighet og bilde som romlig illusjon / instrumentpanel for handling.

Bare fordi det vises på en skjerm, er det ikke nødvendigvis nye media.

Interaktivitet - interaksjon

Respons til menneskelig fysisk manipulering som berøring, bevegelse, kroppsspråk, lyd eller andre endringer i fysiologiske status.

Interaktivitet

I interaksjonsprosessen bestemmer brukeren hvilke element man skal vise eller hvilken sti man skal følge.

Interaktivitet

Med dette oppstår en unik variasjon av arbeidet.

Brukeren blir således medskaper av arbeidet.

Interaktivitet – Åpen / lukket

Åpen – Elementene og strukturen blir enten modifisert eller generert der og da.

Lukket – Fikserte elementer arrangert i en satt tre-struktur.

Flyt (Flow)

Den mest interaktive formen for bruker til datamaskin kommunikasjon kalles ofte flow. Når brukeren oppnår flow, kontrollerer de datamaskinen med en slik flyt at datamaskinen blir transparent.

Flyt (Flow)

Mål: Digital redaksjonell design som er så bra at brukeren glemmer at han leser på en datamaskin/iPad/mobil/tablet/kindle/...

Verktøy for digital Redaksjonell Design

<h1>Overskrift</h1>

<p> lorem ipsum dolor sit amet </p>

Interaktiv powerpoint(Eller google docs presentation)

Side A

Side B

Side C

Side A

Tilbake til menyen

Side B

Tilbake til menyen

Side C

Tilbake til menyen

Design

Tips.Triks.Trender.

Typografi

Store, lesbare, spennende fonter.Bruk luft - uendelig lerret, brukerne scroller.På web – bruk typekit

Farger

Kontrast for lesbarhet.Flere farger. Komplimentærfarger.Gradienter.Transparens.Lyse farger.

Bilder & video

Store bilder. Slideshow. Mulighet for fullskjermsvisningIllustrativt stillbilde til brukeren velger å starte video

Touch-interaksjon

Store, tydelige knapper.Swipe og andre former for alternativ interaksjon

Animasjoner

Korte, raske introanimasjoner på scenenAnimasjoner på bevegelse (fra mus eller touch)Illustrasjonsanimasjoner.

Informasjonsgrafikk

Illustrasjoner og grafikk som raskt gir leseren oversiktInteraktiv informasjonsgrafikk

Hold det enkelt

MinimalistiskFokus på det viktigste

.. men glem smilende amerikanske mennesker og andre generiske bilder fra bildebyråer.

Eksempler

http://d7.no/khib

Workshopoppgave

Vinmonopolets magasin vinbladet.Lage interaktiv versjon av whiskey-feature.Lenker mellom de to sakene. Skal vise kommentarer fra brukere.Lag for iPad eller skjerm i valgfritt program.

http://d7.no/khibws og http://d7.no/khibws2