interac - profs.info.uaic.ro

InteracInteracţţiune omiune om--calculatorcalculator

Dr. Dr. SabinSabin--CorneliuCorneliu BuragaBuraga –– www.infoiasi.ro/~busacowww.infoiasi.ro/~busaco//

11

InteracInteracţţiune omiune om--calculatorcalculator IdentitateIdentitateaa & & evaluareaevaluarea

interfeinterfeţţeiei

Dr. Sabin-Corneliu Buraga Facultatea de Informatică

Universitatea “A.I.Cuza”

Iaşi, România httphttp://://www.infoiasi.rowww.infoiasi.ro/~/~busacobusaco//



22

“Simple things should be simple.Complex things should be possible.”

Alan Kay



33

CuprinsCuprins

•

Introducere în identitate vizuală*

•

Evaluarea interfeţei

* Mulţumiri lui Adrian Mironescu



44

IdentitateIdentitate vizualăvizuală

•

“You’ve

got three

seconds

to

impress

me. Three

seconds

to

connect

with

me,

to

make

me

fall

in Love

with

your

product.” (Kevin

Roberts, Lovemarks)

•

Intr-o lume a concurenţei, produsele, serviciile, organizaţiile, persoanele se disting prin identitate



55


•

Punerea problemei:–Identitate

≡

totalitatea mijloacelor

prin care

o organizaţie (aplicaţie, persoană) se prezintă pe sine

–Imagine

≡

ceea ce percep diferitele categorii de utilizatori despre organizaţie (aplicaţie, persoană)

–Identitate ≠

imagine



66


•

Managementul identităţii ≡ administrarea explicită a tuturor mijloacelor

prin care organizaţia se prezintă –

explicit sau nu –

audienţelor sale

•

“Identitatea poate proiecta patru lucruri: cine eşti, ce faci, cum faci şi unde vrei să ajungi.”

(Wally

Ollins)



77


•

Modul de comunicare al organizaţiei cu personalul/publicul poate fi:– Tradiţional

•

Cărţi de vizită, broşuri, calendare,…– Bazat pe mijloace electronice

•

Situl Web al companiei•

Sub-situl dedicat unui produs/serviciu

Notă: Trebuie să se ţină cont de audienţă



88


•

Scop: asigurarea unei identităţi consistente•

Mijloace de asigurare a identităţii vizuale:– Numele– Simbolurile– Schema de culori– Corpul de literă (fontul)– Tipul

de ambalaje

(virtuale

& fizice)

– Slogan



99


•

Branding:

facilitarea câştigării şi menţinerii unei baze de clienţi loiali, în mod eficient din punctul de vedere al costurilor

•

Mijloace: publicitate & materiale promoţionale, relaţii cu publicul/mass-media, prezentări (publice, Web,…), consolidarea comunităţilor de utilizatori

(clienţi), implicarea socială

etc.

•

Constituirea

branding-ului

on-line



1010


•

Numele–Criterii de selectare:

•

Lizibilitatea•

Uşurinţa pronunţării

•

Flexibilitatea•

Idiosincretismul

–Trebuie să fie legat de profilul companiei & să poată fi asociat unui stil vizual puternic



1111


•

Numele–Clasificare:

•

Numele unuia/mai mulţi indivizi (fondatorii) Kai’s PowerTools, Hewlett-Packard, Norton Utilities,

Philips, www.alancooper.com•

Un termen ori set de termeni descriptiv

British Airways, Illustrator,

Keynote,

OpenOffice, Word, www.comunicare.ro

•

Abreviere a mai mulţi termeni Texaco, VMware



1212


•

Numele–Clasificare (continuare):

•

Iniţialele unor cuvinte AIR, IBM, MSDN, www.php.net

•

Numele sunt concepute să arate şi să “sune” într-un mod unic &

atractiv

Nokia, Xerox, www.google.com•

Reprezintă concepte, oferind o impresie privitoare la scopul urmărit Jaguar, Nero Burning ROM, PartitionMagic, Ubuntu



1313


•

Numele– Trebuie să fie similar cu sau să intre

