INF1500 - Introduksjon til design, bruk, interaksjon Hva ... · INF1500 – Hva er HCI og hvorfor er det viktig? 1 18.08.15 INF1500 - Introduksjon til design, bruk, interaksjon Hva

18.08.15 1 INF1500 – Hva er HCI og hvorfor er det viktig?

INF1500 - Introduksjon til design, bruk, interaksjon Hva er HCI og hvorfor er det viktig? 18. august 2015 Institutt for Informatikk, Universitetet i Oslo [email protected]


Dagens forelesning • Øvelser!

• Hva kan man jobbe som når man er ferdigutdannet interaksjonsdesigner?

• Kort historie - del 1: Datamaskiners utvikling

• Human-Computer Interaction

• Interaksjon og interaksjonstyper

• Grensesnitt

• Kort historie - del 2: HCI - de fire bølgene

• Hva må vi gjøre for å designe godt?


Øvelser • Til sammen fire øvelser gjennom semesteret minst tre må leveres

• Alle øvelser finner dere i høyremenyen på emnesiden

• Består av 5-10 begreper som skal defineres

• Svarene finner dere i læreboken eller på forelesning

• Første øvelse skal leveres 30. august 2015 kl. 23.59 i Devilry


Lysark • Fargeforklaring på lysark:

• Rød – MÅ læres. Kjernepensum.

• Oransje – BØR læres. Statarisk pensum.

• Grønn – KAN læres. Kursorisk pensum.

• Grå – Tilleggslysark. Ikke pensum.

Definisjon: - På alle sider med definisjoner står definisjonen øverst i høyre hjørne


Nøkkelbegreper i dagens forelesning • HCI s. 19-20

• Interaksjon s. 23

• Interaksjonstyper:

• Instruerende interaksjon s. 24 • Konverserende interaksjon s. 25 • Manipulerende interaksjon s. 26 • Eksplorerende interaksjon s. 27

• Grensesnitt s. 28-29

• Antagelser s. 30

• Kontekst s. 35



Thomas Torp Leverte masteroppgaven sin i 2011 Hva var tema for din masteroppgave? Identification of user tasks in on-line TV Hvor jobber du nå? Og med hva? Oppstartselskapet Erupt AS (pelp.no), jobbet før i FINN.no. Jobber som programmerer og bruker bl.a. Java, Javascript, NodeJS, iOS i mitt arbeid. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Sammenhengen mellom det tekniske (programmeringen) og design/interaksjon.

Åshild Aaen Torpe Leverte masteroppgaven sin i 2012 Hva var tema for din masteroppgave? Skatteetaten på mobil: Fornying ved hjelp av deltakande design. Eg hadde som mål å utvikle prototypar for tenester av Skatteetaten til mobile enheter, med spesielt vekt på å gjennomføre ein deltakande desingprosess. Hvor jobber du nå? Og med hva? Eg jobber som seniorkonsultent i BEKK som interaksjonsdesigner. For tida sit eg hos SpareBank 1 og jobber med nye nettsider der. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Gruppearbeid - det å kunne samarbeide med kven som helst har vore godt å ha med seg i bagasjen frå studiene.


Helena Z. Pedersen Leverte masteroppgaven sin i 2013 Hva var tema for din masteroppgave? Brukergrensesnittet i Spotify og WiMP på mobil. Tittel: Music in The Air - en studie av streamingtjenestene Spotify og WiMP på mobil. Hvor jobber du nå? Og med hva? Jobber i Atomic Soul Booking AS, et av Norges største bookingbyråer. Jobber tett med våre artister på produksjons- og logistikksiden når de skal ut på turné, fesivaler og spille klubbkonserter rundt om i Norge. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Jobber per nå ikke med direkte tilknytning til studiene, men har alltid vært interessert i musikk, derfor ble det både tema for masteroppgaven min og arbeidsplassen min. Har lært mye om disiplin, struktur og stå-på-vilje, og at ingenting gjør seg selv!

