Design Usabilidade interaccao

Prévia do material em texto

o que é o design de interacção?o que é o design de interacção?
o que é o design de interacção?
• Designing interactive products to support people in their everyday 
and working lives
– Sharp, Rogers and Preece (2002)
• The design of spaces for human communication and interaction 
– Winograd (1997)
objectivos do design de interacção
• desenvolver produtos usáveis
Usabilidade significa: fácil de aprender, com um uso efectivo e 
que proporcione uma experiência agradável
•• envolver os utilizadores no processo de design
que design
• Que tenha em atenção :
– quem são os utilizadores
– que actividades irão ser desempenhadas
– onde a interacção acontecerá
• que tente optimizar as interacções que as pessoas têm com um 
produto
– de modo que correspondam às necessidades e actividade 
do utilizador
compreender as necessidades da pessoas
– necessário ter em conta em que é que as pessoas têm um 
bom ou mau desempenho
– Pensar no que poderá ajudar as pessoas, relativamente ao 
modo como realizam correntemente qualquer coisamodo como realizam correntemente qualquer coisa
– Ouvir o que as pessoas querem e conseguir o seu 
envolvimento
– Usar métodos (“user-based”) experimentados e testados
actividade
• O que torna diferente fazer uma chamada telefónica, quando se usa:
– um telemóvel?
– um posto público?
• considere os tipos de utilizador, tipo de actividade e contexto de uso
o que é uma interface?
?
evolução das ‘interfaces’ HCI
• 50s - Interface ao nível do hardware para engenheiros – painéis de 
interruptores
• 60-70s - interface ao nível da programação - COBOL, FORTRAN
• 70-90s - ao nível do terminal - linguagens de comandos
• 80s - Interface ao nível do diálogo de interacção - GUIs, multimédia
• 90s - Interface no ambiente de trabalho - networked systems, groupware • 90s - Interface no ambiente de trabalho - networked systems, groupware 
• 00s - Interface “penetra” os objectos
– tecnologia Bluetooth, dispositivos móveis, electrónica de 
consumo, ecrãs interactivos, tecnologia “embebida”
da HCI até
ao design de interacção
•Human-computer interaction (HCI) é: 
“concerned with the design, evaluation and implementation of 
interactive computing systems for human use and with the study of 
major phenomena surrounding them” (ACM SIGCHI, 1992, p.6)
•Interaction design (ID) é: 
“the design of spaces for human communication and interaction” 
– Winograd (1997)
•crescentemente, mais áreas de aplicação, mais tecnologias e 
mais questões no design de ‘interfaces’
relação entre DI, HCI e outros campos
prática do design
(ex. design gráfico)
disciplinas
académicas
(ex. Ciências da
computação,
psicologia)
Campos interdisciplinares
(ex. HCI, CSCW)
design de
interacção
relação entre DI, HCI e outros campos
• disciplinas académicas contribuindo para o design de interacção: 
– psicologia
– ciências sociais– ciências sociais
– ciências da computação
– engenharia
– ergonomia
– informática 
relação entre DI, HCI e outros campos
• Prática de design contribuindo para o design de interacção:
– Design gráfico
– Design de produto
– ....
– Indústria cinematográfica
relação entre DI, HCI e outros campos
• campos interdisciplinares que ‘fazem’ design de interacção:
– HCI
– Human Factors
– Cognitive Engineering– Cognitive Engineering
– Cognitive Ergonomics
– Computer Supported Co-operative Work
– Information Systems
– design
é fácil trabalhar numa equipa 
multidisciplinar?
• quantas mais pessoas envolvidas a fazer design de interacção, 
mais ideias e mais design gerado…mas…
• mais difícil se torna a comunicação e o progresso na criação de • mais difícil se torna a comunicação e o progresso na criação de 
soluções geradas para resolver um problema
design de interacção e negócio
• Cresce o número consultores em DI, exemplos conhecidos:
– Nielsen Norman Group: “help companies enter the age of 
the consumer, designing human-centered products and 
services”
– Swim: “provides a wide range of design services, in each 
case targeted to address the product development needs at 
hand”hand”
– IDEO: “creates products, services and environments for 
companies pioneering new ways to provide value to their 
customers”
que profissionais no negócio de DI?
• designers de interacção- pessoas envolvidas no design dos aspectos 
interactivos de um produto
• engenheiros de usabilidade - pessoas cuja atenção se centra na 
avaliação de produtos, usando métodos e princípios de usabilidade.
• web designers - pessoas que desenvolvem e criam websites, • web designers - pessoas que desenvolvem e criam websites, 
nomeadamente ‘layouts’
• designers de informação - pessoas que desenvolvem ideias sobre 
planeamento e estrutura de produtos
interactivos.
• “user experience designers” - pessoas que fazem tudo o que está 
acima, mas que fazem estudos de campo para informar o design de 
produtos 
o que está envolvido no processo de design 
interacção 
• identificar necessidades e estabelecer requisitos
• desenvolver designs alternativos•
• construir protótipos interactivos que possam ser comunicados e 
acedidos
• avaliar o que está a ser construído através do processo
características principais do design 
interacção 
• Os utilizadores devem ser envolvidos no desenvolvimento do 
projecto
• Objectivos específicos em usabilidade e experiência de utilização 
precisam de ser identificados, claramente documentados e precisam de ser identificados, claramente documentados e 
acordados no início do projecto
• iteração é necessária ao longo das principais actividades do 
projecto
objectivos em usabilidade
• eficácia no uso
• eficiência no uso
• segurança no uso
• ter utilidade•
• fácil de aprender
• fácil de lembrar como se usa
actividade sobre usabilidade
• Quanto devia demorar e quanto demora a:
– usar um VCR para visualizar um vídeo?
– usar um VCR para pré-gravar dois programas?
– usar um programa de autoria para criar um website?
objectivos dos utilizadores sobre as suas 
experiências
– satisfatórias - que recompensem
– divertidas - suporte criatividade
– agradáveis - emocionalmente ricas– agradáveis - emocionalmente ricas
– entretém …e mais
– que ajude
– motivadoras
– esteticamente agradáveis
– .....
usabilidade e objectivos dos utilizadores 
sobre as suas experiências
• Como diferem objectivos em usabilidade dos objectivos dos 
utilizadores sobre as suas experiências?
• existem trade-offs entre os dois tipos de objectivos?
– ex. pode um produto ser simultaneamente divertido e 
seguro?
• será fácil medir usabilidade versus objectivos dos utilizadores 
sobre as suas experiências?
princípios de design
• abstracções generalizáveis para pensar acerca de diferentes 
aspectos do design
• os ‘fazeres’ e os ‘não fazeres’ do design de interacção
• o que disponibilizar e o que não disponibilizar numa interface
• tudo derivado de uma mistura de um conhecimento baseado em 
teoria, experiência e senso comum
visibilidade
• isto é um painel de controlo para um elevador. 
• como funciona?
• que botão carregar para um determinado andar?
• nada acontece. Carregue noutro botão? Ainda nada. 
Que será necessário fazer?
não é visível o que fazer!
www.baddesigns.com
visibilidade
…é necessário inserir o cartão do quarto na ranhura ao pé 
dos botões para pôr o elevador a funcionar!
como tornar esta acção mais visível?
• tornar o leitor de cartões mais óbvio• tornar o leitor de cartões mais óbvio
• disponibilizar uma mensagem audível, que diga o que fazer 
(em que língua?)
• disponibilizar uma grande etiqueta perto do leitor de 
cartões que pisque quando alguém entra
• tornar partes relevantes mais visíveis
• tornaro que há para fazer mais óbvio
feedback
• enviar informação de retorno para o utilizador acerca do que foi 
feito
• inclui som, ênfase, animação e todas as suas combinações
– ex. quando um botão no ecrã é accionado o sistema 
responde com um som ou/e um bordo vermelho como 
feedback:
“ccclichhk”
constrangimentos
• restringem as acções possíveis que podem ser realizadas
• ajudam a prevenir a selecção de opções incorrectas
• Três tipos principais (Norman, 1999)• Três tipos principais (Norman, 1999)
– físicos
– culturais 
– lógicos
restrições físicas
• Referem-se à maneira como os objectos físicos restringem 
movimentos
– ex. só é possível inserir a chave numa fechadura de uma 
maneira 
• De quantas maneiras se pode inserir um CD ou DVD num 
computador?
• É fisicamente muito restritiva esta acção?
• Como difere da acção de inserir uma disquete no leitor do 
computador?
restrições lógicas
• Exploram o senso comum sobre a maneira como o mundo 
funciona
• um exemplo é a relação lógica entre o ‘layout’ físico de um 
dispositivo e a maneira como ele funcionadispositivo e a maneira como ele funciona
design lógico ou ambíguo?
• Onde ligar o ‘mouse’? 
• Onde ligar o teclado?
• Os ícones coloridos ajudam?
www.baddesigns.com
como fazer um design mais lógico
(i) A aposta num mapeamento 
directo entre o ícone e o 
conector
(ii) B usa uma codificação pela (ii) B usa uma codificação pela 
cor para associar os 
conectores com as etiquetas
www.baddesigns.com
restrições culturais
• Convenções fixadas por aprendizagem, como: 
triângulo vermelho para aviso de perigo
• Podem ser universais ou específicas de uma 
cultura
quais são universais e quais são 
culturalmente específicas?
Mapeamento
• relação entre os controlos os seus movimentos e os resultados
• porque é que este é um mapeamento pobre dos botões de 
controlo?
Mapeamento
• porque é que este mapeamento é melhor?
Actividade sobre mapeamento 
Como estão associados os controlos aos discos do fogão?
A B C D
porque é que este é melhor design?
Consistência
• Design de interfaces que tenham operações similares e usar 
elementos similares para tarefas similares.
por exemplo:
– Usar sempre a tecla ctrl mais a primeira inicial do command 
for an operation – ctrl+C, ctrl+S, ctrl+Ofor an operation – ctrl+C, ctrl+S, ctrl+O
• o principal benefício é: interfaces consistentes são fáceis de 
aprender e usar
Quando a consistência desaparece
• O que é que acontece se existir mais do que um comando 
começado pela mesma letra?
– ex. save, spelling, select, style
•• Arranjam-se outras iniciais ou combinações de teclas, quebrando 
a regra da consistência
– ex. ctrl+S, ctrl+Sp, ctrl+shift+L
• Incrementa-se o esforço de aprendizagem, tornando o utilizador 
mais sujeito a errar
Consistência interna e externa
• consistência interna refere-se ao design de operações de modo a 
terem um comportamento idêntico dentro da mesma aplicação
– difícil de conseguir em interfaces complexas
• consistência interna refere-se ao design de operações, interfaces, • consistência interna refere-se ao design de operações, interfaces, 
etc., de modo a terem um comportamento idêntico em várias 
aplicações e diferentes dispositivos
– acontece muito raramente, normalmente dependentes das 
preferências dos designers
Layout de teclados numéricos
• Um caso de inconsistência externa
(a) telefones,
controlos remotos
(b) calculadoras,
computadores
1 2 3
4 5 6
7 8 9
7 8 9
1 2 3
4 5 6
0 0
controlos remotos computadores
‘Affordances’: umas pistas
(disponibilidades, providencialidades)
• Refere-se a um atributo de um objecto que permite a uma 
pessoa perceber como usá-lo
– ex. O botão do rato convida a carregar, o puxador de uma 
porta …
• Norman (1988) usou o termo para discutir o ‘design of everyday 
objects’
• Desde aí popularizou-se em interacção, na discussão do design 
de “objectos” de interface
– ex. ‘scrollbars to afford moving up and down, icons to afford 
clicking on’ 
o que é que as ‘affordances’ têm a ver com o design de interacção?
• As interfaces são virtuais e não têm ‘affordances’ como os 
objectos físicos
• Norman sublinha que não faz sentido falar de interfaces em • Norman sublinha que não faz sentido falar de interfaces em 
termos de ‘affordances’ “reais”
• Pelo contrário, as interfaces são melhor conceptualizadas como 
‘affordances’ “percepcionadas”
– Convenções aprendidas sobre mapeamentos arbitrários 
entre acção e efeito ao nível da interface
– alguns mapeamentos são melhor do que outros
actividade 
– ‘affordances’ físicas: 
que ‘affordances nestes objectos? Serão óbvias?
actividade 
– ‘affordances’ virtuais
Que ‘affordances’ nestes objectos de ecrã?
e se fosse um utilizador novato? saberia o que fazer com 
eles? 
Princípios de usabilidade
• Idênticos a alguns princípios de design, mas mais prescritivos
• Usados fundamentalmente como base para avaliar sistemas 
• Fornecem um quadro de referência para uma avaliação 
heurística
Princípios de usabilidade (Nielsen 2001)
• Visibilidade do estado do sistema 
• Ajuste entre o sistema e o mundo real
• Controlo e liberdade do utilizador
• Consistência e standards
• Ajuda aos utilizadores para reconhecerem, diagnosticarem e 
recuperarem de erros
• Prevenção de erros
• Reconhecimento em vez de lembrança
• Flexibilidade e eficiência no uso
• Estética e design minimalistas
• ajuda e documentação
Pontos chave
• DI liga-se ao design de produtos interactivos que apoiam as 
pessoas no seu dia-a-dia e no trabalho
• DI é multidisciplinar envolvendo contributos de um largo campo 
de disciplinas e áreasde disciplinas e áreas
• DI continua a ser um bom negócio apesar do ‘dot.com crash’!
Pontos chave
• DI implica levar em linha de conta um número de factores 
interdependentes incluindo o contexto de uso, tipo de tarefa, e 
tipologia de utilizador 
• Requer um esforço orientado para a usabilidade e os objectivos • Requer um esforço orientado para a usabilidade e os objectivos 
de utilização
• Os princípios de design e usabilidade são heurísticas úteis para 
analisar e avaliar produtos interactivos