21.01.2014 Views

1 slide per sida

1 slide per sida

1 slide per sida

SHOW MORE
SHOW LESS

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Användargr

ndargränssnitt nssnitt

&

Visualisering

en översikt

Johan Åberg berg, , IDA


Innehåll

• Introduktion & måls lsättning

• Människa nniska-datorinteraktion

• Visualisering

• Startpunkter

• Frågespecificering

• Kontext

• Relevansvärdering

- demo

• Exempelsystem - demo


Introduktion & måls lsättning

• Varför är r användargr

ndargränssnitt nssnitt viktiga?

– spara tid & pengar, ökad effektivitet,

konkurrensfördel

rdel

• Varför r visualisering?

– synen är människans viktigaste sinne

• Föreläsningssyfte

– ge översikt

över alternativa tekniker som

inspiration


MDI - översikt


• Standardmodellen

– Fördelar

• enkel

• st

MDI - sökprocessen

Informationsbehov

stöds av de flesta sökmotorer s

– Nackdelar

• bygger på p felaktiga

antaganden om statiskt

infobehov

infobehov

• tar

tar inte upp interaktionen med

dokumenten, och n

dokument, , m.m.

och närliggande

Formulera om

Nej

Sökfr kfråga

Skicka till system

Ta emot resultat

Utvärdera resultat

Klar?

Stopp

Ja


MDI - sökprocessen

– Bärplockarmodellen

• analys av s

analys av sökresultat

=> inlärning

=> förändrat informationsbehov

• informationsbehovet uppfylls inte av

en fix mängd dokument som

sökresultat kresultat, utan av

informationsbitar som hittas “på

vägen gen”

Formulera om

Nej

Informationsbehov

Sökfr kfråga

Skicka till system

Ta emot resultat

Utvärdera resultat

Klar?

Ja

Stopp


MDI - designprinciper

• Feedback

– koppling

mellan

sökfr

kfråga

och

sökresultat

– koppling

mellan

dokumenten i

sökresultatet


MDI - designprinciper

• Feedback (forts)


MDI - designprinciper

• Begränsa arbetsminnets belastning

– hj

under sökprocessens gång g

hjälp användaren ndaren hålla h

reda på p beslut fattade

• t.ex. hoppa mellan olika strategier

– erbjud

erbjud relevant information för r aktuellt steg i

sökprocessen

• t.ex. lista med alternativa sökord s


Begränsa

arbets-

minnets

belastning

MDI - designprinciper


MDI - designprinciper

• Alternativa gränssnitt för f r experter och

nybörjare


MDI - designprinciper

• Alternativa gränssnitt för f r experter och

nybörjare

(forts)


MDI - designprinciper

• Alternativa gränssnitt för f r experter och

nybörjare

(forts)


• För

experter

MDI - designprinciper


MDI - utvärdering av gränssnitt

(1/4)

• Användbarhet

ndbarhet (REAL-modellen

modellen)

– Relevans - löser systemet rätt r

upgift?

– Effektivitet - är r systemet effektivt?

– Attityd - har användare

ndare en positiv attityd till

systemet?

– Lärbarhet

- är r det lätt l

att lära l

sig systemet?


MDI - utvärdering av gränssnitt

(2/4)

• Formativ vs. summativ utvärdering

– Formativ

• ge

ge feedback för r nästa n

iteration i

systemutvecklingsfasen

– Summativ

• uppfyller systemet användbarhetsm

ndbarhetsmåls lsättningarna ttningarna?


MDI - utvärdering av gränssnitt

(3/4)

• Metoder (exempel)

– empirisk testning

• testanv

testanvändare ndare löser l

testuppgifter och observeras

och utfrågas

– heuristisk utvärdering

• liten grupp anv

liten grupp användbarhetsexperter ndbarhetsexperter utvärderar

– checklistor

• en lista med vanliga kända k

fel används nds som

kontroll av det nya gränssnittet


MDI - utvärdering av gränssnitt

(4/4)

• Prestandamått

tt (exempel)

Relevans Effektivitet Attityd Lärbarhet

Antal bra och

dåliga features

som användare

kommer ihåg

Antal tillgängliga

kommandon som

inte används

Tid att lösa en

testuppgift

Procent av

testuppgifter

som lösts

Procent av

bra/dåliga

kommentarer

Antal användare

som gillar

systemet

Procent eller

antal fel

Tid som används

åt att studera

dokumentationen

Antal tillfällen

som användare

måste gå runt

ett problem

Procent av

testuppgifter

som lösts per

tidsenhet

Antal tillfällen

som användare

uttrycker

frustration med

systemet

Antal repetitioner

av felaktiga

kommandon


MDI - visuell perception

• Processen - en teori

– Steg 1

• extrahering av l

extrahering av lågniv gnivå-features

från n bilderna som

projiceras på p näthinnorna

• sker omedvetet

• features:

– Steg 2

features: orientering, storlek, textur, färg rg, , etc.

• tolkning av information fr

objekt och relationer, jämf

arbetsminnet

• fokusering p

från n steg 1, formering av

mförs med information i

fokusering på information som är relevant för

nuvarande måls m

lsättningar


MDI - visuell perception

• Användbara ndbara synfältet

(useful field of view)

– del av synfältet som man kan uppmärksamma

samtidigt

– varierar i storlek med kognitiv belastning +

informationstäthet

thet

– jfr storleken för f en van bilförare och en

nybörjare


Visualisering - tekniker (1/2)

• Förfining och länkning l

– samtidiga alternativa vyer, där en justering i

en vy påverkar p

den andra vyn (t.ex. ändring

av färg f

för f en viss typ av objekt)