în componenţa numelui domeniului Internet alocat sitului companiei/produsului

•

“Bătălia”

numelor de domenii– Schimbarea numelui conduce la dificultăţi

în desfăşurarea programelor de identitate– Poate sugera o îmbunătăţire/alternativă

la alt nume de marcă•

E.g.: Torrent → Avalanche, eMule → eDonkey



1414


•

Simbolurile– Reflectă

sigla (logo-ul)

companiei/produsului & mulţimea pictogramelor elementelor de interfaţă utilizate

– Expun ideea centrală a organizaţiei/produsului

printr-un stil concis, puternic &

direct



1515


•

Simbolurile– Sigla poate fi un logotip, un icontip

sau mixtă

– Acţionează ca declanşatori vizuali în producerea unei succesiuni de idei în minte (mai eficiente decât cuvintele): asociaţii

– Icon-ul

programului/sitului are un rol important •

Alegerea pictogramei + folosirea culorilor

•

Dimensiuni tipice: 32 ×

32 (versiuni raster)•

Mai nou, pot fi oferite reprezentări vectoriale (e.g., SVG)

•

De ţinut seamă de semantică & de contextul utilizării



1616


•

Simbolurile– Pentru

Web, se recurge

la pictograme

cu impact

vizual, utilizate

judicios

– Eventual, se pot folosi

efecte

3D, reflexii

sau

umbriri



1717


•

Schema de culori– Stabileşte ambientul– Culoarea drept

cod vizual, indicând categoria de

informaţie afişată utilizatorului – Un set de culori poate avea semantici diferite,

în funcţie de situaţiile survenite şi de audienţă– Folosirea inadecvată generează confuzie

•

Exemple: “Aceasta este o eroare”

“Traversaţi acum!”



1818


•

Schema de culori– Culorile pot ajuta în formatarea

informaţiilor

(gruparea cromatică, focalizarea atenţiei etc.) – Ajută la identificarea componentelor,

structurarea ideilor, afişarea surselor de date sau a stării lor

– Probleme: acuitatea vizuală, interferenţa cu alte culori/ferestre

(juxtapunere),

diferenţele disciplinare/culturale



1919


•

Schema de culori– Semantica

–

după

(Galitz, 2002) & (Goin, 2005):

•

Indicarea acţiunilor ce trebuie realizate –

culori calde (roşu, oranj, galben)

•

Oferirea de informaţii de stare ori

pentru fundal – culori reci (verde, albastru, violet)

•

Culorile alese trebuie să se conformeze activităţii desfăşurate de utilizator sau, mai general, cu societatea sa

•

Nu vom

utiliza >4 culori afişate simultan



2020


•

Schema de culori

–

erori

de proiectare:



2121


•

Corpul de literă

(fontul)– Familii de fonturi:

•

Cu serife

(Bell, Garamond, Times,...)•

Fără serife

(Arial, Bedrock, Lucida Sans,

Segoe,...)

•

Cursive (CommercialScript, Nuptial,

GailsHand,...)

•

Mono-spaţiate (Courier, Lucida Console,...)•

Decorative (Σψμβολ, ALGERIAN, ,...)

– De luat în consideraţie: fonturile

comune, lizibilitatea, consistenţa



2222


•

Corpul

de literă

(fontul)– Nu faceţi aşa!



2323


•

Alte tehnici:– Asigurarea balanţei

(echilibrului)– Contrastul– Direcţia– Economia de mijloace– Dominanţa

(punctul focal)– Proporţia– Ritmul– Unitatea

•

Linia•

Culoarea

•

Profunzimea•

Mişcarea

•

Spaţiul•

Textura

•

Valoarea•

Elementele

tipografice



2424


•

Alte

mijloace:– Animating– Annotating– Chunking– Composing– Cutting– Filtering

– Fragmenting– Probing– Rearranging– Repicturing– Scoping– Searching



2525


•

Implicaţii:–Credibilitatea

•

“…nearly

half of all

site evaluators

(46.1%) used

visual

cues, such

as the

site’s overall

design

or look, to

assess

