Notas Aula Ihc

Contedo
Design de Interfaces com

Usabilidade
Introduo Interao Humano-Computador (IHC):

fundamentos, conceito de usabilidade, etc
Princpios e tcnicas de Desenvolvimento de Software visando
usabilidade e Design de Interao: prototipao, projeto
centrado no usurio, anlise de tarefas, casos de uso
essenciais; (inclui noes bsicas de avaliao de usabilidade)
Integrao de modelos de Engenharia de Software e IHC
Marcelo S. Pimenta
(mpimenta@inf.ufrgs.br)
Exemplos e Exerccios
Salvador, janeiro de 2012

2
Bibliografia (em portugus)

Preece, J. et alli, Design da Interao Alm da Interface
Homem-Computador, Bookman, 2005.
Livro texto fundamental sobre Interao Homem-Computador,
contendo desde conceitos iniciais a tcnicas para design e
avaliao de sistemas interativos com usabilidade.
Primeira
Parte
Barbosa, S.D.J.; Silva, B.S. Interao Humano-Computador. Editora

Campus-Elsevier, 2010.
Cybis, Walter; Betiol, Adriana H.; Faust, Richard. Ergonomia e
Usabilidade - Conhecimentos, Mtodos e Aplicaes. Novatec, 2010
(2a. ed.)
Roteiro
Interao em Toda a Parte
I Motivao
II Fundamentos: IHC, Usabilidade
III Usabilidade: Como Desenvolver Software Usvel?
IV Concluses
Importncia de IHC (1/3)

Usurio frente a um novo dispositivo

interativo:

Final feliz :

Usurio frente a um novo dispositivo

interativo:
Satisfao e Conforto
Sade e bem-estar
Produtividade
Final nem to feliz:

Interface de qualidade ...

Utilidade
Usabilidade
Eficincia de uso
Deficincias de interface...

7
aborrecimentos, frustraes
stress, psicopatologias
desperdcios e abandono do sistema
desconhecimento da atividade
desconhecimento do usurio e das
caractersticas (fsicas, cognitivas, sociais)
humanas
desinteresse pela lgica de utilizao
8

95% de todos sistemas atualmente

desenvolvidos atualmente so
interativos
Qualidade de Interfaces
exceo: sistemas embarcados, batch
Desenvolvimento da interface demanda

no mnimo 50% do esforo total de
desenvolvimento do sistema
Bom Preo permite que usurios
comprem sistemas;
Boas interfaces permitem que usurios
usem sistemas
Qualidade historicamente ligada a

amigabilidade (user friendliness)
Diferentes pontos de vista de qualidade
de interfaces:
a) Performance humana satisfatria(ISO)

Eficcia (%) - coeficientes de erro

Eficincia (t, $) - velocidade de uso
Satisfao: grau de aceitao do produto pelo
usurio.
b) Tempo de aprendizado e de reteno

9
Usabilidade
10
Definitions: What is Usability?
Adequao entre caractersticas (fsicas/cognitivas) dos usurios

e caractersticas da interao (com o sistema) para realizao de
tarefas
No propriedade intrnseca do sistema mas do trio (usurio,
sistema, tarefa)
Expressa por alguns fatores:
Usability is the measure of the quality of a

user's experience when interacting with a
product or system whether a Web site,
a software application, mobile technology,
or any user-operated device.
facilidade de aprendizado, intuitiva e natural

flexibilidade de interao, multiplicidade de formas de uso
robustez de interao, acompanhamento e recuperao em situaes de
incidentes
http://www.usability.gov
11
12
Why Should You Care About

Usability?
Why Should You Care?
Have you ever

gotten lost in a Web site?
left a site without finding the information
you wanted?
waited too long for a feedback ?
gone to a site you cant view or read?
visited a site with outdated information?
SH%$**@DGJ a system ??
Jakob Nielsen reports:

"Studies of user behavior on the Web find a low
tolerance for difficult designs or slow sites. People
don't want to wait. And they don't want to learn
how to use a home page. There's no such thing
as a training class or a manual for a Web site. People
have to be able to grasp the functioning of the site
immediately after scanning the home page for a
few seconds at most."
13
Problema de Usabilidade
Jakob who?

14
Jakob Neilsen is generally recognised as

a world authority on usability for the web;
a web guru ;-)
Has published numerous books on
usability;
Homepage Usability: 50 websites
deconstructed;
Website: www.useit.com
se h dificuldades (reais ou potenciais) para determinado usurio ou

(grupo de usurios) realizar uma tarefa com a interface !!!
Graus de severidade
Tipo
0
1
2
3
4
Descrio (necessidade de reparo)

Sem importncia No afeta a operao da interface
Cosmtico
No h necessidade imediata de soluo
Simples
Problema de baixa prioridade (pode ser reparado)
Grave
Problema de alta prioridade (deve ser reparado)
Catastrfico
PRIORIDADE MXIMA no reparo
Information Technology Services

15
16
Usabilidade importante?
Usabilidade importante?
17
Exemplos de problemas
18
http://www.englishpractice.com/
19
20
21
22
USA
Internacional
23
24
Onde achar Portuguese? Acima ou abaixo?

25
26
http://www.englishpractice.com/
27
28
Types of Usability Problems

Usabilidade: problema genrico
Product doesnt match job or task

Poor organization/layout
Unexpected occurrence of events
Product not self-evident
Requires recall rather than recognition
Inconsistent screens, messages, terminology
Design is inefficient
Cluttered or unattractive design
No feedback or poor feedback about status or errors
No exit or undo
Help or documentation is not helpful
Problemas em Interfaces em geral: NO somente em Software !!!

Don Norman, The Design of Everyday Things
29
30
Usability of Everyday Objects

Don who?
Examples from
http://www.baddesigns.com

Further Reading:
Donald Norman: The Design (Psychology)

of Everyday Things
Don Norman pioneering book from 1988

The Design of Everyday Things
Originally published as The psychology of
everyday things
Motivates and explains usability principles
Norman, Donald A. (2002). The Design of Everyday Things. New York:

Basic Books.
31
32
Usability Problem Example:

Inconsistent
Exerccio provocativo

Escolha um aplicativo qualquer

Investigue-o procurando problemas (reais
ou potenciais) de usabilidade
Faa uma lista de problemas

Ateno: pare aps 20 problemas ;-)
Discusso com colegas e professor
33
34
How usable ?
Mtricas para medir usabilidade?

Desempenho durante a realizao de tarefas:
Concluso de tarefas (c/ sucesso, parcialmente concluda, no-concluda);

Tempo de realizao da tarefa;
Ocorrncia de erros;
Not Is your system usable, but How
usable is your system?
Satisfao subjetiva do usurio e correspondncia com os

objetivos do usurio;
Adequao a padres (normas, recomendaes, regras
ergonmicas, etc.)
Spectrum
Internacionais (ISO)
Continentais (Comunidade Europia, MercoSul, etc)
Nacionais
Institucionais (Style guide)
35
Can set minimum standards to meet (time,

error rate, user satisfaction)
36
Usability is about money too

Usability is shaped by the UI but usability is

much deeper than UI
Usability relates to the (complex) choices

that users make to accomplish one or more
tasks easily, efficiently, enjoyably, and with
a minimum of errors
A system is USABLE because it was
fundamentally architected that way
Usabilidade tem futuro !!

Revista INFO-Exame
Setembro, 2007
37
38
39
40
Roteiro
I Motivao
Segunda
Parte

IV Concluses
41
IHC: Interface e Interao
42
IHC: Interface e Interao
Interface:
sistema
aquilo que interliga dois sistemas

software e hardware para comunicao entre o
usurio e um sistema
ao
usurio
interface
aplicao
interpretao
Interao:
Alan Kay: For users, the user interface is the program
43
comunicao entre usurio e sistema, inter

+ao
processo que engloba aes do usurio sobre
sistema e interpretaes dos resultados
44
IHC: Objetos e Funes

de uso geral
Sistema Interativo: Funes

Interface Homem-Computador
Sintaxe da interao: visa completar a interao
Disponibilizar objetos e funes interativas
do domnio do aplicao
de uso geral
Ncleo Funcional
Aplicao propriamente dita
Semntica da Interao: visa realizar o objetivo
Apoiar as entradas

Copiar/Colar
Permitir entradas por
Seleo/Combinao
Fornecer valores default/prvios
Desfazer/Refazer
Localizar (browse)
da tarefa
45
IHC: Objetos e Funes

de uso geral
Modelo de Norman
Definir as apresentaes (sadas)

46
Formas de Visualizao (zoom, preview, etc...)

Organizao das Unidades de Apresentao (telas,
janelas, caixas de dilogo)
Navegao dentro de uma unidade de apresentao
(rolagem/paginao)
Apoiar o dilogo ...

Navegao entre Unidades de Apresentao

Ajuda
Personalizao (cores, minimizar/maximizar, etc)
47
48
Sistemas Interativos so
Ferramentas
Arquitetura e Comportamento
Sistemas so FERRAMENTAS de suporte

realizao de tarefas:
UTILIDADE da ferramenta :
Sistema Interativo = Ncleo Funcional (Aplicao)+ Interface

Comportamento (Modelo de Norman):
Para que usar? O que faz?
USABILIDADE da ferramenta :
Como usar?
Componente de
Dilogo
N. Funcional
Componente de
Apresentao
Interface
Linguagem
de Ao
atividade
Formulao
Linguagem
de Apresentao
Usurio
Avaliao
computador como ferramenta
49
Interao HumanoComputador (IHC): evoluo
50
Usabilidade
60s e 70s:
Sist.em batch
Usurio
CPD
Sistema

80s e 90s:
Interao
Usurio-sistema
Usurio
Sistema
Adequao entre caractersticas

(fsicas/cognitivas) dos usurios e
caractersticas da interao (com o sistema)
para realizao de tarefas
No propriedade do sistema mas do trio
(usurio, sistema, tarefa)
Expressa por 3 fatores:
Sistema
Hoje:
Integrao
Usurios-Sistemas
via Internet
Usurio
Usurio
Internet
Sistema
51
facilidade de aprendizado, intuitiva e natural

flexibilidade de interao, multiplicidade de formas
robustez de interao, acompanhamento e recuperao
52
Usabilidade
Usabilidade
Facilidade de aprendizado, que agrupa os
Flexibilidade de interao, que agrupa

os aspectos que permitem uma multiplicidade de
maneiras de trocar informaes entre o usurio
e o sistema:
aspectos da interface que permitem ao usurio

novato de compreender inicialmente como o usar e
em seguida alcanar por experincia a um nvel
elevado de performance:
iniciativa do dilogo (latitude ou liberdade decisional)

previsibilidade (histrico de interaes interao futura)

rastreabilidade (influncia de operaes passadas no estado atual)
familiaridade (correlao entre o conhecido e o necessrio)
generalisabilidade (interao especfica similares)

53
Robustez de interao, que agrupa os
Resumo

facilidade de aprendizado

facilidade de uso (operao)

taxa de erros minimizada

adequao tarefa
Usabilidade obtida por construo

Clara compreenso dos requisitos de
usabilidade durante as etapas iniciais da
concepo e no somente ao final
BUSCAR: Usabilidade como requisito do
sistema (built-in approach)
EVITAR: Usabilidade somente como critrio
de avaliao (day-after approach)
aspectos de interao que suportam a

realizao e a avaliao de objetivos:

multiplos dilogos (intercalados ou paralelos)

migrao de tarefas (usurio sistema)
substutividade (de valores de E/S)
multimodalidade (modos ou canais de comunicao)
configurabilidade (pelo usurio)
adaptabilidade e personalizao (ao usurio)
54
Usabilidade
Usabilidade
pre-emptivo: usurio no controle

pre-emptivo local: dilogo modal local
pre-emptivo global: dilogo modal global
observabilidade (do estado corrente)

recuperabilidade (de erros)
conformidade tarefa do usurio
55
56
Mtricas para medir

usabilidade?

Traditional Criteria:
Desempenho durante a realizao de tarefas:

Q: What makes something usable?

A: It depends
ease of learning
efficient/ergonomic use
minimal errors
retention over time
subjective satisfaction
Concluso de tarefas (c/ sucesso, parcialmente concluda, noconcluda);

Tempo de realizao da tarefa;
Ocorrncia de erros;
Satisfao subjetiva do usurio e correspondncia

com os objetivos do usurio;
Adequao a padres (normas, recomendaes,
regras ergonmicas, etc.)

Internacionais (ISO)
Continentais (Comunidade Europia, MercoSul, etc)
Nacionais
Institucionais (Style guide)
Some Human Factors:

users computer aptitude
users computer experience
users computer expertise
users domain expertise
frequency of users use of the tool
physical coordination & health
Some Technology Factors:
Individual Differences
de facto standards
display factors (eg screen size)
interactions of software
and hardware
All users are not the same!

We think about homogeneous target
user groups
Distinguishing between individual and
group differences is not easy
57
58
What about Acessibility?
Usability Goals
Usability Goals are always Tradeoffs, and can conflict with one another
Rapid learning
Safety/error constraint
Subjective satisfaction
for novices
"The power of the Web is in its

universality. Access by everyone
regardless of disability is an
essential aspect."
Low power
Awkward/extra steps
Extreme irritation
for experts
Many design guidelines exist that claim to ensure usability
Tim Berners-Lee, W3C Director and inventor of

the World Wide Web
BUT while acessibility guidelines and checklists are important,

it is also vital to observe REAL USERS IN ACTION
Usability is perceived, not ascribed.

BUT there are some universal principles for good design and bad design
59
60
Acessibilidade
Experimento
Possibilidade de acesso, processo de conseguir

igualdade de oportunidade em todas as esferas
da sociedade" ONU
A acessibilidade da Internet caracteriza-se pela
flexibilidade da informao e interao
relativamente ao respectivo suporte de
apresentao hp Brasil
"The power of the Web is in its universality.
Access by everyone regardless of disability is an
essential aspect."
IHC2002: Pimenta et alli. A (in)acessibilidade

de sites governamentais, Fortaleza, 2002.
Sites governamentais analisados
GOVERNO FEDERAL:
SEESP: www.mec.gov.br/seesp
INPA: www.inpa.gov.br
GOVERNO ESTADUAL:
PROCON/RS : www.procon.rs.gov.br
GOVERNO MUNICIPAL:
Tim Berners-Lee, W3C Director and inventor of the World Wide

Web
PREFEITURA DE PoA: www.portoalegre.rs.gov.br
61
Plataforma e Navegadores
62
SIS
TE
MA
S
OP
ER
ACI
ON
AIS
E
NAVEGADORES
Internet Explorer
63
Netscape
64
Exemplos de Problemas
Iniciativas
EXEMPLO
Ao Brasileira para a Acessibilidade - ABRA
" ... garantir a acessibilidade das pessoas com

deficincia e/ou necessidades especiais aos portais
(pblicos) na Internet".
http://www.acessibilidade.org.br
W3C Acessibility Initiative
65
Alertas
66
Acessibilidade
Mais Prioridade acessibilidade:
RECOMENDAES W3C
"Web Content Accessibility Guidelines 1.0
www.w3c.org/TR/WCAG10/
Todos os pontos de prioridade 1, alguns de 2 e 3
Acessibilidade: requisito social e de qualidade

de vida
Conseqncias:
Alertar e conscientizar rgos responsveis por
sites de e-government :
Contatos com prefeituras e Webmasters de alguns sites
FERRAMENTAS
P.ex. Para validar XHTML/HTML de um website no W3c:
http://validator.w3.org/
Alertar e conscientizar os desenvolvedores

Pequenas correes para adequao
Maior Divulgao de Recomendaes Bsicas (como Quick
Tips to make Accessible Web Sites da W3C)
Maior divulgao de ferramentas
USO EM DIVERSOS NAVEGADORES E PLATAFORMAS
Mais avaliaes e divulgao de resultados

67
68
Guidelines para acessibilidade
Acessibility problem: example

Devices x platforms x
browser1
browsers
browser2
http://www.w3.org/WAI/
http://www.terra.com.br/istoe/
69
Acessibility Guidelines
Acessibility initiative and tools

70
Brazilian:
Ao Brasileira para a Acessibilidade - ABRA
http://www.acessibilidade.org.br
Universal:
W3C Acessibility Initiative
"Web Content Accessibility Guidelines 1.0
www.w3c.org/TR/WCAG10/
Tools
Bobby www.cast.org/Bobby/
71
72

Execution gulf
Cognitive Psychology
Human Factors (Ergonomics)
Graphic Design
Semiotics
Hside of HCI
Semantic
Distance
input
Articulatory
Distance
input
Semantic
Distance
output
Evaluation gulf
HCI background
Articulatory
Distance
output
;-)
73
74
Roteiro
I Motivao
Terceira
Parte

IV Concluses
75
76
Como desenvolver software

usvel?

HCI: focus is on USAGE
multidisciplinary activity (CS,

Ergonomics, Cognitive Psych,
graphical design. etc)
team activity
HCI DOES NOT traditionally
appear in CS curricula
ACM Currcula
SBC (brazilian computer society)
curricula
UFRGS : since 1993 !!!!
PRODUCT
1..1
1..*
1..*
SUPPLIER
Try to do it:

Menu design for CRUD functions
What about YOU ????

DID you know HCI issues?
77
Developers View
(system-oriented)
Menu basically reflects
internal DB
operations
78
Users View
(usage-oriented)
Menu basically
reflects frequent
tasks when user
manipulates
Product
Product
Insert
Delete
Update
Retrieve
Fornecedor
Insert
Delete
Update
Retrieve
79
Insert Product
Retrieve Supplier
Insert Supplier
Retrieve Product
Update Product
Retrieve Supplier
Insert/Update Supplier
Delete Product
80
User-Centred Design (UCD) HCI Approach

UCD Summary
Taking in account cognitive and physical

aspects of user(s)
Have a goal or purpose for your software
Spend time in planning and design.
Dont do things because you can, do them
because they add value.
Continually evaluate and update your
software.
Know Your Users!!

Talk to them
Get feedback from them
Know the Users Tasks !!
Design for user

81
Value of User-Centred Design?
82
Managers/Developers view of user involvement

I havent really thought about it
I know what my users need
It would be nice to do more work with users but I
dont have the time / budget
My managers are happy with my statistics, so thats
job done
Customers are central to my service
The Standish CHAOS report (1994):

Red = success
Green = completed,
over-budget/time,
under-functional
Yellow = cancelled
83
84
Involving users in development

projects
Projects developed in-house:
Seek user involvement early
The Standish report (1994):

Project Success Factors
% of Responses
1. User Involvement
15.9%
2. Executive Management Support
13.9%
3. Clear Statement of Requirements 13.0%
4. Proper Planning
9.6%
5. Realistic Expectations
8.2%
6. Smaller Project Milestones
7.7%
Etc.

understand their requirements

graphic design development
information architecture and interaction
design
technical environment
content type, format, level
Build-in time and budget for this (bearing CHAOS in

mind!)
85
Activities for Designing Usable

Systems (quick view)

Planning
Design
Implementation
Maintenance
Evaluation and Test
Maintenance
86
Activity One: Planning

You can use an eraser on the
Planning
drafting table or a sledge hammer

on the construction site.
Evaluation
- Frank Lloyd Wright

Design
87
88
Planning: Identify contextual

information
Planning: Activities
Planning activities:
Define the purpose of the system
Identify the contextual information
Identify target users
Get to know your users
Define the users tasks (create scenarios)
Determine scope, usage and change
characteristics of the information
Define the personality of your system
Put together your team
About Owners
About Environment
What are their motivation and goals?

Whom do they wish to design for?
What constraints are there?
What aspects of the environment
need to be considered?
What are/have others done in a

similar setting?
What regulatory or ethical
considerations are there?
About Users
Who are they?
How many different individuals, groups?
What are their characteristics, abilities,
and limitations?
Why will they use this system?
How often will they use this system?
For what purpose(s) will they
use this system?
About Technology
What choices are available?
What tradeoffs need to be considered?
What are the costs, and what is
cost-effective?
89

Talk to your users

Observe your users
Get feedback from your users
Find out

What are your users characteristics?

Who are your users (characteristics)

What do they do (tasks)
90
Planning: Knowing Your Users
Planning: Get to know your users

Collect this information through

Current vs. desired

Critical vs. non-critical
User/task matrix
Age, computer literacy, domain

knowledge, access methods, browsers,
work environments, handicaps, etc.
Surveys / Questionnaires
Visits to their environment
How do they do it (Task Flow)

Where do they do it (environment)
91
92
Activity 2 - Design
Planning: Development Team

A cross-disciplinary team includes:

Project manager (Web site manager)

HTML Authors
Programmers
Interface and Interaction designer
Graphic designer
Human factors/ Usability expert
Writers / Editors
Content Owner(s)
Client / customer
User
System/ server administrator
Representative from a Legal department
Security
Any object or element of the interface

that does not add to communication is
subtracting from it.
-Bruce Tognazzini
93
Interaction Design
Design

94
Interaction design refers to the various controls (or widgets) that the
user must manipulate in using the system
Iterative process
Apply guidelines and heuristics
Prototyping:
Interaction Design is closely related to industrial (physical) design

(See Donald Normans book, The Design of Everyday Things)
Three Key Principles:

Paper prototypes -> Review with users
Affordances
Features of an object that convey how it is to be used
On-line prototypes -> Review with users
Constraints
Attributes of an object that prevent its incorrect use, or prevent errors
Mapping
The arrangement of controls for an object that has natural spatial meaning
95
96
Affordances

Concept from Gibsons ecological psychology

Norman refers to perceived or actual properties
of objects

Affordances
Poor affordances

Given users capabilities, goals, plans, values, etc.
What can you do with it?

Should you click it, drag it, is it part of the
background?
Can you tell what parts of a user interface are
interactive?
Doors
Push or Pull?
Where to push?
Good
affordances
Buttons that
appear clickable
97
98
Constraints

Mappings
Restrict user actions to valid actions

Eliminate need for perfect knowledge
Recognition over recall
Good constraints are rarely noticed
User intentions to available actions

PREVIOUS
Is there a natural mapping between what

users want to do and what appears possible?
Do users stare at technology for sometime
before they take action?
Or do they immediately know what to do?
Simplicity can help
NEXT
99
100
Mappings
Activity 3 - Implementation
Natural mappings: no explanations needed

The intelligent use of graphic elements and
design can add greatly to the attractiveness
of a web page. But it's like putting on makeup
-- you have to know when to stop.
Available actions
User intentions
Perceived system state