Stian Ødegård Leverte masteroppgaven sin i 2013 Hva var tema for din masteroppgave? Visualisering av flytrafikk på flyplasser både på bakken og i lufta. Målet var å finne en løsning som ville hjelpe flygeledere å enklere ha kontroll på trafikksituasjonen. Hvor jobber du nå? Og med hva? Nå jobber jeg som testleder i SteriaBiometrics, som er en del av SopraSteria. Her driver vi å lager CSI-løsninger for politiet rundt om i verden. Det er en egen produktlinje som bli solgt til flere land rundt om. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Jeg har fått veldig god brukt for interaksjonsdesign og brukeropplevelser. Mye av jobben min er kvalitetsikring og sørge for at kundene får det de trenger. Da er det viktig å kunne sette seg inn i deres situasjon og tenke hvordan de til slutt ønsker å bruke løsningen vi lager.


Fredrikke Holthe Kvam Leverte masteroppgaven sin i 2014 Hva var tema for din masteroppgave? Smarthus og velferdsteknologi: Design av en løsning for eldre brukere. Hvor jobber du nå? Og med hva? Jobber nå for Accenture. For tiden har jeg rollen som interaksjonsdesigner og funksjonell arkitekt på et prosjekt hos en av kundene til Accenture. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Alt jeg lærte gjennom studiene gav meg et veldig godt grunnlag for å jobbe med interaksjonsdesign. Jeg fikk en god forståelse for omfanget interaksjonsdesign-faget dekker, og hvordan dette henger sammen med relaterte fagfelt.

Anja Simonsen Leverte masteroppgaven sin i 2014 Hva var tema for din masteroppgave? Design av personværnserklæringer for unge brukere av sosiale medier. Hvor jobber du nå? Og med hva? Nå jobber jeg i Visma Consulting. Er for tiden leid inn av Visma Software for å jobbe med et prosjekt hvor jeg er med å utvikle et skoleadministrativt system for videregående skoler. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Noe jeg lærte gjennom studiene som har vært viktig å ta med seg ut i arbeidslivet, har vært at graden av brukerinvolvering har mye å si for at resultatet av en løsning skal bli bra. I studietiden hadde jeg mye gruppearbeid og lærte å samarbeide med andre. Denne erfaringen har også vært veldig nyttig å ha med seg videre ut i arbeidslivet.


Julie Holmøy Leverte masteroppgaven sin i 2014 Hva var tema for din masteroppgave? Hvordan velferdsteknologi påvirker roller og institusjoner i helsefaglig sektor. Jeg tok i bruk metodikken tjenestedesign for å gjøre denne analysen. Hvor jobber du nå? Og med hva? Jeg jobber som UX designer i Ciber Norge. For tiden sitter jeg i et stort IT-prosjekt i offentlig sektor, som går ut på digitalisering av tjenester. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Være tålmodig, effektiv og utholdende i hektiske perioder, samt selvfølgelig en god del faglig relatert til UX design.

Aleksander Rem Levert e masteroppgaven sin i 2015 Hva var tema for din masteroppgave? Om balanse kan brukes som eneste form for input for å styre små elektriske kjøretøy. Hvor jobber du nå? Og med hva? Starter i jobb som IT konsulent hos Accenture nå i August. Skal jobbe som utvikler. Hovedsakelig webutvikling og systemutvikling. Hva var det viktigste du lærte gjennom studiene som du har fått nytte av i arbeidslivet? Det viktigste kommer nok til å bli programmeringskunnskapene jeg har fått, samt alt jeg har lært om det å jobbe på utviklingsprosjekter som smidige metoder og versjonshåndtering.


Kort historie – del 1 Om hvordan datamaskinen utviklet seg


Datamaskiner på 60- og 70-tallet • Datamaskinen var ennå ikke blitt personlig (PC) For dyre for enkeltpersoner og måtte deles