a Web site’s

credibility.” (Consumer

Reports

WebWatch)

–Flexibilitatea (empowerment

vs.

oppression)•

Dinamicitate, inovare, învăţare, sentimentul deţinerii controlului



2626


•

Unele

elemente

privind

identitatea– Pot fi (re)“utilizate”

şi în alte contexte

şi/sau de alte companii

– Necesitatea redefinirii

& schimbării (rebranding)



2727


•

Remarci:– Piaţa supra-saturată, overloaded– De la audienţe limitate (cantitate) la

audienţe universale (accent pus pe calitate)– “Îmbunătăţirea calităţii vieţii”

•

aspect conducând la avantaj competitiv– “Avem tendinţa să presupunem că problema este

a noastră şi nu în produsele/serviciile folosite.” (Jonathan

Ive)



2828


•

Reguli

(Adam Greenfield):– Default

to

harmlessness

(user

safety

comes

first)

– Be

self-disclosing

(always

disclose

all

features)

– Be

conservative of face (do not

embarrass, humiliate

or shame

users)

– Be

conservative of time (don’t waste

someones

time)

– Be

deniable

(optionally

‘out’

at

any

point)



2929


•

Paradoxul

optiunilor

(Barry Schwartz):– Restrict

choice

to

a small

number

of clear,

distinct options, with

significant

differences between

each

option

– Reassure

users

that

they

have

made

the

right decision

after

they

have

made

it,

remind

them

of

their

reasons

– Exemplu: Apple iPod



3030


•

Branding-ul

conduce la încredere (trust)– Conţinutul oferit trebuie să inducă

sentimentul de credibilitate– Aspecte de luat în consideraţie în contextul

interacţiunii om-calculator (Scott

Berkun, 2006):•

Perception – “What do I see?”

(aspectul

vizual)

•

Cognition – “What does it mean?” (semantica)•

Desire – “What do I want?”

(factorii emoţionali)

•

Mechanics – “How do I get it?” (tehnologia)



3131

CuprinsCuprins

•

Preliminarii•

Evaluarea

euristică

•

Testarea

de către

utilizatori•

Evaluarea

predictivă

•

Framework-uri

de evaluare•

Studiu

de caz

•

“Concluzii”



3232

PreliminariiPreliminarii•

Evaluarea utilizabilităţii interfeţei: context



3333

PreliminariiPreliminarii•

Termeni

de bază

(Rogers, 2007):

–Evaluare

analitică (analytical evaluation)

–Experiment controlat (controlled experiment)

–Field study–Evaluare

formativă

(formative evaluation)–Evaluare

euristică

(heuristic evaluation)–Evaluare

predictivă

(predictive evaluation)

–Evaluare

sumativă (sumative

evaluation)

–Usability laboratory–Field study–Studierea

utilizatorului

(user studies)–Usability studies–Usability testing–User testing



3434

EuristiciEuristici

•

Evaluarea utilizabilităţii interfeţei se bazează pe o serie de euristici (Jakob

Nielsen)

–Îndeplinirea

aşteptărilor•

“Potrivirea” cu lumea reală

•

Asigurarea consistenţei & recurgerea la standarde

•

Oferirea de ajutor & documentare



3535

EuristiciEuristici

•


Nielsen)

–Utilizatorul

decide –

user is boss•

Controlul & libertatea utilizatorului

•

Vizibilitatea stării sistemului•

Asigurarea flexibilităţii & eficienţei



3636

EuristiciEuristici

•


Nielsen)

–Tratarea

erorilor•

Prevenirea erorilor

•

Recognition, not

recall•

Raportarea & diagnosticarea erorilor, recuperarea de după eroare

(error recovery)



3737

EuristiciEuristici

•


Nielsen)

–Păstrarea simplităţii –

keep it simple•

Realizarea unui design estetic & minimalist



3838

EvaluareEvaluare euristicăeuristică

•

Aplicarea euristicilor formează un proces numit evaluare euristică–Metodă de inspectare, realizată de un expert–Etape:

•

Inspectarea profundă a interfeţei•

