Post on 11-Nov-2018
ASPECTOS INTRODUTÓRIOS DE INTERAÇÃO HUMANO-COMPUTADORINTERAÇÃO HUMANO-COMPUTADOR
Agenda
• Introdução
• Unidade 1 – Conceitos básicos
• Unidade 2 – Integração com Eng. SW
• Unidade 3 – Princípios e procedimentos de • Unidade 3 – Princípios e procedimentos de Design da Interação
INTRODUÇÃO
A importância das TDIC (1/2)
• Em quais ferramentas, instrumentos ou dispositivos elas estão presentes? – celular usado como cartão de crédito– quiosque eletrônico para consulta numa livraria – chaveiro com token para acesso a serviços bancários– smartphones que consultam resultados de exames – smartphones que consultam resultados de exames
médicos via Web– livros eletrônicos– consoles de jogos que exercitam mente e corpo– TV digital interativa– participação política na internet usando diversos
dispositivos e ferramentas– ...
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
A importância das TDIC (2/2)
• Qual importância as TDIC adquiriram?
• Elas afetam a vida das pessoas?
• O que pode ocorrer se as TDIC falharem?
• Quais são as consequências para quem usa • Quais são as consequências para quem usa e para quem desenvolve TDIC ?
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
O interfone do prédio mudou! (1/4)
• num condomínio com 5 blocos com 5 andares cada, existem 4 apartamentos por andar
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
O interfone do prédio mudou! (2/4)
• o interfone no térreo de cada bloco mudou de uma solução “específica” (direita) para uma solução “genérica” (esquerda)
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
O interfone do prédio mudou! (3/4)
• analise as formas de interação nas duas propostas de interfone: – Como ligar para o apartamento 104?
– O que é preciso memorizar (e lembrar) para usar o interfone?
– Pense numa pessoa idosa e um cego usando ambos interfones– Pense numa pessoa idosa e um cego usando ambos interfones
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
O interfone do prédio mudou! (4/4)
• Como o novo dispositivo afetou a vida das pessoas que moram e que visitam o condomínio? Por exemplo: – mudou a forma de expressar “eu quero falar com
o apartamento XXX”mudou a forma de expressar “eu quero falar com o apartamento XXX”
– os moradores agora podem usar o interfone para falar entre apartamentos de qualquer bloco
– ficou um pouco mais complexo aprender e explicar como funciona
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
cédula vs. urna eletrônica
• Como votar no José da Silva para vereador?
• Como saber se o número é do candidato desejado?
• Como votar em branco?
• Como votar nulo?
• Em que ordem votar?Eleições de 1982 – fonte TRE
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Responsabilidade do desenvolvedor de TDIC
• estar ciente de que seu trabalho afeta a vida das pessoas
• tentar prever os impactos do seu trabalho para
– encaminhar boas intervenções/soluções e– encaminhar boas intervenções/soluções e
– diminuir os impactos negativos previstos
– fornecer salvaguardas para impactos negativos imprevistos
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
IHC como Área Multidisciplinar
Psicologia Artes
EngenhariaComputação
IHC
Psicologia
Sociologia
Antropologia
Design
Ergonomia
Linguística
Semiótica
Artes
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Objetos de Estudo em IHC
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Benefícios de IHC
• contribui para:
– aumentar a produtividade dos usuários
– reduzir o número e a gravidade dos erros
– reduzir o custo de treinamento
– reduzir o custo de suporte técnico– reduzir o custo de suporte técnico
– aumentar as vendas e a fidelidade do cliente
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Construção vs. Uso
“de dentro para fora” “de fora para dentro”
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
UNIDADE I – CONCEITOS BÁSICOS
Situação Típica de Uso
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Interação
• é um processo de...
– sequência de estímulos e respostas
– operação de máquinaNorman (1986) interpreta a interação como um processoatravés do qual o usuário formula uma intenção, planeja suas
– comunicação com/por meio da máquina
através do qual o usuário formula uma intenção, planeja suasações, atua sobre a interface, percebe e interpreta a resposta dosistema e avalia se seu objetivo foi alcançado
de Souza (2005) interpreta a interação com um processo decomunicação entre pessoas (incluindo o designer e os usuários),mediada por sistemas computacionais.
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Interface (1/2)
único meio de contato entre usuário e sistema
toda a porção do sistema
interface
toda a porção do sistema com a qual o usuário mantém contato físico (motor ou perceptivo) ou conceitual durante a interação (Moran, 1981)
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Interface (2/2)
software
hardwareAdaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Affordance
características de um objeto capazes de revelar aos seus usuários as operações e manipulações que eles podem fazer com ele (Norman, 1988)
O que é possível fazer com esses elementos de interface?
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Cuidado com falsas affordances
O que é possível fazer com esses elementos de interface?
� Ler um número?
� Editar um número? � Editar um número?
� Pressionar um botão para acionar uma ação do sistema?
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
UNIDADE II – INTEGRAÇÃO COM ENGENHARIA DE SOFTWARE
Qualidade de Uso em IHC
• critérios de qualidade de uso
– usabilidade
– experiência do usuário
– acessibilidade
– comunicabilidade– comunicabilidade
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Qualidade de Uso em IHC
• envolve critérios distintos, porém interligados, que afetam uns aos outros
• nem sempre é possível satisfazer todos os critérios de qualidade de uso
• é importante definir quais critérios devem ser priorizados no • é importante definir quais critérios devem ser priorizados no design de IHC
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
O que é design?
• é um processo com três atividades básicas:
– análise da situação atual: estudar e interpretar a situação atual;
– síntese de uma intervenção: planejar e executar – síntese de uma intervenção: planejar e executar uma intervenção na situação atual;
– avaliação da nova situação: verificar o efeito da intervenção, comparando a situação analisada anteriormente com a nova situação, atingida após a intervenção.
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Processos de design de IHC
• Ciclo de vida simples
• Ciclo de vida em estrela
• Engenharia de Usabilidade de Nielsen
• Engenharia de Usabilidade de Mayhew• Engenharia de Usabilidade de Mayhew
• Design Contextual
• Design Baseado em Cenários
• Design Dirigido por Objetivos
• Design Centrado na Comunicação
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Ciclo de Vida Simples (Preece et al., 2002)
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Ciclo de Vida em Estrela (Hix & Hartson, 1993)
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Engenharia de Usabilidade de Nielsen
• Conheça seu usuário • Realize uma análise competitiva • Defina as metas de usabilidade • Faça designs paralelos
Atividades propostas:
• Faça designs paralelos • Adote o design participativo • Faça o design coordenado da interface como um todo• Aplique diretrizes e análise heurística • Faça protótipos • Realize testes empíricos • Pratique design iterativo
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Design Contextual
• investigação minuciosa do contexto de uso
• atividades básicas:– investigação contextual
quem são os usuários, suas necessidades, objetivos e a forma de trabalho
– modelagem do trabalho – modelagem do trabalho fluxo de trabalho, artefatos utilizados, ambiente físico e cultural de trabalho
– consolidação da modelagem do trabalho
– reprojeto do trabalho
– projeto do ambiente do usuário
– prototipação
– testes com usuários
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Integração de IHC com Engenharia de Software
• As principais abordagens de integração são:– definição de características de um processo de
desenvolvimento que se preocupa com a qualidade de uso;
– definição de processos de IHC paralelos que – definição de processos de IHC paralelos que devem ser incorporados aos processos propostos pela ES;
– indicação de pontos em processos propostos pela ES em que atividades e métodos de IHC podem ser inseridos.
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Integração de IHC com Engenharia de Software
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
IHC e Métodos Ágeis• sugestões de Blomkvist (2005) para integrar IHC em métodos ágeis:
– o designer de IHC deve ser responsável pelas decisões relacionadas com a qualidade de uso
– equilibrar o tempo necessário para entregar um sistema que funcione com a qualidade de uso oferecida
– buscar informações sobre o contexto de uso, e não apenas consultar os usuários e clientes no ambiente de desenvolvimentoconsultar os usuários e clientes no ambiente de desenvolvimento
– realizar uma análise da situação atual mais abrangente e rica em contexto de uso do que as histórias de uso (user stories) e os casos de uso (use cases) amplamente utilizados em métodos ágeis
– o designer de IHC deve auxiliar os usuários na priorização das funcionalidades que serão desenvolvidas
– realizar avaliações de IHC durante diferentes estágios do ciclo de desenvolvimento
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
UNIDADE III – PRINCÍPIOS E PROCEDIMENTOS DE DESIGN DA INTERAÇÃO
Design Centrado na Comunicação
O que significa interação e o projeto de interação?
A interação é vista como uma conversa entre designer e usuário através da interface, durante a conversa usuário-sistema.
Projetar a interação significa definir as conversas que o usuário poderá travar com o preposto do designer para alcançar seus objetivos.
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Design Centrado na Comunicação
O que é uma conversa?
• Toda conversa tem um tópico, que é o assunto geral por ela endereçado.
• Essa conversa pode se desdobrar em • Essa conversa pode se desdobrar em diálogos, que endereçam subtópicosrelacionados ao tópico da conversa.
• Os diálogos são compostos por falas do usuário e do prepostos.
• Cada fala faz uso de signos.
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Design Centrado na ComunicaçãoExemplo de conversa
tópico > subtópico (diálogo) falas e signos
cadastrar trabalho U: Preciso cadastrar um trabalho para os meus alunos de IHC.
> informar dados do trabalho D: Qual é o título e a descrição do trabalho? Até quando deve ser entregue? Pode ser feito em grupo? Quantos pontos vale o trabalho?
> consultar datas importantes U: Antes, quero consultar os prazos da universidade e feriados desse semestre.D: Ei-los.
> informar dados do trabalho U: Preciso de uma semana para corrigir os trabalhos, e preciso entregar as notas até dia 2 de junho. Então vou pedir para os alunos entregarem os trabalhos até o dia 26 de maio (data de entrega). Eles devem receber um lembrete do prazo de entrega.D: OK, o trabalho deverá ser entregue até o dia 26 de maio e os alunos serão D: OK, o trabalho deverá ser entregue até o dia 26 de maio e os alunos serão lembrados no dia 23 de maio (três dias antes).
> informar dados do trabalho D: E qual é o título e a descrição do trabalho? Pode ser feito em grupo? Quantos pontos vale o trabalho?U: O trabalho pode ser feito em dupla, e vale 20% da nota. O título é (...) e a descrição é (...).D: OK, o trabalho já foi cadastrado.
conferir cadastro do trabalho> examinar dados do trabalho
U: Deixa eu conferir os dados do trabalho... Estão OK.
notificar alunos U: Agora quero avisar aos alunos de que o enunciado do trabalho já está disponível.D: OK, posso enviar a mensagem padrão?
> informar conteúdo da mensagem U: Sim.
conferir mensagem > conteúdo e destinatários da mensagem
D: A mensagem (...) foi enviada para os alunos (...).
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Modelo Hierárquico de Tarefas Adaptado
sequencial
independente de ordem
alternativa
iterativa
ubíqua
opcional
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Design de Interface
o design de interface envolve:
• escolha dos estilos de interação do sistema
• definir como a conversa projetada será • definir como a conversa projetada será representada na interface
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Estilos de Interação
linguagem de comando
usuário precisa memorizar e se lembrar dos comandosinteração tende a ser rápida depois que o usuário aprende
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Estilos de Interação
linguagem natural
fácil de usar por pessoas inexperientes
grandes desafios de implementação
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Estilos de Interação
interação através de menus
Além das barras de menu, barrasde navegação e menus contextuais(pop-up), Shneiderman tambémconsidera conjuntos de botões deseleção (checkboxes) e opção
pode ser mais fácil se lembrar das opçõespode levar mais tempo para mover mãos e braços do que digitar um comando
seleção (checkboxes) e opção(radio buttons) como formas deinteração por menu
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Estilos de Interação
interação através de formulário
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Estilos de Interação
manipulação direta
aproxima a interação da manipulação dos objetos no mundo real estimula a exploração com o mouse: clique, duplo clique, clicar e arrastarmais difícil para usuários com limitações visuais ou motoras
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Estilos de Interação
WIMP (Windows, Icons, Menus, and Pointers)
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Representações da Interface com Usuário
• esboços
• modelos, como as linguagens de descrição de interfaces com usuário: UIML, UsiXML, XAM, etc. etc.
• protótipos funcionais
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Representações da Interface com Usuário
interface abstrata
define agrupamentos e características dos elementos de interface
exemplo
interface concreta
define posicionamento e elementos de interface interativos (widgets)
exemplo
conjunto de itens com seleção simples representar a entrada de dados como
ou
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Representações da Interface com Usuário
esboço em baixa fidelidade
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Representações da Interface com Usuário
esboço em baixa fidelidade elaborado em ferramenta computacional
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Representações da Interface com Usuário
esboço em alta fidelidade
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Da Interação para o Design de Interface
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Da Interação para o Design de Interface
é comum mapear uma cena para unidade de apresentação (tela ou página web )
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Da Interação para o Design de Interface
uma cena também pode ser mapeada para mais de uma unidade de apresentação
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Da Interação para o Design de Interface• cena Consultar material
mapeada para unidade de apresentação Materiais didáticos (nº 1)
• diálogo ver materiais mapeado para a tabela de materiais didáticos (nº 2)
• fala de usuário u: cadastrar novo
material mapeada para link Cadastrar novo material didático
(nº 3)(nº 3)
• fala de usuário u: editar material
X mapeada para os links na tabela (nº 4)
• cena Editar material mapeada para duas unidades de apresentação semelhantes, conforme a fala de transição de usuário que leva até ela:
– Cadastrando novo material didático, destino da fala u: cadastrar novo
material didático (nº 5)
– Editando material didático, destino da fala u: editar material X (nº 6)Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)
Da Interação para o Design de Interface
falas do preposto geralmente são representadas como mensagens de erro ou de status e de status
• a fala d: material gravado• a fala d: material gravado
foi mapeada para mensagem de status na unidade de apresentação correspondente à cena de destino (nº 1)
• a fala d: problema na
gravação foi mapeada para uma unidade de apresentação diferente (nº 2)
Adaptado do material exclusivo do Livro Interação Humano-Computador (Barbosa e Silva, Elsevier, 2010)