• Ble i all hovedsak brukt i større jobbsammenhenger i de største bedriften

• Paradigme: nettverk og timesharing ARPANET (starten på Internett) begynte i 1969

• Kommandolinjebaserte grensesnitt (teletype) tekstprosessering, e-post, delte systemer etc.

• 60-tallet: Behovet for designere var størst i programmeringsspråk og kommandolinjesystemer

• “Software crisis” uhåndterlige programmer brakte mer

• 70-tallet: Designernes fokus var på brukbarhet og vedlikeholdbarhet gjennom iterative prosesser og empirisk utprøving


Hullkort i kjeller'n og CYBER på Kjeller (Per Harald Jacobsen)

Da datamaskinene kom til UiO • 1966: Per Ofstad blir første datasjef ved UiO

• 1967: Hullkortanlegget CDC 3300 ankommer UiO

• 1968: Ole-Johan Dahl blir første dataprofessor ved UiO

Les mer her: http://www.muv.uio.no/uios-historie/fag/matematikk-naturvitenskap/informasjon-kommunikasjon/tidlig-ithistorie-phjacobsen.html



80-tallet og utover • Grafiske brukergrensesnitt (GUI) blir populært Windows, Icons, Menus, Pointers (WIMP)

• Multitasking blir en greie man gjøre flere ting samtidig

• Maskinen er plutselig mer enn en avansert kalkulator dialogpartner

• E-post blomstrer frem mennesker interagerer ikke nå bare med maskiner, men med hverandre gjennom maskiner

Apple Macintosh (1984) • Prosessor: 8 MHz • RAM: 128 KB • Skjerm: 9" Sort-hvitt • Oppløsning: 512 x 342px

• Grafisk grensesnitt • LaserWriter-skriver • Tredjepartsapplikasjoner

Pris?




Vår samhandling med maskiner forandrer seg

• Tastatur, mus og berøringsskjermer er kun artefakter av dagens teknologi

• Nye interaksjonsmuligheter for input og ouput vil forandre måten vi interagerer med maskiner på

• Hva vil fremtiden bringe?

Input Output

I gamle dager • Sammenkoblede kabler • Hullbånd og hullkort • Tastatur

• Lys på et display • Papir • Teletype

I dag

• Tastatur, mus og knapper • Haptiske skjermer • Mikrofon • Bevegelse

• Bit-mapped skjerm • Lyd • Terminal • Ubiquitous computing

I fremtiden? ? ?


Å se inn i fremtiden “When wireless is perfectly applied the whole earth will be converted into a huge brain, which in fact it is, all things being particles of a real and rhythmic whole. We shall be able to communicate with one another instantly, irrespective of distance.” — Nikola Tesla (1926)



Human-computer interaction (HCI)

• Idealistisk perspektiv: handler om å forstå og forandre måten vi interagerer med teknologi på

«Inventing the future, improving the present, creating experiences and changing the world for the better»

• Hva er man ekstra opptatt av innenfor HCI? • Forstå hvordan mennesker tenker, resonnerer, forstår, planlegger reagerer etc.

• Forstå hvordan mennesker er en del av en sosial struktur

• Forstå hvilke oppgaver mennesker ønsker å gjøre (arbeide, hvile, leke etc.)

• Forstå hvordan teknologien fungerer


Human-computer interaction (HCI)

• Ergo: HCI handler om mer enn bare interaksjon eller grensesnitt

• HCI er studien om: 1. Hvordan mennesker interagerer med maskiner 2. Hvorvidt maskiner er utviklet for vellykket interaksjon med mennesker

(ACM-definisjon) • Definisjonen er enkel dette kurset handler om hvorfor og hvordan

• Dere skal lære mer om teorier, modeller, prosesser, metoder, teknikker, prinsipper

• Fra og med neste semester skal dere begynne å bruke dette aktivt

Definisjoner: - HCI


En tverrfaglig disiplin

• "Computer science er det vi lærer på Ifi