Evaluarea interfeţei conform euristicilor

•

Redactarea listei problemelor survenite–Explicaţii & justificări



3939


•

Fiecare problemă trebuie justificată, conform unei euristici– Exemplu: “prea multe opţiuni de navigare

în prima pagină a sitului” (se eludează “Realizarea unui design estetic & minimalist”)

– De evitat judecăţi categorice: “e prost, fiindcă nu-mi place culoarea de fundal”

•

Prezentarea fiecărei probleme apărute– Chiar şi dacă un element are mai multe probleme de

utilizabilitate (e.g., un buton este plasat în mod inconsistent, este colorat necorespunzător, are un label

confuz

etc.)



4040


•

Interfaţa evaluată trebuie analizată măcar de 2 ori–In prima etapă, se pot detecta problemele

generale şi

se poate obţine comportamentul de ansamblu al sistemului

–A doua fază poate aduce date importante privitoare la elementele particulare



4141


•

Exemplu:



4242


•

Exemplu

–

o parte

a

problemelor

detectate:–

Pictograma coşului de cumpărături este plasată necorespunzător, înconjurată de prea mult spaţiu alb

(“Design estetic & minimalist”)–

Culoarea roşie e folosită atât pentru semnalarea erorilor, cât şi pentru mesajele de ajutor (“Consistenţa”, “Potrivirea cu lumea reală”)

–

Denumirea “ExtPrice” conduce la ambiguităţi (“Potrivirea cu lumea reală”)

–

Nu există “Continue shopping” (“Controlul & libertatea utilizatorului”)

–

“There

is

a problem with

your

order” • nu se oferă explicaţii asupra erorii

(“Raportarea erorilor”)

–

“Cart Title” & “Cart

Name” desemnează acelaşi concept

(“Consistenţa”)



4343


•

Nu trebuie să ne limităm la euristicile redactate de Nielsen

– Principiile

lui Bruce

Tognazzini

(Tog’s 16): Anticipation, Autonomy, Color blindness, Consistency, Defaults, Efficiency, Explorable interfaces, Fitt’s law, Human interface objects, Latency reduction, Learnability, Metaphors, Protect users’ work, Readability, Track state, Visible navigation – detalii la www.asktog.com



4444


•

Remarci:–Evaluatorul nu poate substitui

utilizatorul real al interfeţei•

O interfaţă are probleme de utilizabilitate

doar

dacă utilizatorii frecvenţi au aceste probleme–Analogie: code inspection

vs.

code testing

–Evaluarea euristică detectează probleme pe care utilizatorii reali le “scapă”

uzual

•

Exemple: folosirea de fonturi

inconsistente, probleme privitoare la legea lui Fitt



4545


•

Îmbunătăţiri:– Recurgerea la evaluatori multipli

•

Diversificarea problemelor găsite•

Se recomandă 3-5 persoane

– Alternarea evaluării euristice cu testarea efectuată de utilizatorii reali

•

Fiecare metodă poate detecta probleme specifice•

Evaluarea euristică e mai ieftină

– Evaluatorul poate fi ajutat de către un observator•

Aceasta nu se aplică la testarea realizată de utilizatori



4646


•

Procesul de evaluare:–Antrenarea (training)

•

Întâlniri între echipa de proiectanţi şi grupul de evaluatori

•

Prezentarea aplicaţiei ce va fi evaluată•

Explicaţii privind grupul-ţintă de utilizatori, domeniul de exploatare, scenarii de utilizare



4747


•

Procesul de evaluare:–Evaluarea propriu-zisă

•

Fiecare evaluator lucrează în mod individual•

Se generează un raport scris ori unul oral, înregistrat de un observator

•

Atenţia se focalizează asupra problemelor existente, nu asupra gravităţii acestora

•

Se alocă 1-2 ore/evaluator



4848


•

Procesul de evaluare:–Estimarea gravităţii (severity rating)

•

Evaluatorii stabilesc gradul de importanţă a fiecărei probleme detectate, conform listei tuturor problemelor raportate de toţi evaluatorii

•

Concilierea



4949


