inf1403 – introdução a interação humano-computador...

serg

11

(c) SERG, 2010

11

INF1403 INF1403 –– IntroduIntroduçção a Interaão a Interaçção ão HumanoHumano--Computador (IHC)Computador (IHC)

Turma 3WATurma 3WAProfessora: Clarisse Sieckenius de SouzaProfessora: Clarisse Sieckenius de Souza

IHC = ComunicaIHC = Comunicaçção Humana Mediada por ão Humana Mediada por Computadores: Engenharia SemiComputadores: Engenharia Semióótica I e IItica I e II

24 e 29/Mar/201024 e 29/Mar/2010

serg

22

(c) SERG, 2010

http://mitpress.mit.edu/catalog/item/default.asp?ttype=2&tid=10486

IHC no DI da PUCIHC no DI da PUC--Rio Rio <=><=> Engenharia SemiEngenharia Semióóticatica

serg

33

(c) SERG, 2010

http://www.morganclaypool.com/doi/abs/10.2200/S00173ED1V01Y200901HCI002


serg

44

(c) SERG, 2010


Disponível para você baixar e ler em:

http://www.inf.puc-rio.br/~inf1403/docs/JAI2007_Prates

Barbosa_EngSem.pdf

serg

55

(c) SERG, 2010

Duas Duas ““teorias de IHCteorias de IHC””

Engenharia CognitivaEngenharia Cognitiva(Norman, 1986)(Norman, 1986)

OBJETIVOOBJETIVOGerar e organizar conhecimentos Gerar e organizar conhecimentos ssóólidos para favorecer o lidos para favorecer o desenvolvimento de bons projetos desenvolvimento de bons projetos de interade interaçção humanoão humano--computador.computador.

BASE & FOCOBASE & FOCOCognitiva / Aprendizado e Cognitiva / Aprendizado e CompreensãoCompreensão

Quem estQuem estáá em cena na interaem cena na interaçção?ão?UsuUsuáário (somente).rio (somente).

Engenharia SemiEngenharia Semióóticatica(de Souza, 2005)(de Souza, 2005)

OBJETIVOOBJETIVOGerar e organizar conhecimentos Gerar e organizar conhecimentos ssóólidos para favorecer o lidos para favorecer o desenvolvimento de bons projetos desenvolvimento de bons projetos de interade interaçção humanoão humano--computador.computador.

BASE & FOCOBASE & FOCOSemiSemióótica / Comunicatica / Comunicaçção e ão e ExpressãoExpressão

Quem estQuem estáá em cena na interaem cena na interaçção?ão?UsuUsuáário e Projetista (Designer) rio e Projetista (Designer) do sistema.do sistema.

COMO? POR QUÊ?COMO? POR QUÊ?

serg

66

(c) SERG, 2010

SemiSemióótica????tica????

•• SemiSemióótica tica éé uma disciplina que estuda como (e por que) uma disciplina que estuda como (e por que) as pessoas atribuem significado as pessoas atribuem significado ààs coisas, e como usam s coisas, e como usam as coisas para significar o que querem dizer.as coisas para significar o que querem dizer.– Tudo o que ‘tem significado’

para alguém é um SIGNO.• Exemplos:

Palavras têm significado(‘semiótica’ significa algo).

Imagens têm significado (→)Lugares, pessoas, aromas,

sensações, lembranças...Tudo pode ter significadoTudo pode ter significado.

Tudo pode ser um signo.

serg

77

(c) SERG, 2010

SISTEMAS DE SIGNIFICASISTEMAS DE SIGNIFICAÇÇÃOÃO

•• Como qualquer coisa pode ser um signo (isto Como qualquer coisa pode ser um signo (isto éé: ter um : ter um significado para algusignificado para alguéém), o espam), o espaçço de possibilidades de o de possibilidades de significasignificaçção ão éé INFINITO, e pode ser bastante INFINITO, e pode ser bastante DESREGRADO.DESREGRADO.– Exemplo: Uma colagem de Picasso (→)

• O que Picasso está comunicando?

ComunicaComunicaçção Humanaão HumanaAssentada sobre a Assentada sobre a linguagemlinguagem..Linguagem = Sistema de SignificaLinguagem = Sistema de Significaççãoão

•• AssociaAssociaçção ão ‘‘regular, sistemregular, sistemááticatica’’ entre expressões e conteúdos, baseada naculturacultura em que surge.

serg

88

(c) SERG, 2010

Interfaces: Sistemas de SignificaInterfaces: Sistemas de Significaççãoão

•• As interfaces de artefatos computacionais interativos As interfaces de artefatos computacionais interativos são repletas de sistemas de significasão repletas de sistemas de significaçção:ão:– Associam com regularidade certas expressões (textos, imagens,

sons, ‘widgets’) a certos conteúdos estabelecidos• na cultura geral do usuário (costumes de seu país, sua língua,

valores regionais, etc.)• na cultura tecnológica do usuário (suas práticas com computadores

e programas, aparelhos eletro-eletrônicos digitais, etc.).

– Exemplos de expressões de sistemas de significações comuns nas interfaces que conhecemos