• Vi trenger mye av den samme grunnkunnskapen (f.eks. INF1000)

• Men vi er ett av flere programmer som jobber i en tverrfaglig disiplin

• HCI er mye mer komplekst og uklart enn klassisk computer science


HCI: A community of communities

HCI is taught now in many departments/faculties that address information technology, including psychology, design, communication studies, cognitive science, information science, science and technology studies, geographical sciences, management information systems, and industrial, manufacturing, and systems engineering. HCI research and practice draws upon and integrates all of these perspectives. A result of this growth is that HCI is now less singularly focused with respect to core concepts and methods, problem areas and assumptions about infrastructures, applications, and types of users. Indeed, it no longer makes sense to regard HCI as a specialty of computer science; HCI has grown to be broader, larger and much more diverse than computer science itself. HCI expanded from its initial focus on individual and generic user behavior to include social and organizational computing, accessibility for the elderly, the cognitively and physically impaired, and for all people, and for the widest possible spectrum of human experiences and activities. It expanded from desktop office applications to include games, learning and education, commerce, health and medical applications, emergency planning and response, and systems to support collaboration and community. It expanded from early graphical user interfaces to include myriad interaction techniques and devices, multi-modal interactions, tool support for model-based user interface specification, and a host of emerging ubiquitous, handheld and context-aware interactions.

HCI is the name for a community of communities. (John M. Carroll)


Interaksjon

• Interaksjon er måten vi samhandler med maskinen på hvordan kommuniserer vi med maskinen?

• I kapittel 2.5 står det om fire hovedtyper for interaksjon: • Instruerende gi kommandoer og eller velge fra valgmeny

• Konverserende en samtalende dialog med systemet

• Manipulerende manipulering av objekter i virtuelt eller fysisk rom

• Eksplorerende bevegelse eller forflytning i virtuelle eller fysiske omgivelser

Definisjoner: - Interaksjon


Instruerende interaksjon

• Instruerende gi kommandoer og eller velge fra valgmeny

• Bruker instruerer systemet og forteller hva det skal gjøre oppgi tiden, printe en fil, vise en film etc.

• Grunnlaget for en rekke ulike enheter og systemer alt fra skriveprogrammer til brusautomater

• Fordelen er at instruksjoner støtter rask og effektiv interaksjon

• Godt egnet for repetitive handlinger på flere objekter

Definisjoner: - Instruerende


Konverserende interaksjon

• Konverserende en samtalende dialog med systemet

• Formålet er å simulere en samtale med en annen person

• Varierer fra enkel stemmegjenkjenning til mer komplekse «naturlige språk»-dialoger

• Brukes mye i søkemotorer, rådgivende systemer, hjelpesystemer etc.

• Et utbredt eksempel er virtuelle agenter: leker og kjeleroboter som er designet for å konversere med deg

• Spesielt nyttig når man har uerfarne brukere Får dem til å føle seg mer komfortable og avslappet, mindre redde

• Misforståelser kan oppstå når systemet ikke forstår hvordan den skal oppfatte en bruker

• PS. Viktig å ikke blande konverserende interaksjon med tale-basert grensesnitt

Definisjoner: - Konverserende


Manipulerende interaksjon

• Manipulerende manipulering av objekter i virtuelt eller fysisk rom

• Involverer typiske handlinger som dragging, selecting, opening, closing and zooming på virtuelle objekter

• Utnytter en brukers kjennskap til hvordan de beveger seg og manipulerer objekter i den fysiske verden

• Kan involvere fysiske objekter for å styre interaksjonen i en virtuell verden

• Lett for nybegynnere å lære seg systemet

Definisjoner: - Manipulerende


Eksplorerende interaksjon

• Eksplorerende bevegelse eller forflytning i virtuelle eller fysiske omgivelser

• Kalles også utforskende interaksjon

• Brukere beveger seg gjennom virtuelle eller fysiske omgivelser for å interagere