•

Procesul de evaluare:–Discutarea rezultatelor (debriefing)

•

Echipa de proiectanţi se întâlneşte cu cea a evaluatorilor

•

Găsirea de soluţii la problemele survenite (brainstorming)



5050


•

Modul de estimare a gravităţii problemelor– Factori:

•

Frecvenţa: cât de comună este problema?•

Impactul: cât de dificil de surmontat e problema?

•

Persistenţa: cât de des apare problema?– Scala severităţii:

•

Cosmetică: poate să nu fie fixată•

Minoră: necesită soluţionare, cu o prioritate scăzută

•

Majoră: necesită soluţionare, cu o prioritate ridicată•

Catastrofică: problema trebuie neapărat soluţionată



5151


•

Aplicare – evaluarea euristică se poate folosi în cazul:– Schiţelor– Prototipurilor pe hârtie

sau

electronice

– Implementărilor eronate

(buggy)•

Problemele privind “elementele lipsă”

sunt dificil de detectat în situaţia schiţelor– Schiţele nu oferă o interactivitate reală



5252


•

Comentariile evaluatorilor trebuie să

fie pozitive, chiar în cazul celor critice–

Corect: “Pictogramele sunt simple, având un contrast bun &

folosind puţine culori”

–

Eludarea tactului: “organizarea meniului e aiurea” (incorect) ⇒ “opţiunile meniului nu sunt organizate logic”

–

Lipsa amănuntelor: “textul este

ilizibil” (incorect) ⇒ “textul este prea mic, iar contrastul e slab (apare text grena pe un fundal negru)”

•

Raportul produs trebuie să includă: problema, euristica, descrierea, gradul de importanţă, recomandările (dacă

există), captura-ecran



5353


•

Cognitive walkthrough = inspectarea se focalizează asupra uşurinţei învăţării interfeţei (learnability)

•

Intrări:– Prototipul– Sarcina dorită a fi realizată (task)– Secvenţa de acţiuni pentru a realiza sarcina

folosind prototipul –

calea de îndeplinire a sarcinii– Profilul

utilizatorului



5454


•

Pentru fiecare acţiune, evaluatorul întreabă:– Utilizatorul ştie care e sub-scopul pe care trebuie

să

îl atingă?– Utilizatorul va găsi acţiunea în cadrul interfeţei?– Utilizatorul va recunoaşte că aceasta îi va servi

sub-scopului dorit?– Utilizatorul va înţelege

feedback-ul primit?



5555

Testare de către utilizatoriTestare de către utilizatori

•

Interfaţa este oferită spre evaluare utilizatorilor reali –

user

testing:

–Evaluarea formativă (formative evaluation)–Studierea domeniului (field

study)

–Experimentul controlat



5656

TestareTestare de de cătrecătre

utilizatoriutilizatori

•

Evaluarea formativă– Găseşte problemele pentru următoarea iteraţie

a proiectării (designului)– Evaluează prototipul/implementarea,

în laborator, prin focalizarea asupra unor activităţi (task-uri) specifice

•

Populaţia de utilizatori evaluatori nu este întotdeauna cea reprezentativă

•

Categorii: utilizatori, facilitatori, observatori– Pune la dispoziţie observaţii calitative

(probleme de utilizabilitate)



5757



•

Studierea

domeniului– Găseşte problemele într-un anumit context

dat

– Evaluează implementarea

aflată în lucru, într-un context real, focalizându-se asupra unor sarcini reale

•

Evaluarea se realizează de utilizatori reali, reprezentativi pentru grupul-ţintă al aplicaţiei

– Oferă observaţii în mare măsură calitative



5858



•

Experimentul

controlat– Testează o ipoteză (e.g., “Interfaţa X

este

mai uşor de manipulat decât interfaţa Y”)– Evaluează o implementare în lucru,

într-un mediu controlat (laborator), focalizându-se asupra unor sarcini specifice

•

Se consideră anumite condiţii riguros controlate– Oferă observaţii cantitative: timpul de reacţie,

rata de erori de tastare, satisfacţia,…



5959



