Conceitos básicos. INF1403 Introdução à Interação Humano-Computador Prof. Alberto B Raposo sala 413 RDC

Tamanho: px

Começar a partir da página:

Download "Conceitos básicos. INF1403 Introdução à Interação Humano-Computador Prof. Alberto B Raposo sala 413 RDC"

Eugénio Valverde Peralta
5 Há anos
Visualizações:

1 Conceitos básicos INF1403 Introdução à Interação Humano-Computador Prof. Alberto B Raposo abraposo@inf.puc-rio.br sala 413 RDC

2 sumário conceitos básicos: interface, interação, affordance objetos de estudo de IHC multidisciplinaridade referência: Capítulos 1 e 2 2

3 interface

4 interface A interface de um sistema interativo compreende 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) 4

5 5

6 Exemplos de interfaces

7 exemplo interface concreta 7

8 exemplo interface concreta 8

9 exemplo interface concreta (reprojeto) 9

10 Interfaces de baixa qualidade Exemplos de interfaces ruins:

11 Interfaces de baixa qualidade Exemplos de interfaces ruins: Você não tem permissão para ver a configuração atual de permissões para a impressora LaserjetX, mas você pode fazer modificações nas permissões.

12 Vocês veem algo de incongruente nesta tela? 12

13 interface A interface é o único meio de contato entre o usuário e o sistema. Por isso, a grande maioria dos usuários acredita que o sistema é a interface com a qual entram em contato. (Hix & Hartson, 1993) 13

14 o sistema é a interface interface usuário funcionalidade

15 interação podemos considerar a interação usuário sistema como sendo um processo de manipulação, comunicação, conversa, troca, influência, e assim por diante. (Barbosa & Silva, 2010) 15

16 interface fotografia interação vídeo t contato snapshots (instantâneos de tela) conversa filmes de interação 16

17 interação Só que entra como janela ativa e com o botão Cancel ativo, acionável pela barra de espaço. 17

18 problemas de interação? 18

19 Exemplo de problema de interação

20 Ao entrar no SAU, tudo parece normal. 20

21 Ufa, nada mudou! Agora é só escolher a disciplina para preencher os graus na pauta... 21

22 Só que não... Cadê a pauta da turma para eu lançar os graus?!? O que significa publicar as faltas? 22

23 Só que não... Cadê a pauta da turma para eu lançar os graus?!? O que significa publicar as faltas? Se o SAU sabe que eu tenho que ir no Controle de faltas do Portal do Professor, por que não me leva logo pra lá? 23

24 Só que não... Cadê a pauta da turma para eu lançar os graus?!? O que significa publicar as faltas? Se o SAU sabe que eu tenho que ir no Controle de faltas do Portal do Professor, por que não me leva logo pra lá? Ou melhor... por que já não posso publicar as faltas aqui? 24

25 Só que não... Cadê a pauta da turma para eu lançar os graus?!? GRRRRR...!*#@! 25

26 desperdício de tempo - passo 1 26

27 desperdício de tempo passo 2 27

28 desperdício de tempo passo 3 28

29 desperdício de tempo passo 4 29

30 desperdício de tempo passo 5 Por que pedir confirmação para esse tipo de coisa? 30

31 desperdício de tempo passo 6 Por que já não me informou isso na mensagem anterior? 31

32 desperdício de tempo passo 7 GRRRRR...!*#@! 32

33 desperdício de tempo passo 8 33

34 Déjà vu... desperdício de tempo passo 9 34

35 Cruzando os dedos, agora... [drumroll] 35

36 (finalmente pude entrar com os graus da turma ) 36

37 Interação Humano-Computador interface + interação contato + comunicação

38 Interface e Interação

39 Interface x Interação Interação é o processo de comunicação entre pessoas e sistemas interativos; Usuário e sistema trocam turnos em que um fala e outro ouve, interpreta, e realiza uma ação. Interface é o nome dado a toda porção de um sistema com a qual um usuário mantém contato ao utilizá-lo; Hardware (teclado, mouse, monitor, etc), software (botões, ícones, menus, etc).

Ele se concentra na concepção do fluxo pelo qual um usuário pode localizar informações facilmente, ao mesmo tempo em que permite alcançar seu objetivo de informação em cada interação.

40 Interface x Interação UI (User Interface) Design é o design de interfaces para dispositivos e está focado no aspecto gráfico da criação. Design de Interação é "A prática de conceber produtos, ambientes, sistemas e serviços digitais interativos". Ele se concentra na concepção do fluxo pelo qual um usuário pode localizar informações facilmente, ao mesmo tempo em que permite alcançar seu objetivo de informação em cada interação. UX (User experience) design é um conceito mais abstrato, que abrange vários aspectos de design, juntamente com a jornada de um usuário em um sistema, plataforma, software ou aplicativo. Ele inclui design de UI, design de interação, design de comunicação, design de aplicativos, arquitetura de informações e muito mais. O objetivo do design de UX é facilitar o melhor sentimento que um usuário recebe ao operar em um dispositivo.

42 Perspectivas de Interação (1/2) Kammersgaard (1988)