texto

serg

99

(c) SERG, 2010

Computadores: Um tipo de MComputadores: Um tipo de Míídiadia

•• Os computadores são meios de comunicaOs computadores são meios de comunicaçção entre pessoas. ão entre pessoas. Veja exemplo da loja Veja exemplo da loja Submarino.com.br .Submarino.com.br .

serg

1010

(c) SERG, 2010

AtAtéé em em ‘‘aplicaaplicaçções pessoaisões pessoais’’ hháá espaespaçços de mos de míídiadia

•• Os desenvolvedores do MS Office se comunicam com seus Os desenvolvedores do MS Office se comunicam com seus usuusuáários (clientes) atravrios (clientes) atravéés da interface.s da interface.

Tela do MS Power PointTela do MS Power Point

serg

1111

(c) SERG, 2010

Tecnologias de Tecnologias de Persuasão (B J Fogg)Persuasão (B J Fogg)Visite o site Visite o site

http://captology.stanford.edu/http://captology.stanford.edu/

Fonte dos exemplos:http://captology.stanford.edu/examples.html

serg

1212

(c) SERG, 2010

UsuUsuáários e Projetistas estão em cena na interarios e Projetistas estão em cena na interaççãoão

Como?Como?– Nos slides anteriores pode-se ver claramente a marca da

presença do projetista ‘falando’ na interação.

– Mas ... como o projetista pode de fato participar da interação se ele não estnão estáá lláá na horana hora?

– A interface é o representante do projetista na conversa com o usuário.

• Tecnicamente dizemos que a interface é o preposto (o que estádesignado para agir/falar em nome) do projetista ou designer do artefato computacional interativo.

serg

1313

(c) SERG, 2010

O projetista/O projetista/designerdesigner faz parte da IHC (1/2)faz parte da IHC (1/2)

•• Por quê?Por quê?– Primeiro, vamos pensar: qual o problema se ele não fizer parte

da IHC?

Por exemplo, pensemos na engenharia cognitiva: qual a conseqüência de aquela teoria de IHCteoria de IHC não incluir o projetista na cena de interação?

Como caracterizar a interaComo caracterizar a interaçção do filme ão do filme `msn`msn--groupsgroups--cancel.avi?cancel.avi?