•

Conducerea unui experiment de proiectare (experiment design) controlat:– Alegerea unei ipoteze testabile

•

Exemplu:

“Bara de meniu din Mac OS este mai rapid de manipulat decât cea din Windows”

– Manipularea variabilelor independente•

Interfeţe, categorii de utilizatori, sarcini diferite

•

In acest caz, poziţia pe axa Oy

a barei de meniu– Măsurarea variabilelor dependente

•

Timpi, erori comise, satisfacţia rezultată– Utilizarea testelor statistice

pentru acceptarea sau rejectarea

ipotezei



6060



•

Conducerea unui experiment de proiectare:



6161



•

Conducerea unui experiment de proiectare:– Aspecte importante:

•

validitatea internă

–

rezultatele observate sunt cauzate

de variabilele independente?

•

validitatea externă

–

rezultatele pot fi generalizate extinzând testul (la lumea reală)?

•

încrederea

–

rezultatele vor fi consistente la

repetarea

testului?



6262


utilizatoriutilizatori•

Conducerea unui experiment de proiectare:–

Utilizatori

– Cei de Windows? Cei de Mac OS? Vârsta?

Abilităţi fizice? Teste solitare sau în grup?–

Implementare

– Windows real vs.

Mac OS real

ori

un manager de ferestre emulând comportamentul (e.g., KDE, GNOME)?

–

Sarcini

–

realiste (procesare de texte, navigare Web,…) vs. artificiale (acţionarea unui meniu fictiv)

–

Modul de măsurare

– Când începe şi se termină mutarea mouse-ului?

–

Ordinea efectuării task-urilor–

Hardware

– Mouse, trackball, touchpad, joystick?

PC sau Mac? O configuraţie specială?



6363



•

Aspecte importante

de reţinut: – Etica desfăşurării testelor

users

are human beings– Presiunea exercitată asupra utilizatorului

•

Anxietate privitoare la performanţă•

Testul poate fi considerat ca un test de inteligenţă

•

Auto-compararea cu alţi subiecţi•

Impresia de a fi stupid înaintea observatorilor

•

Competitivitatea cu alţi subiecţi– Respectarea utilizatorului evaluator

•

Timp, confort, informare, confidenţialitate (privacy), libertate



6464


utilizatoriutilizatori•

Planificarea

–

vezi

(Adaptive Path, 2001):

t –2 weeks Determine test audience, start recruiting immediatelyt –2 weeks Determine feature set to be testedt –1 week Write first version of guide, discuss with team, check on recruitingt –3 days Write second version of guide, recruiting should be completedt –2 days Complete guide, schedule practice test, set up and check equipmentt –1 day Do practice test in the morning, adjust guide/tasks as appropriatet Test (usually 1-2 days, depending on scheduling)t +1 day Discuss with observers, collect copies of all notest +3 days Watch all tapes, take notest +1 week Combine notes, write analysist +1 week Present to team, discuss and note directions for further research



6565

EvaluareEvaluare predictivpredictivăă

•

Dacă am avea un model corect al interacţiunii omului cu calculatorul, atunci am putea fi capabili să prezicem utilizabilitatea interfeţei, fără ca aceasta să fie efectiv construită sau testată de către utilizatorii reali

•

Modelul cognitiv

va fi:–

Abstract

fiinţele umane nu pot fi modelate (formal) în întregime–

Cantitativ fiecărei componente să i se asocieze parametri măsurabili

–

Aproximativ valorile parametrilor vor reprezenta medii

–

Estimat în urma experimentelor reale



6666


•

Avantaje:– Prototipul interfeţei nu trebuie neapărat construit

•

Pot fi comparate alternative de proiectare în lipsa unei implementări efective

– Testarea nu trebuie să implice utilizatori reali– Teoria oferă explicaţii pentru problemele

interfeţelor-utilizator•

Mijloacele & instrumentele de proiectare pot fi îmbunătăţite

•

Testarea efectuată de oameni poate doar să releve problemele, nu să le explice



6767


•

Modele

predictive:– KLM (Key-Stroke Model)– GOMS