-Zen and the Art of Web Design
Actual system state
101
102
Consistency
Implementation
Follow Design Guidelines and Style Guides
Consider:

Devices idiosyncrasies
Cross-platform issues
Browser differences
Accessibility issues
Consistency
103
Look and feel
Style guides
Same operation has same effect on

different objects, screens
104
Implementation:
Design Style Guide
Implementation:
Creating the Style Guide
Create a design style guide:
How do you create a style guide?

The guidelines for a consistent look and feel and

site navigation experience.
The key to success is making the details simple,
understandable, and easy to implement.
A style guide should include:

Start with a general, high-level style guide.

Make it more specific to your project.
Overall navigation and organization

Templates for each page type
Guidelines for adding content
Guidelines for removing/archiving content
Presentation guidelines (e.g., color schemes)
Approval and workflow checklists

E.g., if high-level says use a consistent font,

your project style guide would say which font
to use.
Make it easy to use.

Allow it to evolve as your system evolves.
105
106
Evaluation: Early and Often

Activity 4 - Evaluation
Evaluate your system to verify that it
meets your purpose and that your users
can use it successfully.
Evaluate early and often:
If the user cant find it, it isnt there!

107
Conduct tests iteratively.

Do not work in isolation; start collecting feedback
as soon as the structure is defined.
Do not wait for graphics to do testing.
Make it easy for people to give feedback.
108
Activity Five: Maintenance
Evaluation: Usability Testing

What is Usability Testing?

Do maintenance thinking in the next

maintenance ...
A way to evaluate the interface with real users.

Can be done in a lab or in their environment.
Can be performed on paper prototypes as well as
implemented systems.
Your maintenance budget should be as

honest as possible
How?

Give users representative tasks to complete.

Watch for where the interface does not support
their task completion.
Identify changes to be made to the interface to
support the user.
109
110
Ciclo de Concepo de
Interfaces
Como desenvolver software

usvel? (viso detalhada)
Processo de Concepo de Interfaces

com Usabilidade:
Anlise Contextual
Design de Interfaces
Prototipao de Interfaces
Avaliao de Interfaces
111
No h receita de bolo para concepo de boas

interfaces:
necessrio um ciclo de estudo, construo,
experimentao e avaliao de interfaces
Ciclo organiza um procedimento tentativa e
erro a partir de uma boa tentativa e guiado por
princpios e heursticas de projeto
Princpios e heursticas so aproveitamento da
experincia de outros desenvolvimentos (DOs e
DONTs de projeto)
112
Ciclo de Concepo
Ergonmica de Interfaces
Ciclo de Concepo
1a. Etapa: Anlise Contextual

Anlise do Usurio (modelo do usurio);
Anlise da Tarefa de Referncia (modelo de
tarefas do usurio);
Anlise do Estado-da-Arte (sistemas similares
existentes)
Engenharia de Requisitos:

2a. Etapa: Projeto da Interface com o

Usurio
Requisitos Funcionais e No-funcionais

Modelo de Negcio e Casos de Uso Preliminares
Definio das Unidades de Apresentao (UAS =

telas, janelas , folders, etc)
Definio das Sequncias entre Uas
(Navegao)
Definio dos Estilos de Dilogo
Projeto das Apresentaes (comandos, controles
e mostradores)
Definio do Dilogo de Baixo Nvel (de operao
dentro de uma UA)
113
114
Ciclo de Concepo
Questes de Concepo
3a. Etapa: Prototipao
1) Quais so os usurios?
2) Quais tarefas sero suportadas?
3) Qual o contexto de realizao destas tarefas?
4) Quais comandos e aes o usurio pode realizar atravs
da interface?
5) Como os componentes da Interface sero
apresentados aos usurios?
6) Como provocar as crticas/sugestes dos usurios?
7) O sistema e sua interface suportam adequadamente as
tarefas dos usurios?
Prottipos em papel
Maquetes em editores de recursos
Prottipos funcionais
Deve responder s questes:
uso de templates e geradores
4a. Etapa: Avaliao

Implementao de uma verso de trabalho
Avaliao
115
116
Atividades da Concepo
Anlise Contextual: O qu?

Anlise Contextual
Compreender o Problema e o Contexto do

Problema
Contexto Estvel:
usurios
tarefas e informaes associadas
contexto organizacional e social
restries tecnolgicas
Contexto Instvel:
Cenrios de Uso: situaes tpicas,
singularidades: excees, erros, interrupes,
desvios
117
118
Anlise Contextual: Modelo de

Usurio
Anlise Contextual:
Modelagem do Usurio
Modelo do usurio o conhecimento sobre o
usurio, explcita ou implicitamente
representado.
Tipos de usurio e atributos relevantes
Exemplos de atributos:

freqncia de uso: (freqente, peridico,ocasional)

experincia na tarefa: (leigo, novato, com prtica, competente,
expert)

experincia em tecnologia de informtica: (leigo, novato, com
prtica, competente, expert)

experincia em sistemas similares: (elementar, mdia, grande)

idade, nvel de escolaridade, necessidades especiais, etc...
Perfil = combinao (evolutiva) destes atributos
Por que modelar o usurio ?

Modelos podem ser usados para predizer o

comportamento do usurio, diagnosticar seus
erros e auxili-los;
Os dados extrados da modelagem podem ajudar
o projetista no processo de personalizao de
interfaces.
119
120
EXERCCIO
Anlise Contextual: Tarefas

Criar uma lista de atributos que voc

considera relevantes para caracterizar
os seus usurios
Tarefa = Objetivo + Mecanismos

Criar categorias de usurios a partir de

valores de atributos comuns.
Aes orientadas a objetivos que um

agente (usurio ou sistema) realiza por
meio de mecanismos
Integrantes do processo de trabalho
(business process)
Conhecer o Trabalho para Modific-lo

Anlise Ergonmica do Trabalho

Discusso !!

121
Lgicas do Sistema
funes e mecanismos internos dos dispositivos,

as inter-relaes entre esses mecanismos.
Lgica de Operao (projetistas e usurios)

Representao baseada em aspectos visvei

Representao baseada em aspectos internos

Lgica de Funcionamento (projetistas)

122
Anlise Contextual: Cenrios

de Uso
Anlise Contextual: Tarefas

Lgica de Funcionamento e de Utilizao

Anlise de Tarefa (Task Analysis)
Modelo de Tarefa
Descries narrativas das interaes entre usurio(s) e

sistema.
Diferentes noes e nomes: scripts, use cases, storytelling
Descreve uma situao concreta atual (corrente) ou
potencial (futura) de uso do sistema do ponto de vista do
usurio
Caractersticas principais:
na interao com os dispositivos.

nas repercusses visveis do sistema
Sistema mais usvel se mantm coerncia

com o modus operandi atual da tarefa do usurio
123
Facilitam a comunicao usurio-analista pois permitem exemplificar

comportamentos e refletir sobre sua adequao atravs de situaes concretas de
uso do sistema;
Interessantes para comparar diferentes alternativas para as sequncias de ao em
funo do grau de automao e da metfora de interao escolhida;
Podem evoluir e tornar-se artefatos teis para todo o desenbvolvimento (como os
use cases usados em Objectory [Jacobson 92] e UML), e que podem ser
aumentados e rearranjados a medida em que o desenvolvimento avana.
124
Anlise Contextual: Como

Coletar?
Tcnicas de Coleta
Tcnicas Baseadas em Comunicao

(TBC)
Entrevistas, Surveys, Questionrios, Grupos

de Foco, Contextual Inquiry
Tcnicas Baseadas em Estudo (TBE)

4) Quais comandos e aes o usurio pode realizar

atravs da interface?
Estudo de Formulrios e Manuais, Reviso

Bibliogrfica, Anlise dos Sistemas
Existentes, Instantneos de Telas
Projeto da Interface
Tcnicas Baseadas em Observao

(TBO)
Imerso, Observao (Direta, Verbalizada,

Seguida de Dilogo), Etnografia
Projeto de Dilogo
Projeto da Apresentao
125
126
Prototipao/Maquetagem
6) Como provocar as crticas/sugestes dos

usurios?
Prottipo: verso simplificada do sistema

Prottipo Horizontal:
Amplitude: Interface quase completa mas com
funcionalidade reduzida
Prottipo Vertical:
Profundidade: Interface e Funcionalidade
completas de uma parte do sistema
127
128
Ciclo de Experimentao/Avaliao/Reviso
Maquetagem
Maquete: verso simplificada da interface

do sistema sem funcionalidade afora a
navegao
1.Construir Primeiro Prottipo/Maquete

2. Submet-lo ao Usurio
3. Usurio executa tarefas reais em ambiente real ou usurio
simula seu uso em laboratrio (ensaios de interao)
4. Recolher crticas/sugestes/comentrios sobre esta verso
5. Se Usurio acha OK, fim
6. Seno, Revisar/Alterar a verso levando em conta as crticas
do usurio e repetir passos 2-6.
Crticas
Crticas Especficas so mais preciosas

que crticas gerais
129
130
Concepo de IU do Sw
interativo
7) O sistema e sua interface suportam

adequadamente as tarefas dos usurios?
Avaliao
131
atividade multidisciplinar
(Informtica, Ergonomia,
Psicologia Cognitiva,
Lingustica, Design Visual
e Grfico, entre outras)
em equipe ou por indivduos
com conscincia de outras
reas
tradicionalmente, no faz
parte da formao de
profissionais de Informtica
132
SW Interativo:
Tipos de Concepo
Concepo Tradicional
Pouca ou nenhuma considerao ao ponto

de vista do usurio e aos aspectos de
usabilidade
Orientao a sistema:
Concepo Tradicional (Engenharia

de Software)
Concepo Centrada no Usurio

Concepo Integrada
ausncia de modelos para IHC

qualidade interna tem mais prioridade que
qualidade externa
Design from user
133
134
Concepo Centrada no
Usurio
Concepo Centrada no
Usurio
Considerao dos aspectos cognitivos

e fsicos do usurio

Orientao a qualidade externa

Centrar no Usurio:
qualidade interna considerada apenas

superficialmente
Design for user

135
Conhecer o usurio: objetivos, tcnicas, caractersticas

Adaptar o sistema ao usurio e no o usurio ao
sistema: vocabulrio, experincia, necessidades
Dar o mximo de controle ao usurio: feedback,
correo, escolha de alternativas e caminhos
Auxiliar o usurio: guiar se necessrio, mensagens
explicativas, help on-line, documentao
Perdoar o usurio: no exigir leitura de manuais, prevenir
erros, explicar os erros, desfazer erros
136
Concepo Integrada
Considerao de aspectos contextuais da

realizao do trabalho do usurio alm dos
aspectos cognitivos e fsicos do usurio:

Concepo Integrada

centrada no trabalho do usurio

Noo confirmada pela Teoria da Atividade
Necessidades solicitadas explicitamente

pelo usurio (requisitos do usurio) +
Necessidades:
Implcitas, identificadas pela anlise da tarefa, nem

sempre reconhecidas ou expressas pelos usurios
Contingentes, relativas s regras organizacionais

associadas s atividades dentro de um processo da
organizao
Busca integrada da qualidade externa e

interna
Design for user needs
Aceitao do sistema depende mais da

qualidade de suporte a algumas tarefas e
menos da quantidade de funes
suportadas
137
Integrao de Engenharia de
Software e IHC
138
Concepo Integrada usa