• Panorering och zoomning

– flytta “kameran kameran” över ytan, tex sidledes

(panorering panorering)

– flytta

eller utåt f

RingTree + Star Tree.

flytta “kameran kameran” in i bilden för f ökad detaljsyn,

t för ökad

översikt

(zoomning zoomning). Se


Visualisering - tekniker (2/2)

• Fokus-plus

plus-kontext

– förstora fokus, , men bibehåll kontexten (t.ex.

genom att förminska f

RingTree.

• Animering

– t.ex.

olika nivåer

tappar kontexten). Se

rminska den). See StarTree +

t.ex. för r att ge smidiga överg vergångar mellan

er i en trädstruktur

(så att man inte

). Se RingTree.


Startpunkter

• Syfte

– hjälpa användaren ndaren komma igång

– förslag på p söktermer

• Tekniker

– listor med informationssamlingar

– översikter

(exempel)

• webböversikter

versikter: : Yahoo, Google, AltaVista, , ...

• site maps: Star Tree


Startpunkter - översikter

• Google

directory


Startpunkter - översikter

• Google directory (forts)


Startpunkter - översikter

• AltaVista

directory


Startpunkter - översikter

• AltaVista directory (forts)


• StarTree

Startpunkter - site maps


Frågespecificering

• Booleska frågor

– vanligast för f r sökmotorer

s

• Formulär r och menyer

– vanligt i avancerad sökning s

med sökmotorer

s

• Naturligt språk

– Ofta begränsat

till “wh wh-fr frågor gor” (who, what,

when, where…)

– T.ex. AskJeeves


Frågespecificering

-

booleska frågor

• Implicit “AND AND”

Google

AltaVista

Yahoo

Vivisimo


• Syntax

för

Vivisimo

Frågespecificering

- syntax


Frågespecificering

-

formulär & menyer


Formulär & menyer (Vivisimo Vivisimo)


Frågespecificering

-

naturligt språk


Frågespecificering

-

naturligt språk


Frågespecificering

-

naturligt språk


Frågespecificering

-

naturligt språk


Kontext

• Placera sökresultat s

i dess kontext för f r att

öka

först rståelsen

• Tekniker

– Dokumentsurrogat

– Markerade söktermer s

i texten

– Kategorier

• handgjorda kategorier

• automatgenererade kategorier


Kontext - dokumentsurrogat

• dokumenttitel

• url

• textutdrag +

betonade sökord s

• filstorlek

• länk

till liknande

sidor

• länk

till cachad

version

• indentering för f hits

från n samma sajt +

länk

till fler träffar


Kontext - markerade söktermer s

• Googles cachade sidor


Kontext - kategorier

(handgjorda

handgjorda)

• Star Tree

• Sökresultat

presenteras i

sajtstrukturens

kontext

• Exempel

Exempel: sökning på p

“support support”


Vivisimo

klustrar

resultat-

sidorna, och

plockar ut

de

viktigaste

orden i

varje

kluster.

Resultaten

kan därf d rför

placeras i

en

semantisk

kontext.

Kontext - kategorier

(automatgenererade

automatgenererade)


Kontext -

bilder

• Googles

bildsökning

• Sökning kning:

“baobab

tree”

• Ger

översikt

över

träffar

• Klick på p

bild =>

nästa

slide...


Kontext -

bilder

• Googles

Googles

bildsökning

• Sökning kning:

“baobab

tree”

• Visar bilden i

sitt samman-

hang i en egen

frame.


• AltaVistas

AltaVistas

bildsökning

• Sökning kning:

“baobab

tree”

• Ger översikt

över träffar

• Klick på p bild

=> nästa

sta

slide...

Kontext - bilder


• AltaVistas

AltaVistas

bildsökning

• Sökning kning:

“baobab

tree”

• Ger meta-

data om

bilden

Kontext - bilder


Relevansvärdering

• Idé:

– användare ndare ger feedback på sökresultatet

– vilka dokument i resultatet är r relevanta?

– vilka ord som förekommer

f

i sökresultatet

är

relevanta?

– används

nds t.ex. för r frågeexpansion

• Gränssnitt för f feedback?


Relevansvärdering

-

rekommendationssystem

• Samarbetsfiltrering

– databas med användares ndares värderingar v

av

objekt

– likhetsmått tt mellan användare

ndare

• hur lika är r deras värderingar

v

(tex statistisk

korrelation)?

• lika användare ndare kallas för f “grannar grannar”

– Uppgift: föruts rutsäg g användare

ndare A:s

värdering av

objekt o

• utgå från A:s

närmsta grannars bedömning av o


Relevansvärdering

- MovieLens

• Rekommendationssystem

– http://www.movielens

movielens.org

• Databas med filmer

• Sökning på p t.ex. genre

• Sökresultat rangordnas enligt förmodade f

användarpreferenser

ndarpreferenser


Relevansvärdering

- MovieLens


Relevansvärdering

- MovieLens


Exempel - Star Tree

• Inxight software

• Stödjer

djer:

– startpunkter och kontext

• Visualiseringstekniker

– fokus-plus

plus-kontext

(hyperboliskt träd)

– panorering och zoomning


Exempel - Star Tree


Exempel - Star Tree


Exempel - RingTree

• Utvecklat av Joakim Sigvald (exjobb exjobb)

• Fokuserar på p browsning och sökning s

i

trädstrukturerad

information

• Stödjer

djer:

– startpunkter och kontext

• Visualiseringstekniker

– fokus-plus

plus-kontext

(fisk fiskögeobjektiv geobjektiv)

– zoomning

– animering (vid nivåbyte

i trädet

det)


Exempel - RingTree

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!