É fácil ou natural modelar esta interação como uma sequência de ações totalmente centrada no usuário (ie. na qual “um outro” não está ele também realizando ações determinantes do curso que a interação está tomando? POR QUÊ?

serg

1414

(c) SERG, 2010

O projetista/O projetista/designerdesigner faz parte da IHC (2/2)faz parte da IHC (2/2)– Agora, vamos pensar: e se ele fizer parte da IHC?

Por exemplo, pensemos nas vantagensvantagens de uma teoria de IHCteoria de IHC que inclui o projetista na cena de interação?

1. Ela deve gerar e organizar conhecimentos que:–– ExplicamExplicam como se dá esta interação através do sistema; e– Indicam quais os meios e modos mais adequadosmeios e modos mais adequados para

diferentes tipos e objetivos de comunicação entre o projetista e o usuário.

2. Ela revela aos usuários que os sistemas são produtos da produtos da inteligência, da competência tinteligência, da competência téécnica e das escolhas humanascnica e das escolhas humanas, e por isto:

– Seus projetistas têm responsabilidadeprojetistas têm responsabilidade pelos efeitos do produto; e

– Sempre há alternativas (melhores e piores) para o projeto do produto. Nenhum produto tem uma Nenhum produto tem uma úúnica forma de se nica forma de se concretizarconcretizar.

serg

1515

(c) SERG, 2010

CaracterizaCaracterizaçção de IHC ão de IHC –– A visão A visão centrada na comunicacentrada na comunicaççãoão

•• A idA idééia central de Engenharia Semiia central de Engenharia Semióóticatica– Os designers se comunicam com os usuários em tempo de interação.– A interface do sistema representa o designer durante a interação.

•• MetacomunicaMetacomunicaççãoão– ‘Communicação sobresobre communicação’

O projetista comunica como e por que o usuário deve se comunicar com o sistema.

– O que os designers dizem para os usuários através de/durante a interação:

“Eis a minha visão de quem você é,o que aprendi que você deseja ou precisa fazer,de que formas preferenciais e por quê.Este é o sistema que conseqüentemente elaborei para você,e esta é a forma como você pode ou deve usá-lo para realizar um

conjunto de objetivos que se enquadram nesta visão."

serg

1616

(c) SERG, 2010

Exemplos: MetacomunicaExemplos: Metacomunicaçção em Editores de Textoão em Editores de Texto

•• NotepadNotepad•• WordPadWordPad•• TextPadTextPad•• Notepad ++Notepad ++

•• 2 Tipos de Metacomunica2 Tipos de Metacomunicaççãoão–– EstEstááticatica:

• O que o projetista está dizendo para o usuário a partir de telas fixas de interface

–– DinâmicaDinâmica:• O que o projetista está dizendo para o usuário da sucessão de telas em um

contexto de interação

serg

1717

(c) SERG, 2010

Notepad: Signos EstNotepad: Signos Estááticosticos

Abrir Notepad einspecionar menus:

O que é o editor?Para que serve?Para que não serve?Como usar?

serg

1818

(c) SERG, 2010

Wordpad : Signos EstWordpad : Signos Estááticosticos

Abrir Worpad einspecionar menus:


serg

1919

(c) SERG, 2010

TextPad : Signos EstTextPad : Signos Estááticosticos

Baixar trial do Textpad de:http://www.textpad.com/

Abrir TextPad einspecionar menus:


serg

2020

(c) SERG, 2010

Notepad ++ : Signos EstNotepad ++ : Signos Estááticosticos

Baixar o Notepad ++ de:http://notepad-plus.sourceforge.net/uk/site.htm

Abrir Notepad ++ e inspecionar menus:


serg

2121

(c) SERG, 2010

Signos DinâmicasSignos Dinâmicas1.1. Os signos dinâmicos aparecem como efeito de uma interaOs signos dinâmicos aparecem como efeito de uma interaçção. Em ão. Em

telas fixas, não são permanentemente percepttelas fixas, não são permanentemente perceptííveis (embora veis (embora possam aparecer por uns segundos e depois sumir).possam aparecer por uns segundos e depois sumir).

Assista aos filmes pré-gravados (*.avi comprimidos no arquivo ‘filmes-aula07.rar’).

Neles, um usuário professor tem uma lista de chamada e quer apagar todos os números de matrícula, deixando só os nomes dos alunos.

2.2. Em cada um dos editores, analise a seqEm cada um dos editores, analise a seqüüência (dinâmica) de ência (dinâmica) de interainteraçção e volte a responder:ão e volte a responder:– O que é o editor?– Para que serve?– Para que não serve?– Como usar?

serg

2222

(c) SERG, 2010

Engenharia SemiEngenharia Semióótica: Conclusões Preliminarestica: Conclusões Preliminares

Os projetistas se comunicam, sim, com os usuOs projetistas se comunicam, sim, com os usuáários em tempo de rios em tempo de interainteraçção. Porão. Poréém m ……

– Sua comunicação nem sempre é feita em linguagem natural. Às vezes a única base da comunicação é:

• O que o ‘preposto do designer’ está deixando o usuário fazer; e• Como o ‘preposto do designer’ está reagindo ao que usuário fez.

Comunicação por seqüências de ‘falas’ (em vários tipos de linguagens disponíveis na interface para interação). Sempre há SIGNOS ESTÁTICOS e SIGNOS DINÂMICOS na comunicação. Procure por eles.

Preste especial atenção ao caminho de metacomunicação através do qual o usuário descobriu a forma mais fácil de apagar as matrículas da lista de chamada no filme ‘notepad-plusplus-ValorDoErro.avi’.

Papel da Cultura e do Conhecimento Prévio:Se o usuário não tivesse experiência com o TextPad, será que ele teria ‘captado’ a metacomunicação do projetista do Notepad ++?

serg

2323

(c) SERG, 2010

Para finalizar:Para finalizar: Interpretante & semiose ...Interpretante & semiose ...palavras expalavras exóóticas, conceitos simplesticas, conceitos simplesInterpretInterpretanteante –– um significado em processoum significado em processo

– O significado de uma coisa evolui constantemente, através das novas associações que fazemos a cada vez que encontramos o signo a que ele se refere.

• Por exemplo: ‘Interação Humano-Computador’.– Na primeira aula, este SIGNO tinha um significado (talvez vago) que a

cada nova aula ganha, para todos nós, novas facetas – se enriquece. Algumas facetas são meramente ADICIONADAS; outras SUBSTITUEM facetas que estavam imprecisas ou equivocadas; outrasainda SÃO POSSIBILIDADES, PERGUNTAS ... facetas de significado que só entenderemos melhor no futuro, depois de novos encontros com o mesmo signo ‘Interação Humano-Computador’.

SemioseSemiose –– o processo indefinidamente longo e o processo indefinidamente longo e imprevisimprevisíível pelo qual os signos adquirem novas facetas vel pelo qual os signos adquirem novas facetas de significado em nossas mentes.de significado em nossas mentes.

serg

2424

(c) SERG, 2010

Interpretante e Semiose em IHCInterpretante e Semiose em IHC•• Um caso antigo, mas exemplar: Veja o filme cdplayerUm caso antigo, mas exemplar: Veja o filme cdplayer--Win95 Win95

Ao encontrar o signo Ao encontrar o signo ‘‘REMOVEREMOVE ’’o usuo usuáário rio imaginaimagina um significadoum significadoposspossíível (interpretante): removervel (interpretante): removerda lista ao lado (de faixas do CD!).da lista ao lado (de faixas do CD!).

– Mas, acha que não pode ser issoe vai em frente. Aparentementetudo dá certo, até que um tempodepois ... em novo encontro comos signos de interface, ele nãoouve todas as faixas! Será queo significado era mesmo aquele??

SEMIOSE: uma geração de significados que continua sempre.

inf1403 – introdução a interação humano-computador...

Documents