Ciclo de Experimentao/Avaliao/Reviso:
Fatores de Qualidade e Requisitos para Sistemas Interativos

Fator de Qualidade
Requisitos
Utilidade
Funcionais
Engenharia de Software (ES)
Usabilidade
Comportamentais
IHC
Desenvolvimento de sistemas
interativos teis e usveis
1.Construir Primeiro Prottipo/Maquete

2. Submet-lo ao Usurio
3. Usurio executa tarefas reais em ambiente real ou
usurio simula seu uso em laboratrio (ensaios de
interao)
4. Recolher crticas/sugestes/comentrios sobre esta
verso
5. Se Usurio acha OK, fim
6. Seno, Revisar/Alterar a verso levando em conta
as crticas do usurio e repetir passos 2-6.
rea
Integrao de conceitos,
modelos, tcnicas e
ferramentas de ES e IHC
139
140
Concepo Integrada usa

Prottipo: verso simplificada do sistema

Aspectos Envolvidos
Prottipo Horizontal:
Amplitude: Interface quase completa mas com funcionalidade
reduzida
Prottipo Vertical:
Profundidade: Interface e Funcionalidade completas
de uma parte do sistema
Usurios
Tarefas
Tecnologia Disponvel
Maquete: verso simplificada da interface sem

funcionalidade, somente com navegao
141
142
Usurios (2/2)
Usurios (1/2)

Usurio Cliente
Diferentes tipos de usurios

diferentes personalidades, motivaes, culturas, idades,

experincias, habilidades, necessidades
todo usurio tem receios: parecer burro, aprender algo
novo, ser substitudo, destruir algum dado, etc.
P.ex: Quanto a nvel de experincia no uso de
computadores:
experiente
Pnico
Necessidade
de atalhos
mediano
novato
leigo
* Perfis Diferentes de Usurios

* Experts x Novios:
- Novios tornam-se experts
- Novios co-existem com experts
- Aceitao implica contentar vrios perfis
* Usurios com necessidades especiais:
- fsicas, cognitivas,etc.
- acessibilidade
+
143
144
Tarefas
Tecnologia Disponvel
Fazem parte dos processos de trabalho

(business process)
Grande maioria das tarefas NO se concentram
unicamente no sistema :
Manuais , Automticas e INTERATIVAS:
Responsabilidades dos Usurios que o
sistema deve apoiar !!
Influenciadas pelo ambiente de trabalho
(configurao fsica) e aspectos
organizacionais (papis, dependncias, etc)

Hardware
Software de suporte (sist.
Operacional)
Ferramentas para desenvolvimento de
IHM:

Toolkits e/ou Editores de Recursos

Estilos de Interao
Objetos de Interao
145
146
Estilos de Interao
Estilos de Interao
Menus (*)
Teclas Rpidas (Atalhos) (*)
Preenchimento de Formulrios (*)
Linguagem de Comando
Questo/Resposta (*)
Linguagem Natural
Manipulao Direta(*)
Realidade Virtual
Em geral vrios estilos coexistem em uma

Menu: lista de opes

Ex. 2
Ex. 1
Ex. 3
Opes:
01 - Saque
02 - Extratos
03 - Saldo
04 - Transferncias
05 - Pagamentos
Entre com a opo:
147
148
Menus
Menus
seleo de itens
organizao hierrquica explcita
usurios pouco treinados ou ocasionais
atrativos
fcil treinamento
Barra de Menu + Drop-down:

agrupados por funo
Cascading:
hierarquizar grupos de muitas funes
indicar existncia por seta triangular 8
Uso deve ser minimizado
Uso PROIBIDO para comandos frequentes !!
Pop-UP:
na posio do cursor
agrupados por objeto apontado
149
Estilos de Interao
150
Teclas de Atalho
Teclas rpidas (atalhos)

P.ex.: Microsoft POWERPOINT 97:

ALT-E - Ativa menu Editar

ALT-A - Ativa menu Arquivo
CTRL-X - Recortar objeto selecionado
CTRL-C - Copiar objeto selecionado
CTRL-V - Colar seleo no local indicado
F7 - Verificar ortografia
ATENO: Teclas de Atalho Inconsistentes (Ver select all) !!!
151
152
Formulrios
Estilos de Interao
excelente para aquisio de dados

exige conhecimento sobre o campo a ser preenchido
complementa o uso de menus
Preenchimento de Formulrios
formulrio eletrnico similar a formulrios em
papel: adequado para entrada de dados atravs
de digitao de valores em vrios campos,
identificados por rtulos.
Nome: ________________________
Data de Nasc: __________________
CPF: _________________________
Curso: ________________________
153
Linguagem de Comando
154
Estilos de Interao
interao baseada em comandos (ling. Imperativa)

considervel tempo de aprendizagem
alto desempenho com usurios experientes
ex.: MS-DOS, UNIX...
Linguagem de Comando: linguagem

imperativa para entrada de comandos
(vocabulrio limitado, sintaxe formalmente
definida)
P.ex. DOS:

P.ex. UNIX

155
dir /p
copy file.doc a:
ls -l
chmod a+r *.html
156
Estilos de Interao
Linguagem Natural
Questo/Resposta
Usurio deve fornecer respostas s

questes na ordem em que so
solicitadas. Interao totalmente
conduzida pelo sistema.
P.ex. Programas de instalao de nova
aplicao (software) ou novo dispositivo
(hardware) no Windows 95
Forma ideal de comunicao entre humanos...E

entre Humanos e Computadores ?
Linguagem Natural: usurio usa linguagem corrente,

mas ainda limitada a um vocabulrio exguo e a uma
sintaxe mais rigidamente definida tcnicas de
Inteligncia Artificial (IA)

uso via linguagem de comandos ou reconhecimento de voz.

precisa de dilogo claro (abrev. e grias so de difcil tratamento)
comunicao imprevisvel
ex.: OS/2 Warp, Elisa, Doktor/LISP
157
Manipulao Direta
158
Realidade Virtual
estilo GUI ou WIMP - janela,
cones, menu, cursores, mouse
usurio manipula diretamente
representaes visveis de
objetos
estado continuamente exibido e
alteraes so visveis
(feedback)
ex.: OS/Mac, Windows, Solaris,
Next, Motif, etc.
159
Uso de dispositivos para

aumentar a realidade de
ambientes virtuais
Interao em universos
3D
160
Importncia de Tarefas
Objetos de Interao
I. Painis de Controle
1.1 Janelas
1.2 Caixas de Dilogo
1.2.1 Fichas (folders)
1.2.2 Caixas de Mensagem
1.2.3 Formulrios
1.2.4 Paleta
1.2.5 Barra de Ferramentas
II. Controles Complexos
2.1 Painel de Menu
2.1.1 Barra de Menu
2.1.2 Painel de Menu Local
2.1.3 Painel de Menu em Cascata
2.1.4 Painel de Menu Hipertexto
2.1.5 Pgina de Menu
2.2 Listas de Seleo
2.3 Caixas de Combinao(combo box)
III. Grupos de Controle
3.1 Grupo de Botes de Rdio (radio buttons)
3.2 Grupo de Caixas de Atribuio (check box)
IV. Controles Simples

4.1 Grupo de Botes de Comando
4.2 Controle Deslizante (escala)
4.3 Calendrio
4.4 Interruptor
4.5 Boto de Rotao
4.6 Opo de Menu
4.7 Item de Seleo
4.8 Campo de Dado
4.9 Campo de Texto
4.10 Barra de Rolagem (scroll bar)
V. Mostradores
5.1 Tabelas de Dados
5.2 Listas
5.3 Mostradores Analgicos
5.4 Mostradores Digitais
5.5 Mostradores de Status
VI. Orientaes
6.1 Caixa de Agrupamento (group box)
6.2 Indicador de Progresso
6.3 Bolha de Informao
6.4 Rtulo (etiqueta)

Utilidade: adequao das funes do

sistema s tarefas do usurio
Usabilidade: adequao do suporte que o
sistema fornece s tarefas do usurio
Para isto :

Conhecer o Usurio
Conhecer as Tarefas
161
Sistemas Interativos so
Ferramentas
162
Definies
Sistema Interativo

Ncleo
Funcional
Tarefa
Tarefa
Modelo de Tarefa
Anlise de Tarefa
Interface
Usurio
Ferramenta: Transparncia, Flexibilidade,
Facilidade de Uso, Intuitividade no aprendizado
163
164
Tarefa
Tarefas
Uma tarefa um objetivo associado a

um conjunto ordenados de aes que
podem satisfazer tal objetivo nos
contextos apropriados [Storrs 95]
Tarefa = Objetivo + Mecanismos

Aes orientadas a objetivos que um

agente (usurio ou sistema) realiza por
meio de mecanismos
Integrantes do processo de trabalho
(business process)
Conhecer o Trabalho para Modific-lo

Anlise Ergonmica do Trabalho

Lgica de Funcionamento e de Utilizao

Anlise de Tarefa (Task Analysis)
Modelo de Tarefa
165
166
Anlise de Tarefa voltada a

Lgica de Uso
Anlise de Tarefa
Anlise de Tarefa (AT) o termo

genrico para um conjunto de mtodos
para descrever as tarefas das pessoas
visando entender melhor os
procedimentos para sua realizao.
[UsabGlossary]
Lgicas do Sistema
Lgica de Funcionamento (projetistas)

Representao baseada em aspectos internos

Lgica de Uso ou Operao (projetistas e

usurios)
Representao baseada em aspectos visvei

167
funes e mecanismos internos dos dispositivos,

as inter-relaes entre esses mecanismos.
na interao com os dispositivos.

nas repercusses visveis do sistema
Sistema mais usvel se mantm coerncia com o

modus operandi atual da tarefa do usurio
168
Lgica de funcionamento vs
de Uso
Exemplo
Lgica de Funcionamento
(Viso do Analista)
Lgica de
funcionamento
reflete as funes
internas de
manipulao do BD
PRODUTO
1..1
1..*
1..*
FORNECEDOR
Propor uma configurao de menus que

permita manipular informaes (I,R,C,A)
nesta base
Produto
Inserir
Remover
Modificar
Consultar
Fornecedor
Inserir
Remover
Modificar
Consultar
169
170
Extrado da anlise da tarefa

Lgica de Uso
MUITO FREQUENTE : o usurio insere um

novo produto de um novo fornecedor;
Organizar manipulao de produtos de acordo com a anlise da tarefa

Inserir Produto
Consultar fornecedor
PORTANTO deve haver um caminho a

partir da insero de produto para chegar
diretamente insero de fornecedor ...
Inserir fornecedor
Consultar Produto
Modificar Produto
Consultar fornecedor
Inserir/Modificar fornecedor
Remover Produto
171
172
Modelo de Tarefa
Modelo de Tarefa
Modelo de Tarefa (MT) uma

descrio lgica das atividades a
serem executadas para alcanar os
objetivos do usurio.[Patern 2001]
Descrio das Tarefas do Usurio

para atingir um certo objetivo (com
ou sem sistema)
Componentes Bsicos:
Decomposio da tarefa:

173
Modelo de Tarefas

Modelo de Tarefa vai influir diretamente no

Projeto de Dilogo e indiretamente no
Projeto da Apresentao !!
Condies (pr/ps) da execuo