• I fysiske omgivelser bruker man sensorbasert teknologi for å fange input

Definisjoner: - Eksplorerende


Hva er et grensesnitt? • Et grensesnitt er kommunikasjonspunktet hvor to ulike systemer møtes og interagerer

• Støtter opp om interaksjonstypen ved å tilrettelegge for ønsket type samhandling

• Vi bruker betegnelsen til å omtale den måten brukeren interagere med systemet på

• Grensesnittet kan være touchbasert, talebasert, bevegelsesbasert etc.

• Det er lett å blande de engelske begrepene for grensesnitt / interaksjon – interface / interaction.

• Omtales nærmere i kapittel 6 i læreboken, spesielt de første delkapitlene

• (Vi kommer tilbake til dette om noen uker)


Ekstra forklaring: interaksjon vs. grensesnitt Interaksjon (interaction) • Hvordan vi interagerer med systemet • Hvordan brukere og systemet kommuniserer og gir hverandre tilbakemelding kommunikasjonsform • Fire interaksjonstyper: (1) Instruerende, (2) Konverserende, (3) Manipulerende og (4) Eksplorerende Les mer i kapittel 2 Interaksjonen beskriver kommunikasjonsformen mellom menneske og maskin, altså hvordan vi interagerer med et system. Fordi dette alene ikke nødvendigvis spesifiserer hvordan interaksjonen vil foregå i praksis, må vi også beskrive kontaktpunktet som kommunikasjonen foregår gjennom. Kontaktpunktet omtales som grensesnittet og beskriver hvordan interaksjonen manifesterer seg. En interaksjon kan f.eks. være konverserende uten at vi vet om det er en tekstlig dialog gjennom et WIMP-grensesnitt som IKEA-eksempelet i boka, eller om det er et talebasert grensesnitt slik som Siri på iPhone.

Grensesnitt (interface) • Grensesnittet beskriver kontaktpunktet/overgangen (border) som knytter menneske og system samme • Grensesnittet muliggjør interaksjonen • Grensesnittyper: WIMP, shareable, augmented reality, virtual reality, wearable, tangible, touch-based Se flere eksempler på s. 159 (4. utgaven) / s. 158 (3. utgave)


Å forstå problemområdet • Hva er det vi ønsker å lage?

• Hvilke antagelser gjør vi?

• Vil det oppnå det vi ønsker at det skal?

Rammeverk for å tenke rundt problemområdet (fra læreboka):

• Finnes det noen problemer med eksisterende produkter eller brukeropplevelser? Hvis ja, hva er de?

• Hvorfor tror du disse problemene finnes?

• Hvordan tror du at ditt foreslåtte design vil løse disse problemene?

• Hvis du designer nye brukeropplevelser – hvordan støtter ditt foreslåtte design forandring eller utvidelse av dagens måte å gjøre ting på.

• En god forståelse av problemområdet informerer godt design hva slags grensesnitt, oppførsel, funksjonalitet som må tilbys

Antagelse: Å ta noe for gitt når det krever videre undersøkelse

Definisjoner: - Antagelse


Kort historie – del 2 Om hvordan fagfeltet HCI har utviklet seg


Hvorfor oppstod HCI? • Etterhvert som arbeidsstasjoner og maskiner ble billigere ble menneskene mer viktige enn maskinene

• De beste grensesnittene ble modellert etter menneskenes behov fremfor maskinenes behov UCD (om to uker)

• Ideer ble til produkter gjennom generasjonen:

• «pioneer systems» utviklet innovative løsninger som ikke var kommersielt levedyktige

• «settler systems» inkorporerte velutviklede designløsninger mange år senere

• Folk blir mer kresne og godtok ikke lenger produkter med dårlig design

(S. Greenberg)


Her er vi i dag

HCI – de fire bølgene

• 1980: Brukerstøtte

• 1990: Brukbarhet

• 2000: Brukeropplevelser

• (2010): Bruksverdier