(Goals, Operators, Methods, Selection rules)– NGOMSL

(Natural GOMS Language)

– CMP-GOMS

(Cognitive-Motor-Perceptual)– Probabiliste

(e.g., reţele

Bayes)



6868


•

Modelul GOMS:– Oferă un limbaj pentru analiza sarcinilor

(task analysis) şi pentru descrierea la nivel înalt a manierei de proiectare

•

Poate fi abstract sau detaliat•

Poate fi calitativ ori cantitativ

– Limbajul folosit poate fi cel natural –

NGOMSL



6969


•

Modelul

NGOMSL:– Editarea

textului

(John & Kieras, 1996)



7070


•

Modelul CMP-GOMS:– Poate modela operaţii efectuate în paralel

•

De exemplu:

point

& CTRL

+

click– Modelul cognitiv al utilizatorului

constă

din mai multe procesoare, rulând în paralel•

Procesorul perceptual, procesorul cognitiv, procesoarele motorii (braţele stâng & drept, ochii)

– Ca şi la GOMS, activităţile pot fi analizate grafic– Modelează performanţa unui expert în operare,

fără a comite

erori



7171


•

Modelul CMP-GOMS:– Graful

sarcinilor

– Drumul

critic

= drumul task-urilor ce durează cel mai mult



7272


•

Modelul CMP-GOMS

– analiza concretă (’93):–O companie de telefoane şi-a reproiectat

staţiile de lucru (software + tastatură) destinate realizării serviciilor telefonice (e.g., 911)•

Reducerea apăsărilor de butoane pentru activităţi comune

•

Butoanele frecvent utilizate au fost amplasate mai ergonomic



7373


•

Modelul CMP-GOMS

– analiza concretă (’93):–Noua soluţie de proiectare a fost

cu 4% mai lentă

decât anterioara•

1 sec./apel = 3 mil. $/an

–Modelul CMP-GOMS a explicat cauzele:•

Apăsările eliminate

nu aparţineau drumului critic

•

Un buton trebuia apăsat spre sfârşitul apelului, în

noua

abordare

fiind plasat pe drumul critic



7474

EvaluareEvaluare viavia

frameworkframework--uriuri

•

DECIDE

(Rogers, 2007)–Determinarea scopurilor (goals)–Explorarea problematicii (questions)–Alegerea manierei de abordare &

metodelor de evaluare–Identificarea dificultăţilor practice

(practical

issues)–Deciderea soluţionării dificultăţilor etice

(ethical

issues)–Evaluarea, analizarea, interpretarea &

prezentarea datelor



7575

StudiuStudiu de de cazcaz

•

Reproiectarea

unui

sit Web de tip intranet– Conform D. Maurer, Deconstructing Design,

IA Summit, 2005•

Situl aparţine Department

of Family

and

Community

Services– Utilizare scăzută– Utilizabilitate precară– Valoare redusă pentru majoritatea oamenilor– Interfaţa Web proiectată necorespunzător

din punct

de vedere

vizual– Structurare precară– Conţinut informaţional în volum de 1500 de pagini



7676


Interfaţa Web iniţială



7777


•

Activităţile de reproiectare:–Interacţiunea cu utilizatorii

•

Interviuri contextuale & constituirea grupurilor de interes (focus)

•

Studii privind accesibilitatea•

Evaluare

–Aspectele legat de business•

Identificarea scopurilor privind business-ul

–Conţinutul•

Analiza jurnalelor serverului Web + log-urilor privind motorul de căutare internă

•

Inventarierea & analizarea conţinutului



7878


•

Activităţile de reproiectare

(continuare):–Designul

•

Crearea arhitecturii informaţionale

(IA)•

Rularea de teste de utilizabilitate

•

Proiectarea layout-ului

paginilor Web•

Crearea designului vizual

•

Dezvoltarea prototipului•

Efectuarea de teste de utilizabilitate asupra prototipului



7979


About FaCS

FaCS programs

What’s on ResearchAdministration EmergencyTechnology

Our people

Bomb threat

Fire

Emergency contacts