Informaes relacionadas s subtarefas
(entrada/sada)
Atributos:
Procedimento (relao temporal/causal entre

subtarefas: seqncia, paralelismo, sincronizao)
174
Anlise de tarefa
Elementos Adicionais
Objetivo
Subtarefas, aes, operaes
Anlise (das atividades) do trabalho

Anlise Hierrquica de Tarefa (ou

Planificao Hierrquica)
freqncia (espordica, anual, semestral,

mensal, diria, constantemente usada)
importncia/prioridade
interrompvel/ multitarefa
175
mais comumente usada
Anlise Cognitiva de tarefas
176
Anlise Hierrquica de tarefas
Anlise de tarefas
Goal
Etapas:
Goal1
Goal 2
Goal n

Goal 1.1
Operation
1.1.1
Operation
1.1.2
Goal 1.2
Inventariar tarefas
Selecionar tarefas (+ freqentes e/ou crticas)
Descrever (modelar) tarefas
Validar tarefas
Goal 1.n
Operation
1.1.3
177
Modelagem da tarefa
Exemplo de AHT: Making Tea
Objetivo : descrever a maneira tpica

utilizada pelo usurio de um
determinado sistema para atingir um
objetivo estabelecido
178
objetivo: estado final da interao

homem-sistema
A tarefa descrita como um conjunto

de passos que podem ser
seqenciais, paralelos, entrelaados,
etc)
179
180
Exerccios
Categorias de tarefas
Elaborar um modelo de tarefa para:

1) preparao de um bolo de laranja
* algum tem uma boa receita?
2) as tarefas de busca, seleo e
compra de um produto on-line (ecommerce)
Tarefa prescrita (prevista)

Oficial, presente nos treinamentos e

manuais
geralmente descrita nas entrevistas !!
Tarefa efetiva (real)

Coletada por observao
181
182
Os diferentes modelos de tarefa
Anlise de Tarefa: Como Coletar?

Tcnicas de Coleta
Tcnicas Baseadas em Comunicao (TBC)

Entrevistas, Surveys, Questionrios, Grupos de

Foco, Contextual Inquiry
Tcnicas Baseadas em Estudo (TBE)

Estudo de Formulrios e Manuais, Reviso

Bibliogrfica, Anlise dos Sistemas Existentes,
Instantneos de Telas

Tcnicas Baseadas em Observao (TBO)

Modelo de tarefas cognitivas do usurio

(cognitive model)
Modelos de tarefas interativas (interactive
task model ou dialog model)
Imerso, Observao (Direta, Verbalizada,

Seguida de Dilogo), Etnografia
Modelos de tarefas do usurio (user tasks

model)
183
Sistema existente
Sistema futuro (projeo)
Atividade do usurio
184
Uso de modelos de tarefa

Notaes de modelos de tarefa
Aumentar a compreenso (do uso) de uma

aplicao
Registrar os resultados (intermedirios ou
finais) de discusses multidisciplinares
Auxiliar no design
Auxiliar na avaliao de usabilidade
Auxiliar na avaliao da eficcia e performance
Documentao

MAD (INRIA)
UAN (User Action Notation)
(a famlia) GOMS, KLM
CTT (Patern)
Diferentes notaes (textual e grfica)
Diferentes nveis de rigor
Diferentes operadores para decomposio da
tarefa
185
186
CTT
Links principais
CTT
CTTE (Ambiente CTT):