1980-tallet: Brukerstøtte • Maskiner ble hovedsakelig brukt til arbeid fokus på å bringe alt til skrivebordet

• Sterkt maskin-sentrert fokus

• Drevet av retningslinjer produkter testet mot retningslinjer

• Fokus på bruker og brukerdimensjoner human factors og ergonomi (f.eks. antropometri)

• Usability testing klarer brukere å gjennomføre oppgaver?

• Anvendelse av eksperimentell psykologi

• Teknologien er målet

Første bølge


1990-tallet: Brukbarhet • Kontekst-spesifikt fokus der hvor interaksjonen skjer

• Flyttet oss fra skrivebordet til arbeidsområdet

• Tydeligere skille mellom arbeidsplass og ikke-arbeidsplass

• Brukere ble mer mennskelige

• Teknologi som en «enabler» skal støtte brukermål og behov

• Mer opptatt av forskning og bruk av etablerte teorier og modeller

på jakt etter rasjonelle valg

• Participatory Design vokser frem (om to uker)

Andre bølge

Kontekst: Omstendighetene hvor en hendelse skjer. Kan være f.eks. fysiske, sosiale, kulturelle omstendigheter som omkranser en situasjon.

Definisjoner: - Kontekst


2000-tallet: Brukeropplevelser • Fokuset inndelt i ulike kontekster hjemme, hytta etc..

• Interaksjon foregår gjennom ulike medier og applikasjoner multimodal design

• Mennesker mer involvert i designprosessen enn noen gang før lavere toleranse for

dårlige løsninger

• Fokus på etnografi og kulturer tilgjengelighet

• Brukeropplevelser blir en del av selskapers strategi for produkter

• Kan følelser knyttes opp mot design?

Tredje bølge


2010-tallet: Bruksverdier • Fokus på verdier og større implikasjon ved designet

• Vi er ikke bare opptatt av nåtidens muligheter, men også fremtidens

• Vanskeligere for brukere å tydelig definere behov på jakt etter muligheter

• Brukere får mer makt kontinuerlig produktinnovasjon (Facebook, Apple, Samsung)

• Underliggende metoder og teknikker blir brukt i bredere felt som involverer mennesker finansielle instanser, helsesektor, museer

(fortsatt ikke etablert)

Fjerde bølge

(Peter Morville)


Design er ikke lett! “It is easy to make things hard. It is hard to make things easy.” – Al Chapanis, 1982 • Design er vanskeligere enn man tror

• Omgivelser og begrensninger ute i den ekte verden gjør dette enda vanskeligere

Design er ikke begrenset til datamaskinteknologi “Technology : the use of science in industry, engineering, etc., to invent useful things or to solve problems” – Merriam-Webster


BIC-pennen (1950) • Heksagonal form som minnet

om en blyant

• Plastikk (billig og god gripeevne)

• Gjennomsiktig kammer viser blekknivå

• Et lite hull på toppen gir samme trykk i og utenfor pennen

• …og minimerer kvelning om man svelger lokket

• Designet er anerkjent av MOMA










Godt design må være funksjonelt og forståelig


For å kunne designe godt må vi…

• Vite hvordan mennesker interagerer med ting

• Vite hva mennesker kan og ikke kan

• Kjenne til situasjonene hvor folk gjør ting

• Kjenne til de grunnleggende prinsippene ved godt design

• Forstå folks behov og mål


Dette emnet handler om fokus på bruker

• Fysiske og kognitive egenskaper (og spesielle behov)

• Personlighet og kultur

• Kunnskap og kompetanse

• Motivasjon

To grove feilantagelser:

• Å anta at alle brukere er like

• Å anta at alle brukere er like som designeren

Documents

INF1500 - Introduksjon til design, bruk, interaksjon Hva ... · INF1500 – Hva er HCI og hvorfor er det viktig? 1 18.08.15 INF1500 - Introduksjon til design, bruk, interaksjon Hva