Bulding evacuat ion

First aid

Passwords

System acce ss

Telephones

System manuals

Help for.. .

Teleconferencing

IT security

He lpdesks

IT assets

Library services

Statistics

Legislat ion

Research papers

Internet links

News

Calendar of eve nts

Newsletters

Job vacancies

Getting to the Fa CS

Projects

Business adm inistra tion

Staff a dministra tion

Certified agreement

Learn ing & development

Pay & conditions

OHS

Orientation

Performance management

Personal safety

Recruitment

Workplace diversity

Business planning

Project management

Legal

Purchasing

Risk management

Security

Workplace harrasment

Communicating

Finance

Property

Tr avel

Orga nisation chart

Executive

Committees & meetings

Branches & STOs

Communitie s & networks

Minister

Our values & ethics

Our relationships

Corporate documents

How we work

Ou r locations

Corporate policies

Our social activities

A-Z of programs

A-Z of payments

Program administration

Stronger communities

Stronger families

Economic & soc ial

participation

Programs, strateg ies &

services

Arhitecturainformaţională



8080


•

In cursul

procesului de proiectare, unele nume de module principale (subiecte de interes) au fost modificate:– Personal/employee administration »

Staff administration

– News & events »

What’s happening »

What’s on– Help »

Emergency

– Policies & Programs »

FaCS Programs– Administration »

Admin

•

Structurarea datelor s-a desfăşurat în jurul “secţiunilor”

sau “colecţiilor”

–

Secţiuni relativ independente, cu granularitate similară (dar volumul de informaţie diferă)



8181


Nou

a in

terf

aţă

a p

agin

ii p

rin

cip

ale



8282


•

Pentru alegerea manierelor de navigare s-au avut în vedere:– Analiza datelor

– unele secţiuni ale portalului

sunt mai populare decât altele– Feedback-ul utilizatorilor

– angajaţii au dorit acces

rapid la conţinut– Analiza competitivă – recurgerea la mini-zone

de legături

(contextuale, cel

mai

recent vizitate)– Accesibilitatea

–

utilizatorii cu handicapuri motorii

au dorit zone largi de interacţiune– Testele de utilizabilitate

–

grupurile majore

de subiecte de interes nu

sunt

foarte intuitive (necesitatea detalierii unor informaţii)



8383


•

Pentru facilitarea navigării, pe prima pagină au fost incluse:–Ştiri (News) – utilizatorii doresc să ştie

ce se întâmplă (în organizaţia lor)– Legături rapide (Quick

links) –

unele conţinuturi

sunt mai populare (conform analizei datelor), utilizatorii doresc acces rapid (user

feedback),

oferirea de căi multiple de acces (good

practice) – Căutare internă (Search)– Legături locale –

reducerea percepţiei

ca situl este destinat doar sediului central (discuţii cu utilizatorii), birourile regionale doresc “ceva”

propriu

(discuţii cu utilizatorii)



8484


•

Pe paginile corespunzătoare secţiunilor de interes (subiectele principale), au fost incluse:– Posibilităţi de navigare globală

(testul de utilizabilitate a relevat lipsa legăturii spre prima pagină la varianta originară a sitului)

– Meniuri de legături spre sub-secţiuni + spre subiecte înrudite (related

links)

– Mecanisme de semnalare a drumului parcurs de la rădăcina sitului (breadcrumbs)



8585


Nou

a in

terf

aţă

a u

nei

pag

ini

pri

vito

are

la o

secţi

un

e



8686

““ConcluziiConcluzii””

•

Toate deciziile de proiectare sunt datorate unui spectru larg de date de intrare (inputs) şi activităţi

•

Nevoile utilizatorilor nu reprezintă unicul

input•

Better

inputs

help

create better

outputs

•

Proiectarea depinde mult şi de experienţă•

Testele

de

utilizabilitate confirmă designul,

dar nu-l creează



8787

RezumatRezumat

•

Introducere în identitate vizuală

•

Evaluarea interfeţei



8888

ÎÎntrebărintrebări??

interac - profs.info.uaic.ro

Documents