187
http://giove.isti.cnr.it/tools/CTT/home
http://giove.isti.cnr.it/tools/CTTE/home
188
Modelo de Tarefa CTT
ConcurTaskTrees
Types of Tasks
Icon
Description
Temporal Relations
Icon
Description
Syntax
[]
Choice
T1 [] T2
|=|
Order Independency
T1 |=| T2
|||
Concurrent
T1 ||| T2
|[ ]|
Concurrent with
information exchange
T1 |[ ]| T2
Unary Operators
[>
Disabling
T1 [> T2
Icon Description Syntax
|>
Suspend/Resume
T1 |> T2
Abstraction Task
Application Task
Interaction Task
User Task
Iterative
T1 *
>>
Enabling
T1 >> T2
[]
Optional
[ T1 ]
[] >>
T1 [] >> T2
Connection
T1
Enabling with
information exchange
189
190
Exerccio
Tipos de tarefas
Interativas (interaction tasks)
Seleo
Edio
Controle
Deciso
Criar modelos de tarefa para uso

de um caixa eletrnico
Aplicao (application tasks)

Computar
Comparar
Localizar (Find)
Imprimir
...
191
192
Exerccio: restries
Exerccio: tarefas
Inserir_Carto, Entrar_Senha, Retirar_Carto
Invocar_Saque, Fornecer_Valor, Retirar_Cdulas

Re quest_Ca sh
be fore

Objetivo : Obter dinheiro ($$)

Pr-requisitos:

Se le ct_ Amo un t
Sel ect_Amount
an d
Insert_ Ca rd
be fore
Insert_ Ca rd
be fore
En te r_Co de
ju st after
Wi thdra w _Cash
Ter um carto
Saber valor desejado
Conhecer a senha
Resultados
Wi thdra w _Card
Insert_Ca rd
Obter dinheiro
Conservar o carto
Obter recibo
193
194
Usos possveis de modelos de tarefa
Exerccio
195
Avaliar complexidade de realizao de uma dada

tarefa
Otimizar o sistema para facilitar a realizao de

tarefas tpicas (freqentes e/ou crticas)
MAS PRINCIPALMENTE construir um sistema de

acordo com a lgica de uso e no com a lgica de
funcionamento !!
196
Construir um sistema conforme a

lgica de uso
Requisitos (1/2)
Construir um sistema de acordo com a lgica de

uso e no com a lgica de funcionamento:
Definio de requisitos
Design de interfaces WIMP
Design de interfaces Web
Avaliao de interfaces
Viso histrica: requisitos so funes

Viso atual:
Requisitos so objetivos, funes, propriedades,
restries que o sistema deve possuir/obedecer para
satisfazer contratos, padres ou especificaes de
acordo com o(s) usurio(s)
Requisito:
condio (predicado) necessria para
satisfazer um objetivo
Especificao: plano para uma soluo
Programa: soluo
197
198
Suposies (implcitas) Anlise ...
Requisitos (2/2)
Classificao de Requisitos:
Requisitos Funcionais
O qu o sistema deve fazer : funes
e informaes
Requisitos No-Funcionais
Requisitos de performance
Requisitos de confiabilidade e robustez
Requisitos de interao e usabilidade
Restries para concepo

H um problema bem definido e estvel;

Especificao de Requisitos = contrato congelado
entre analista e cliente (usurio)
Cliente conhece bem seu domnio e sabe bem o que
quer: basta saber lhe interrogar corretamente
Processo linear baseado em abstraes: possvel
atingir um conjunto completo, coerente e no ambguo
de requisitos mesmo sem a participao do usurio
Assim, Mtodos de Anlise so generalizaes de
mtodos de projeto e programao
Prioridades variam conforme a natureza do SW, o contexto de

desenvolvimento e as decises dos usurios!!
199
200
... Mas de fato...

Ciclo da Engenharia de Requisitos
O problema a ser resolvido (e seu domnio) no claramente

delimitado nem descrito e est em constante mudana;
Os requisitos mudam mesmo durante o desenvolvimento
O cliente no sabe bem o que quer : em geral, suas exigncias
emergem ou se modificam a partir de interaes com o analista e
verses preliminares do sistema
Nem sempre se chega a especificaes corretas e completas: deve-se
lidar com diferentes graus de incompletude e inconsistncia e atribuir
prioridades diferentes aos requisitos
Determinao: identificao das fontes de

informao; coleta, refinamento e integrao de
informaes
Expresso: representao das informaes

obtidas; representao das vrias verses dos
requisitos
Engenharia de Requisitos :
Mudana de ponto de vista em relao Anlise
Enfoque sistemtico para identificao e manuteno
dos requisitos
Validao: avaliao da informao recolhida e

representada quanto correo, completude,
coerncia para o(s) usurio(s)
201
Ciclo da Engenharia de
Requisitos
202
Expresso de requisitos
o Estabelecer um conjunto de requisitos consistentes e sem
ambigidades, que possa ser usado como base para o
desenvolvimento do software
Os processos de engenharia de requisitos

variam de uma organizao para outra, mas a
maioria dos processos de Engenharia de
Requisitos composta das seguintes
atividades
o Deve-se classificar os requisitos em: Funcionais e no funcionais

o Para esta atividade, alguns tipos de modelos podem ser construdos
o Um modelo uma representao de alguma coisa do mundo real,
uma abstrao da realidade, e, portanto, representa uma seleo
de caractersticas do mundo real relevantes para o propsito do
sistema em questo
Determinao: identificao das fontes de

informao; coleta, refinamento e integrao de
informaes
Expresso: representao das informaes
obtidas; representao das vrias verses dos
203
204
Expresso de requisitos
Modelos e Requisitos
o Modelos
o So
fundamentais no desenvolvimento
sistemas e so construdos para:
Modelos auxiliam Analistas a :
de
Comunicar com clientes e aumentar compreenso do domnio do

problema e do sistema a ser desenvolvido
Explorar mltiplas solues (sem implement-las)
Permitir abstraes para gerenciar complexidade e ocultar
detalhes
Analisar os modelos para verificar se determinados requisitos e
propriedades esto presentes (ou ausentes)
Determinar como certos requisitos esto sendo derivados dos
existentes e quais artefatos correspondem a quais requisitos...
o Auxiliar no estudo do comportamento do sistema

o Facilitar a comunicao entre os componentes da
equipe e clientes e usurios
o Facilitar a discusso de correes e modificaes com o
usurio
o Formar a documentao do sistema
205
206
Casos de uso e requisitos

Casos de Uso: DICAS
Um caso de uso deve:
o Caso de uso um documento narrativo que
* cobrir TODA a sequencia de passos do INICIO ao FIM da tarefa
descreve a seqncia de eventos de um ator (um

agente externo) que usa um sistema para completar
um processo;
* Descrever a INTERAO do ator com o sistema

- NO as computaes que o sistema executa
o Um diagrama de Caso de Uso descreve um cenrio

que mostra as funcionalidades do sistema do ponto
de vista do usurio
* Ser escrito idealmente de forma INDEPENDENTE DE TECNOLOGIA e

de DESIGN DE INTERFACE COM USURIO
* Somente incluir aes em que o ator interage com o SISTEMA
(realizadas atravs do sistema)
o O cliente deve ver no diagrama de Casos de Uso as

principais funcionalidades de seu sistema
- NO aes realizadas manualmente

207
208
Caso de Uso Preliminar
Tipos de casos de uso

Casos de uso so informais
Podem ser usados a vrios nveis de abstrao
Contedo pode ser adequado s necessidades da aplicao
Encomenda Produto
Diagrama de Caso de Uso Preliminar

(trecho mostrando apenas 1 ator)
Tipos de casos de uso
Consulta Catlogo
Preliminar (ou alto-nvel)

Conceitual, abstrato e pouco detalhado (independente de implementao)
usados na especificao de requisitos e delimitao de escopo no incio da
anlise
Essencial (ou expandido)

Conceitual (independente de implementao)
Detalhado em termos de funcionalidade
Real (ou concreto)

Concreto (dependente de tecnologia)
Detalhado em termos de funcionalidade, comportamento (operao) e
referncias a interface
Cliente
Formato Textual Bsico
Altera Encomenda
Caso de Uso: Encomenda Produto

Atores: Cliente
Descrio: Cliente solicita produtos presentes no catlogo, fornecendo
seu cdigo e a quantidade desejada. Cliente escolhe forma de entrega e de
pagamento. Lista de produtos encomendados exibida ao Cliente que
confirma (ou no) a encomenda.
209
Caso de Uso Preliminar

Diagrama de Caso de Uso Preliminar
210
Grfico sobre Nveis de Casos de Uso

Encomenda Produto
Consulta Catlogo
Formato Textual Bsico
Cliente
Caso de Uso: Altera Encomenda

Altera Encomenda
Atores: Cliente
Descrio: Cliente altera dados da encomenda efetuada previamente por
ele. Os dados que podem ser alterados so: endereo de entrega do
produto, produto(s) encomendados, quantidade(s) de produto(s), DESDE
QUE a encomenda no esteja sendo entregue. Nova encomenda
exibida ao Cliente e este confirma (ou no) a (nova) encomenda. Se
no confirmar, continua valendo a antiga encomenda.
211
Fonte: Cockburn, A. Escrevendo Casos de Uso Eficazes, Bookman, 2004

212
(Um) Formato de Escrita de Casos de Uso
Descrio dos passos de caso de uso

(essencial)
Sistema mostra estar Pronto para Uso
A. Nome significativo, iniciando por Verbo

B. Atores : o iniciador e os participantes
Cliente Identifica-se
C. Objetivos que os atores querem atingir
Cliente Seleciona Saque
D. Pr-condies: estado antes do caso de uso
Cliente Fornece Valor
E. Resumo: Descrio sucinta (1 pargrafo) e informal

F. Passos
G. Ps-condies: estado aps caso de uso
Os elementos mais importantes so A, B e F
Cliente Retira Cdulas e Recibo
Verifica Identificao
Fornece Opes de Operaes
Verifica Opo Selecionada
Solicita Valor de Saque
Verifica se valor vlido
Verifica saldo do Caixa Eletrnico
Verifica saldo disponvel na C. Corrente
Processa Saque
Disponibiliza Cdulas
Disponibiliza Recibo
Encerra Saque
213
O Processo de Escrita de Casos de Uso
214
Casos de uso alternativos
1. Especifique o escopo e os limites do sistema.

2.
3.
4.
5.
6.
7.
Faa brainstorming e liste os atores primrios (humanos ou no) do sistema.

Faa brainstorming e liste exaustivamente os objetivos dos atores com o sistema.
Capture os casos de uso preliminares para cada ator primrio.
Revise os casos de uso preliminares.
Selecione um caso de uso para expandir (criando o formato essencial)
Capture os stakeholders e interesses, pr-condies e garantias.
O sistema assegurar as pr-condioes e garantir os interesses.
8. Escreva o cenrio de sucesso principal (CSP).

Use de 3 a 9 passos para satisfazer todos interesses e as garantias.
Percorrer o caso de uso bsico em busca de

aes alternativas ou optativas (casos de uso
alternativos)
possibilidades de erro, obstculos e singularidades
(casos de uso de exceo: E se ...?
aes que se repetem em diversos cenrios (casos de
uso extenso)
9. Faa brainstorming e liste exaustivamente as condies de extenso.

10. Escreva os passos de tratamento de extenso.
Cada um terminar voltando para o CSP, em uma sada de sucesso separada, ou na falha.
11. Refatore: Decomponha em sub casos de uso; junte sub casos de uso triviais.
12.
Reajuste o conjunto: Verifique a legibilidade, integridade, e satisfao dos interesses
dos stakeholders.
215
216
Exemplo de Identificao de Caso de

Uso Alternativo
ID da ao
do episdio
onde a singularidade
acontece
3
Problema
Singularidade
(Causa do problema)
Aes (D)efensivas ou
(C)orretivas
S09
ID do
episdio
onde a singularidade
acontece
EP3
Valor de saque incorreto
Cliente entrou com valores

incorretos
S10
EP3
Valor de saque no
escolhido
S11
EP3
Dinheiro insuficiente
Cliente no entra com o

valor de saque a tempo
(timeout)
O valor do saque escolhido
excede a quantia disponvel
no caixa eletrnico
S12
EP3
Saldo Insuficiente
(C) Notificar o cliente e

permitir escolher o valor,
novamente
retornar ao estado inicial,
pr-condio do episdio
(C) Informar o cliente da
quantia disponvel e
permitir que escolha esta
quantia
(D) Exibir o saldo da
conta do cliente
permitir escolher o valor
,novamente
retornar ao estado inicial,
pr-condio do episdio
ID da
singulalaridade
S13
EP3
Casos de Uso Essenciais

O valor do saque escolhido

excede o saldo da conta do
cliente
Transao no confirmada
Cliente no confirma a
transao a tempo (timeout)

217
Exemplo de caso de uso normal:

Realizar Saque
Intenes do Usurio
(a partir de MT):
Cliente Identifica-se
Cliente Seleciona Saque
Cliente Fornece Valor
Podem originar Casos de Uso Alternativos alm do

Normal, que envolvem aes alternativas ou opcionais
Podem originar subsees de exceo (uma para cada
desvio) ou aes repetidas na seqncia tpica de eventos
do caso de uso Normal
Possibilidades de erro, obstculos e singularidades (casos
de uso de exceo: E se ...?
218
Aplicando Casos de Uso: Roteiro
Responsabilidades do Sistema
Analisar Processos de Negcio

Identificar Atividades a serem realizadas por um sistema
computadorizado
Listar funes do sistema, definir fronteiras, identificar atores e casos
de uso
Escrever todos casos de uso em um formato Preliminar
Sistema Pronto para Uso

Verifica Identificao
Fornece Opes de Operaes
Verifica Opo Selecionada
Solicita Valor de Saque
Verifica se valor vlido
Verifica saldo do Caixa Eletrnico
Verifica saldo disponvel para saque
da Conta Corrente
Processa Saque
Disponibiliza Cdulas e Recibo
Cliente Retira Cdulas

e Recibo
Encerra Saque
Descrevem Casos de Uso de Alto Nvel de forma

independente de tecnologia
Representao de Intenes do ator e
Responsabilidades do sistema
Caso de Uso normal: a histria normal das
atividades e do trmino bem-sucedido de um
processo; descreve a seqncia tpica de eventos
Desenhe diagrama de casos de uso preliminares

Refine os casos de uso mais crticos e/ou freqentes no formato
Essencial expandido; postergue os demais se preciso at a fase de
projeto
219
220
Modelos de tarefa para Design

de Interfaces

de Interfaces
Requisitos do Sistema:
Sistemas raramente so construdos

para suportar tarefas iguais s atuais
Nova tarefa

Requisitos determinam:

mudanas nas tarefas e no suporte a elas

aspectos de tarefas que no devem mudar

221

de Interfaces
Tarefa do sistema: Interativa ou

automtica
Criada a partir do modelo de tarefas
atuais como um processo de re-design,
de acordo com os requisitos
Projeo explcita permite explorao e
avaliao de alternativas de concepo
Geralmente representada na mesma
notao da tarefa atual
222

de Interfaces
Heursticas para Projetar novas tarefas

Delimitar o escopo de concepo:
Re-engenharia de tarefas : eliminar tarefas
desnecessrias mas no reduzir o que atualmente
possvel
Identificar as tarefas do usurio e do sistema
Melhorar o trabalho
Identificar sequncias que podem ser facilitadas
Identificar informaes usadas conjuntamente
Ser mais eficiente e mais simples de realizar que a
tarefa atual
Sistematizao da construo de um prottipo que

ser exercitado at verso final
Processo guiado pelas informaes obtidas na
Anlise Contextual:
Das tarefas atuais a novas tarefas
De novas tarefas a um modelo abstrato de
interface
Do modelo abstrato de interface a um prottipo
Novas
Tarefas
223
Modelo
abstrato
de Interface
Prottipo
Projeto de Interfaces
224

de Interfaces

de Interfaces
Modelo Abstrato de Interface

Descrio de alto nvel da interface

Apresentao: Unidades de
Apresentao mas no definio final da
aparncia
Dilogo: Sequncias de Interao mas
no detalhes de comportamento
Comparvel ao modelo de alguns
enfoques baseados em modelos (modelbased) para design de interfaces
225
Do Modelo de Tarefas IU:

Dilogo de
Alto Nvel
Projeto de Dilogo:
226

de Interfaces
Design da Interface
Prottipo
Representao Concreta do sistema proposto
Implementao do modelo abstrato da interface
Composto por objetos de interao (widgets),
com comportamento, aparncia e sequncia de
uso definidas
Pode ser descrito em papel (p.ex. storyboards)
ou ser executvel, possivelmente gerado
automaticamente
definir o dilogo de alto nvel (inter UAs)

definir o dilogo de baixo nvel (intra UAs)
Unidades
de Apresentao
Modelo Abstrato da Interface

definio de unidades de apresentao (UA)

seleo dos objetos de interao dentro das UAs
respeito a princpios, recomendaes e normas
ergonmicos
limitada s opes tecnolgicas disponveis
Dilogo
de Baixo Nvel
Estilos de Interao
e Objetos de Interao
Prottipo
227
Projeto de Dilogo
Projeto de Apresentao
228
Design da Interface
(viso geral)
Modelo de Tarefas
Design da Interface
Recomendaes
e Normas
Ergonmicas
Modelo.
de
Usurio
Do Modelo de Tarefas IU:

Projeto de Dilogo:
Definir UAs
Proj. Dilogo
Alto Nvel
Selecionar Estilos
e Objetos de Interao
Projeto de
Dilogo
Proj. Dilogo
Baixo Nvel
Projeto de
Apresentao
Opes
Tecnol.
Disponveis
definir o dilogo de alto nvel (inter UAs)

definir o dilogo de baixo nvel (intra UAs)
definio de unidades de apresentao (UA)

seleo dos objetos de interao dentro das UAs
respeito a princpios, recomendaes e normas
ergonmicos
limitada s opes tecnolgicas disponveis
229
230
Design da Interface
Design da Interface
Projeto de Dilogo
Objetivo: especificar os comandos do usurio,
as tcnicas de interao, as respostas da IU

(feedback e mensagens), seqncias de
comandos disponveis na IU durante a
realizao das tarefas.
Caractersticas dinmicas da IU:

seqncia entre aes, iniciativas do usurio e
do sistema, caminhos possveis, etc
Deve ser conduzido pelo modelo de

tarefas do usurio para refletir o modo do
usurio de realizar a tarefa
231
Seleo de estilos e de objetos de

interao
Uso de heursticas de projeto e/ou guias
de estilo e respeito s normas,
recomendaes e plataformas existentes
(Motif, Windows,etc)
Caractersticas da IU: layout,
organizao e atributos como fontes e
cores
232
Projeto de Apresentao a partir do

MT : seleo de objeto de interao
para tarefa
Design de Interface
Known
domain:
``A combo box is a text box with an

attached, integrated and interdependent
list. Combo boxes are useful when the
application requires user input and can
display a list of possible responses. The
user can type a response in the text box if
the correct one is not available in the
list. .''
(The Windows Interfaces:
An Application Design Guide, p.114).
Number of possible values
[2,3]
[4,7]
[8,50]
]50,+[
233
Projeto de Apresentao a partir

de operadores temporais do MT
Projeto de Apresentao a partir

de operadores temporais do MT
234
Operador Desactivation . As tarefas

devem ser prximas para mostrar a
correlao
235
Operador Escolha (T1[] T2)
236
Projeto de Dilogo a partir de

operadores temporais do MT
Design da Interface
Definio do dilogo de alto nvel (inter UAs): Flipbook

UAs podem ser seqenciais ou simultneas

Eventos podem ser acionados por usurios ou pela aplicao
UA-2
E1
E4
UA-1
E2
E3
UA-3
UA-5
Tarefas concorrentes (|[]|) so

apresentadas umas s outras
Lista de Eventos:
E1 - Tecla F1 (fsico)
E2 - On enter (lgico)
E3 - CPF-OK (semntico)
E4 - ...
E5
UA-4
E6
UA-6
Legenda:
E7
UA
(Tela Miniatura)
Evento
237


Operador Activation (T1>>T2)

Exemple :
238
Operador Activation e troca de

informaes ([]>>).
Tarefas podem (ou no) ser apresentadas na
mesma janela
Uma opo de menu

desabilitada
Situations 2 and 3
Situation 1
Name:
Jo*
Submit
Results:
Name
Johansen
Jones
Joxibon
239
Age
52
27
18
Name:
Jo*
Age:
>20
Submit
Results:
Name
Johansen
Jones
Age
52
21
240
Respeito a recomendaes e
normas ergonmicas
Design de Interface
Respeito a Recomendaes e Normas Ergonmicas:

Consideraes sobre configurao (layout,

cores, disposio,etc) dos objetos de Interao
Recomendaes refletem experincia acumulada por

pesquisadores de IHC
Exemplo: Recomendaes do LabiUtil
http://www.labiutil.inf.ufsc.br/ergolist/rec.htm
Normas: elaboradas por Institutos de Padronizao Oficiais
Exemplo: Normas da ISSO, ABNT, etc
Normas de usabilidade ISO

ISO 9126 -Caractersticas de qualidade
ISO 9241 - Ergonomia de Soft. Escritrios
Voltada a Trabalho de escritrio informatizado
Contexto: tipos particulares de usurios, tarefas,
ambientes e tecnologia).
prevista uma sistemtica para definir a aplicabilidade
das recomendaes.
ISO 11581 - cones - Design
ISO 14915 - Multimdia IU Design
ISO 14598 - Projeto de Avaliao
241
242
Norma ISO-9241

Norma ISO-9241
Parte 10: Princpios de dilogo - IS/EN
Parte 11: Especificao da usabilidade - IS/EN.
Parte 12: Apresentao da informao - FDIS.
Parte 13: Conduo ao usurio - IS/EN.
Parte 14: Dilogo por menu - IS/EN.
Parte 15: Dilogo por linguagem de comandos - IS/EN.
Parte 16: Dilogo por manipulao direta - FDIS.
Parte 17: Dilogo por preenchimento de formulrios FDIS.
Obs.:
IS/EN: Norma Internacional e Europia aprovada
FDIS: Verso final da norma para votao
Parte 1: Introduo geral.

Parte 2: Conduo quanto aos requisitos das tarefas.
Parte 3: Requisitos dos terminais de vdeo.
Parte 4: Requisitos dos teclados.
Parte 5: Requisitos posturais e do posto de trabalho.
Parte 6: Requisitos do ambiente.
Parte 7: Requisitos dos terminais de vdeo quanto as
reflexes.
Parte 8: Requisitos dos terminais de vdeo quanto as
cores.
Parte 9: Requisitos de dispositivos de entrada, que no
sejam os teclados.
243
244
Exemplo 1 de recomendao
Parte 14 - Dilogo por Menu
Exemplo 2 de recomendao
Parte 14 - Dilogo por Menu
Opo default
a) Opo mais freqente - Se a freqncia da seleo de
opo conhecida e uma das opes tem uma maior
probabilidade de seleo que as outras.
b) Opo precedente - Para tarefas repetitivas, o cursor
deveria ser colocado sobre a opo no grupo que foi a
ltima selecionado pelo usurio .
c) Primeira opo - Se a repetio da seleo de opo
no considerada importante e no se conhea a
frequncia de seleo.
d) Opo menos destrutiva - o cursor deveria ser
colocado na opo menos destrutiva do grupo.
Levando para outro painel ou caixa de dilogo