43 Perspectivas de Interação (2/2) perspectiva sistema parceiro de discurso significado de interação transmissão de dados conversa usuáriosistema fatores de qualidade mais evidentes eficiência (tal como indicado pelo tempo de uso e número de erros cometidos) adequação da interpretação e geração de textos ferramenta manipulação da ferramenta funcionalidades relevantes ao usuário, facilidade de uso mídia comunicação entre usuários e designerusuário qualidade da comunicação mediada e entendimento mútuo

44 mito ou fato? todo problema de IHC é causado por um problema de interface 44

45 interface interação modelo conceitual visão 45

46 modelo conceitual 46

47 modelo conceitual

48 como comunicar bem o modelo conceitual???? eu quero subir eu quero que o elevador desça??? 48

49 se é óbvio, então por que... 49

50 Sistemas Interativos: diferentes visões STAKEHOLDERS Usuários Organizações Fabricantes de software Marketing e vendedores Sistemas Interativos Fabricantes de hardware Profissionais de suporte Produtores de Conteúdo Provedores de Acesso à Internet

51 sumário conceitos básicos: interface, interação, affordance objetos de estudo de IHC multidisciplinaridade referência: Capítulos 1 e 2 51

52 affordances

53 O que (se percebe que) se pode fazer com [ ] E com que resultado?

54 características do sistema perceptíveis pelo usuário que revelam: as operações que o usuário pode fazer com cada elemento de interface (widget) (o que posso fazer) as formas de manipulação dos widgets para realizá-las (como posso fazer) affordances (adaptado de Barbosa e Silva, 2010) 54

55 Affordance (1/2) Definição do conceito no campo da Psicologia (Gibson, final da década de 1970).

56 Affordance (2/2) Características dos objetos de interface que mostram aos seus usuários como tais objetos podem ser manipulados. INF Introdução a Alberto Barbosa Raposo

57 affordances de elementos de interface (widgets) Como fecho esta janela? Esta eu posso minimizar, maximizar (e restaurar) e fechar. Também posso redimensionar. Esta eu sei como fechar E aqui eu vejo o status. 57

58 affordances inadequadas? Posso minimizar ou maximizar esta janela. Em que situações isso faz sentido? Aqui posso ver uma mensagem de status. Que tipo de status apareceria aqui? Em que situações isso faz sentido? É possível redimensionar esta janela. Em que situações isso faz sentido? 58

59 affordances de elementos de interface (widgets) Posso selecionar zero, uma ou mais opções. Tenho que selecionar uma única opção. opções independentes (checkboxes) opções mutuamente exclusivas (radio buttons) 59

60 exemplo de (falsas?) affordances grupos de opções mutuamente exclusivas 60

61 exemplo de affordances Posso selecionar professores, mas só tem uma opção. Projetar affordances claras é importante, mas não é suficiente para uma boa experiência. Posso clicar, mas só avança se um nome tiver sido selecionado. 61

62 Outro exemplo de falsa affordance Interface para tablet de um jornal Não são sensíveis a toque (i.e., não são itens de menu)

63 Outros exemplos

64 sumário conceitos básicos: interface, interação, affordance objetos de estudo de IHC multidisciplinaridade retorno sobre o investimento referência: Capítulos 1 e 2 64

65 Afinal, IHC trata de quê? Do projeto, implementação e avaliação de Sistemas Computacionais Interativos para uso humano, juntamente com os fenômenos relacionados a esse uso (Hewett et al. 1992). Objetos de estudo de IHC Natureza da Interação; Contexto de Uso; Características humanas; Arquitetura de Sistemas Computacionais; Processos de desenvolvimento.

66 Objetos de Estudo de IHC Natureza da Interação; Contexto de Uso; Características humanas; Arquitetura de Sistemas Computacionais; Processos de desenvolvimento.

67 Objetos de estudo de IHC 67

68 Um grande desafio de equipes multidisciplinares é lidar com problemas de comunicação. 68

69 mito ou fato? se o design é bom, detalhes não importam 69

70 o botão de US$ ,00 escolha de produtos Qual foi mesmo o que eu usei? checkout Senha: Login Esqueci minha senha Registre-se definir US$ pagamento no primeiro ano Só quero fazer uma compra = e não entrar num relacionamento. US$ no primeiro mês = Senha: Como Loginvocês solucionariam Continuar > esses Esqueci minha problemas? senha Você não precisa se registrar para efetuar sua compra em nosso site. Simplesmente clique em Continuar para prosseguir. 45% aumento em compras usuário com cadastro Se você quiser, poderá criar uma conta durante o checkout para acelerar seu processo de compra no futuro. usuário sem cadastro 70

71 dúvidas? modelo conceitual interface interação modelo conceitual visão 71

Documentos relacionados

Conteúdo da Aula Tecnologias de Informação e Comunicação (TICs) Desenvolvimento de Sistemas Interativos Objetos de Estudo em IHC Interação e Interface

Interação Humano-Computador: Conceitos Básicos INF 1403 Introdução a IHC Aula 02 17/02/2014 Conteúdo da Aula Tecnologias de Informação e Comunicação (TICs) Desenvolvimento de Sistemas Interativos Objetos