Indicaes consistentes devem ser fornecidas ao
usurio caso uma opo leve para outro painel ou
para uma caixa de dilogo (em vez de executar uma
ao).
EXEMPLO: uma seta (>) apontando para a direita no final do
rtulo da opo para indicar outro painel.
EXEMPLO: Reticncias (...) poderiam ser utilizadas para
indicar outro dialogo.
245
246
Exerccio 1

Exerccio 2
Trabalhar em duplas
Criar um modelo de tarefa visando desenvolvimento de um sistema de
agendamento (incluindo proposio, marcao e confirmao) de
reunies
Pensar em:

como configurar agendas dos membros e da ocupao dos locais

permitir formao de agendas de grupos

permitir consulta a agendas individuais, de grupos e de outrem

proposio de reunies (data/hora, local, membros obrigatrios, pauta, etc.)

marcao exige confirmao dos participantes

divulgao e atualizao de agendas aps agendamento
Discusso com a turma e o professor
Definir grupos de 2 ou 3 alunos

O objetivo final do trabalho que inicia por esta tarefa a prototipao
de parte de um interface.
Nesta tarefa voc e seu grupo devem realizar o que segue:
a) Escolha um sistema com o qual esteja trabalhando ou aquele usado
para o exerccio 1
b) Descreva os usurios tpicos desse sistema.
c) Descreva duas tarefas de usurio que o sistema suporta. Cuide para
escolher uma tarefa de um nvel razoavelmente baixo para que o seu
detalhamento posterior no seja muito complexo. Por exemplo,
cadastro de um cliente, agendamento de atendimento.
d) Descreva os cenrios de uso do sistema para ambas as tarefas.

247

248
Exerccio 3
Qual o modelo de tarefa para o voto

eletrnico no Brasil?
Simulador da Urna Eletrnica Brasileira:

http://www.tse.gov.br/eleicoes/urna_eletronica/simulacao_votacao/Ur
naApplet2.htm
Anlise Contextual
249
250
4) Quais comandos e aes o usurio pode realizar
atravs da interface?
6) Como provocar as crticas/sugestes dos usurios a

respeito da interface projetada?
Projeto da Interface

Projeto de Dilogo
251
252
Tcnicas de Avaliao de
Interfaces
Verificao sem participao de Usurio(s)

baseada na confrontao com princpios, guidelines,
recomendaes e normas ergonmicas
baseada no julgamento do avaliador (avaliao heurstica)
baseada em modelos formais
7) O sistema e sua interface suportam adequadamente as

tarefas dos usurios?

Validao com Participao de Usurio(s)

baseada na opinio do(s) usurio(s) sobre a interao
baseada em anlise de dados comportamentais
baseada em experimentos controlados
(ensaios de interao)
Avaliao

253
254
Verificao Baseada na confrontao com

princpios, guidelines, recomendaes e
normas
Avaliao Heurstica
Listas de verificao
Inspees formais de Conformidade

Avaliadores julgando a interface baseados em seu

conhecimento emprico e/ou em heursticas (ou ainda
critrios ergonmicos)
Normas ISO de Usabilidade
Heursticas de Nielsen (Nielsen, 1994)

Checklists informais
Como conduzir a avaliao heurstica:

http://www.useit.com/papers/heuristic/heuristic_evaluation.html
ErgoList (LabiUtil/UFSC - Brasil)

http://www.labiutil.inf.ufsc.br/ergolist/check.htm
PUTQ
Dez heursticas de usabilidade http://www.useit.com/papers/

heuristic/heuristic_list.html
Critrios Ergonmicos
(Scapin & Bastien, 1993)
Ver definies precisas e detalhes em
http://www.labiutil.inf.ufsc.br/ergolist/check.htm
255
256
Avaliao Heurstica
Procedimento :
Avaliao Heurstica [ Heursticas ]

H1) Dar feedback;
H2) Falar a linguagem do usurio;
H3) Concepo minimalista
H4) Ser consistente;
H5) Dilogos simples e naturais;
H6) Controle explcito do usurio
H7) Fornecer atalhos;
H8) Boas mensagens de erro;
H9) Prevenir erros;
H10) Ajuda e documentao.
Durante uma sesso de avaliao, o avaliador usa a

interface vrias vezes e avalia os vrios elementos de
dilogo e de apresentao, comparando-os com as
heursticas e/ou cirtrios adotados como referncia
Avaliadores
Especialistas em IHC (ou assessorados

por)
5 avaliadores acham 75% dos problemas
(Nielsen)
257
258
Heursticas (Nielsen) (2/3)
Heuristicas (Nielsen) (1/3)

O sistema deve sempre manter o usurio informado do que est

acontecendo, atravs de feedback em tempo razovel.
Usurios muitas vezes se enganam e necessitam ter controle

sobre a
aplicao para abandonar um estado indesejado sem um dilogo extenso.
Suporte a undo e redo importante.
Fornecer atalhos: Flexibilidade e eficincia de uso

259
Tornar objetos, aes e opes visveis. O usurio no deve necessitar

lembrar informaes de outra parte do dilogo. Instrues para uso do
sistema devem ser visveis ou facilmente encontrveis quando necessrias.
Controle explcito do usurio

Dilogos no devem conter informao irrelevante ou raramente

necessria. Toda unidade de informao extra compete com as unidades
de informao realmente relevantes e diminui sua visibilidade.
Usurios devem usar os mesmos comandos, termos e aes para

situaes similares no sistema.
Dilogos simples e naturais
O sistema deve conter termos usuais do domnio do problema e da

prtica de trabalho do usurio, ao invs de termos orientados a sistema.
Concepo minimalista
Ser consistente
Falar a linguagem do usurio: compatibilidade

entre o vocabulrio do sistema e o do domnio
Dar feedback: Visibilidade do estado do sistema
Aceleradores - embora indiferentes para os usurios novatos, podem servir

muito ao usurio mais experiente.
260
Critrios Ergonmicos
(Scapin&Bastien, 1993)
Heursticas (Nielsen) (3/3)

Boas mensagens de erro

Prevenir erros
Ajudar usurios a reconhecer, diagnosticar e corrigir erros; Mensagens

de erro devem ser expressas em texto claro (sem cdigos), indicando
precisamente o problema e sugerindo construtivamente possibilidades
de correo.
Uma concepo cuidadosa (concepo defensiva) melhor do do

que prover boas mensagens de erro.

Ajuda e documentao
Mesmo que o melhor seja o sistema ser utilizvel SEM documentao,

necessrio prover ajuda (on-line) e documentao consistentes uma
com a outra.
Conduo
Carga de Trabalho
Controle do Usurio
Adaptabilidade
Gesto de Erros
Significado dos Cdigos e Denominaes
Homogeneidade/Consistncia
Compatibilidade
261
Mtodos de avaliao para

Interfaces
Exerccio de avaliao
Simulador da Urna Eletrnica Brasileira:
http://www.tse.jus.br/eleicoes/eleicoesanteriores/eleicoes-2010/eleicoes-2010/eleicoes-2010-simulacao-devotacao

Realizar uma avaliao heurstica INDIVIDUAL rpida,

anotando:
262
Avaliao Heurstica;
Ensaios de Interao;
Inspeo de regras ergonmicas (guidelines e
checklist);
Questionrios;
Relatos de Incidentes Crticos
Problema, situao em que aparece, heurstica/critrio violada(o)
Comparar com os problemas encontrados com o colega ao

lado
263
264
Avaliao Heurstica (2/5)

[ Heursticas ]
Desenvolvido por Nielsen e Molich

(1993);
Princpio de base: julgamento do
avaliador.
Inspeo sistemtica de um prottipo
guiada por um conjunto restrito de 10
heursticas;
265
H1) Dilogos simples e naturais;

H2) Falar a linguagem do usurio;
H3) Minimizar a sobrecarga de memria
do usurio;
H4) Ser consistente;
H5) Dar feedback;
H6) Sadas claramente marcadas;
H7) Fornecer atalhos;
H8) Boas mensagens de erro;
H9) Prevenir erros;
[ Procedimento ]
[ Exemplo: (CD-ROM Literatura Gacha; Nemetz, 1997) ]
266
3 - 5 avaliadores inspecionam a
interface em sees individuais;
problemas identificados so
classificados c/ relao severidade e
(s) heurstica(s) infringida(s);
compilao dos resultados individuais:
H interseces mas muitos problemas

disjuntos !!!
Descrio do problema: Na obra O tempo e o Vento o boto [crtica] disponvel mas, uma vez selecionado, no
mostra o texto correspondente crtica do livro, como esperado.
Severidade (1-3): 3
Heurstica violada: Dar feedback (H5).
267
268

[ Comentrios ]
Ensaios de Interao (1/6)
+ mtodo simples;
+ qualquer pessoa pode ser treinada (!!!);
+ relao custo X benefcio;
- resultados dependem da experincia

do avaliador
- no cobre todos os tipos de

problemas...

269
Observao de usurios durante a

realizao de tarefas;
Necessita de um laboratrio de
usabilidade para registrar as sesses
de teste;
Usurios realizam tarefas
predefinidas;
Thinking aloud protocol p/ estimular
comentrios dos usurios;
[ Laboratrios de usabilidade ]
[ Thinking Aloud Protocol ]

Som e vdeo da seo

Sala com espelhos falsos;
Registros de logs;
http://labiutil.inf.ufsc.br/

http://www.microsoft.com/usability/tour.htm
271
Consiste em estimular o usurio

falar tudo o que est pensando;
Permite coletar informaes
subjetivas;
Deve-se evitar induzir, intimidar, ou
dar respostas ao usurio;
No uma atividade natural para
usurios;
Exige treinamento para boa utilizao
do mtodo.
270
272
[ Etapas ]
[ Roteiro ]

Obteno da amostra de usurios

Ajustes nos cenrios
Planejamento
Execuo (Registro e Coleta dos
Dados)
Anlise e interpretao dos dados
obtidos
Redao do relatrio do ensaio

Convidar usurios para os testes;

Preparar sala antes e deixar usurio
confortvel;
Explicar propsito da avaliao;
Aplicar pr-questionrio;
Fornecer lista de tarefas e observar a
execuo das mesmas;
Ps-questionrio ou entrevista;
Agradecer e recompensar participantes.
273
274
Inspeo de regras ergonmicas (1/7)
[ Comentrios ]
+ Anlise de tarefas por usurios reais;

+ Identificao dos problemas mais
graves;
- Alto custo de realizao;

- Necessita de um laboratrio de
usabilidade (!!!)
Regras ergonmicas descrevem o conhecimento

sobre usabilidade;
Tais regras so usadas para guiar a concepo ou
a avaliao
Avaliao consiste da inspeo sistemtica onde se
verificar se as regras so respeitadas;
Vrios conjuntos de regras so disponveis, de
acordo com o tipo de aplicao;
Guidelines tem centenas de regras...
- Avaliador precisa de treinamento

adequado.
275
276
[ Exemplos de regras ]
[ Exemplo: Guidelines para acessibilidade ]
Selecione cuidadosamente os ttulos de pginas.

Use nomes que estejam relacionados com o
contedo ou funo da pgina. (Fonte: Nielsen,
1999)
Pginas iniciais, que suportam navegao, que
devam ser lidas rapidamente ou, que contenham
grficos grandes, devem ser curtas. Usar pginas
longas para simplificar a manuteno do site e
tornar as pginas mais fceis de imprimir. (Fonte:
Lynch e Hortson, 1999)
277
278
[ Exemplo: Ferramenta auxiliar inspeo ]
[ Outros exemplos de guidelines para Web ]
ErgoList
Os 10 maiores erros de Design para

Web , Nielsen
http://www.useit.com/alertbox/990
530.html
http://www.labiutil.inf.ufsc.br/ergolist/

279
Web Design & usability guidelines,

NCI National Cancer Institute
280
[ Checklist ]
[ Exemplo: Checklist p/ e-shopping ]

Forma de questionrio que deve ser

respondido por um avaliador;
Fcil realizao;
Focaliza pontos especficos a verificar
na interface;
Resultados limitados aos critrios
definidos no roteiro.
(fonte: Information & Design http://www.infodesign.com.au).
281
Questionrios (2/4)
Questionrios (1/4)

Usados para obter informaes dos

usurios;
Bons resultados na obteno de
informaes subjetivas, ex.
preferncias;
Baixo custo de realizao;
Exige um avaliador experiente para
identificar problemas;
Pode ser aplicado distncia;
282
[ Tipos ]
Identificao do perfil do usurio:

Grau de satisfao do usurio:

Mltiplas caractersticas dos usurios;

Wammi - http://www.wammi.com/
Estruturar descries de problemas:

Cenrios de uso:
283
(problema + objetivo + aes);
284
Questionrios (3/4)
Questionrios (4/4)
[ Identificao do perfil do usurio]
[ Grau de satisfao do usurio]
Categorias:

Identificao funcional; (Ex. profisso)

Informaes pessoais; (Ex. idade)
Configurao do computador; (Ex. S.O.)
Experincia c/ computadores; (Ex. uso
h/semana)
Uso da internet; (Ex. freqncia de impresso)
Questes especficas sobre o site;

Wammi p/ Web;
Desenvolvido a partir do QUIS (Kirakowisk, (1988)
Disponvel em vrios idiomas, inclusive em
portugus;
Ferramenta comercial...
til apenas p/ avaliar satisfao subjetiva;
Resultados no explicam os problemas.
285
Relatos de Incidentes Crticos (2/4)

286
[ Dados que auxiliam a identificar problemas c/ ICs ]
Consiste em analisar descries de incidentes

crticos relatados espontaneamente por usurios;
Incidente crtico (IC) uma descrio de uma
situao de uso que pode esconder um problema
de usabilidade;
Geralmente informaes poucos estruturadas;
Descrevem situaes reais de uso.

287
Incio e fim do IC;

Tarefa e objetivo do usurio antes do
IC;
Expectativa do usurio antes do IC;
Freqncia do IC;
Como evitar um IC;
Sugestes do usurio para resolver o
IC.
288

[ Cenrios de Uso p/ estruturar ICs ]

+ Fcil coleta de dados;

+ Baixo custo;
+ Descrevem problemas que usurios
enfrentam;
Usurios podem ser treinados para

estruturar ICs na forma de cenrios de
uso:

objetivo
problema
aes
- Exige habilidade p/ interpretar ICs;

- Depende da boa vontade dos usurios
em descrever ICs.
289
290
Roteiro para Avaliao

[ Recomendaes ]
Regra n 1 A melhor avaliao no substitui os

cuidados para evitar problemas de usabilidade;
Regra n 2 - Avaliaes peridicas devem ser
realizadas;
Regra n 3 Documentao a palavra-chave
para a boa conduo do projeto;
Regra n 4 Investir na capacitao das pessoas
mesmo aquelas que no esto diretamente
relacionadas avaliao;
Regra n 5 Utilizar mais de um mtodo de
avaliao;
Quarta
Parte
291
292
Roteiro
Conclusion
I Motivao
Start somewhere

Plan to apply at least one of these ideas to

your current and/or next project.
Identifying users and their tasks is

most important
IV Concluses
293
Conclusion yet

Links Interessantes
Usabilidade:
More Technology is not enough: usability need

awareness !!
Usability awareness will potentially increase... :
More we use systems, more we need
usability !!
In Brazil, good news...
294
useit.com
usableweb.com
labiutil.inf.ufsc.br
More HCI courses in Computer Science curricula

UFRGS since 1993 ;-)
HCI Bibliography
Special Interest Group (Comisso Especial) in Brazilian Computer Society

since 2000
More professionals , more companies
hcibib.org
interaction-design.org
295
296
Fim
Informao de contato...
mpimenta@inf.ufrgs.br
Dvidas?
Marcelo Soares Pimenta
Instituto de Informtica (INF)-UFRGS
Obrigado!
http://www.inf.ufrgs.br/~mpimenta
Ou google me
Marcelo Pimenta ...
297
298

Notas Aula Ihc

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Notas Aula Ihc

Uploaded by

Copyright:

Available Formats

Contedo

Design de Interfaces com

Introduo Interao Humano-Computador (IHC):

Salvador, janeiro de 2012

Bibliografia (em portugus)

Barbosa, S.D.J.; Silva, B.S. Interao Humano-Computador. Editora

Interao em Toda a Parte

Importncia de IHC (1/3)

Importncia de IHC (2/3)

Usurio frente a um novo dispositivo

Usurio frente a um novo dispositivo

Final nem to feliz:

Interface de qualidade ...

Importncia de IHC (3/3)

95% de todos sistemas atualmente

exceo: sistemas embarcados, batch

Desenvolvimento da interface demanda

Qualidade historicamente ligada a

Eficcia (%) - coeficientes de erro

b) Tempo de aprendizado e de reteno

Definitions: What is Usability?

Adequao entre caractersticas (fsicas/cognitivas) dos usurios

Usability is the measure of the quality of a

facilidade de aprendizado, intuitiva e natural

Why Should You Care About

Why Should You Care?

Have you ever

Jakob Nielsen reports:

Jakob Neilsen is generally recognised as

se h dificuldades (reais ou potenciais) para determinado usurio ou

Descrio (necessidade de reparo)

Information Technology Services

Onde achar Portuguese? Acima ou abaixo?

Types of Usability Problems

Usabilidade: problema genrico

Product doesnt match job or task

Problemas em Interfaces em geral: NO somente em Software !!!

Usability of Everyday Objects

Donald Norman: The Design (Psychology)

Don Norman pioneering book from 1988

Norman, Donald A. (2002). The Design of Everyday Things. New York:

Usability Problem Example:

Escolha um aplicativo qualquer

Faa uma lista de problemas

Discusso com colegas e professor

Mtricas para medir usabilidade?

Concluso de tarefas (c/ sucesso, parcialmente concluda, no-concluda);

Not Is your system usable, but How

usable is your system?

Satisfao subjetiva do usurio e correspondncia com os

Can set minimum standards to meet (time,

Usability is about money too

Usability is shaped by the UI but usability is

Usability relates to the (complex) choices

Usabilidade tem futuro !!

III Usabilidade: Como Desenvolver Software Usvel?

IHC: Interface e Interao

IHC: Interface e Interao

aquilo que interliga dois sistemas

Alan Kay: For users, the user interface is the program

comunicao entre usurio e sistema, inter

IHC: Objetos e Funes

Sistema Interativo: Funes

IHC: Objetos e Funes