53
serg semiotic engineering research group MoLIC – modelagem da interação MoLIC – modelagem da interação Paula 2003, Barbosa & Paula 2003, Silva 2005, Barbosa & Silva 2007 Paula 2003, Barbosa & Paula 2003, Silva 2005, Barbosa & Silva 2007

MoLIC – modelagem da interação - PUC-Rio · 2014-05-21 · serg semiotic engineering research group MoLIC – modelagem da interação Paula 2003, Barbosa & Paula 2003, Silva

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

serg semiotic engineering research group

MoLIC –modelagem da interaçãoMoLIC –modelagem da interação

Paula 2003, Barbosa & Paula 2003, Silva 2005, Barbosa & Silva 2007Paula 2003, Barbosa & Paula 2003, Silva 2005, Barbosa & Silva 2007

Interação na EngSemInteração na EngSem

• metáfora de interação como conversa

• discurso interativo

– possíveis conversas travadas entre usuário e preposto do designer

• metáfora de interação como conversa

• discurso interativo

– possíveis conversas travadas entre usuário e preposto do designer

© SERG, 2008 2

preposto do designer

•possíveis: caminhos de interação típicos, alternativos e de exceção

•conversas: interação, sem detalhes de interface

•preposto do designer: porta-voz do designer, e não apenas um conjunto organizado de funções

preposto do designer

•possíveis: caminhos de interação típicos, alternativos e de exceção

•conversas: interação, sem detalhes de interface

•preposto do designer: porta-voz do designer, e não apenas um conjunto organizado de funções

Diagrama de interaçãoDiagrama de interação

• modelo diagramático:

– dá aos designers uma visão global do discurso interativo

– permite refletir sobre

• modelo diagramático:

– dá aos designers uma visão global do discurso interativo

– permite refletir sobre

© SERG, 2008 3

– permite refletir sobre

soluções alternativas de design

– permite refletir sobre

soluções alternativas de design

MoLIC: Modeling Language for Interaction as ConversationMoLIC: Modeling Language for Interaction as Conversation

• MoLIC é uma linguagem que os designers de IHC podem utilizar para modelar a interação dos usuários com sistemas computacionais, seguindo a metáfora de interação como conversa.

• Modelar a interação na MoLIC é modelar a conversa entre o usuário e o preposto (porta-voz) do

• MoLIC é uma linguagem que os designers de IHC podem utilizar para modelar a interação dos usuários com sistemas computacionais, seguindo a metáfora de interação como conversa.

• Modelar a interação na MoLIC é modelar a conversa entre o usuário e o preposto (porta-voz) do entre o usuário e o preposto (porta-voz) do designer cristalizado na interface.

• Um bom manual de MoLIC está na página da Profa. Simone: http://www-di.inf.puc-rio.br/~simone/publications/07_12_silva.pdf

entre o usuário e o preposto (porta-voz) do designer cristalizado na interface.

• Um bom manual de MoLIC está na página da Profa. Simone: http://www-di.inf.puc-rio.br/~simone/publications/07_12_silva.pdf

MoLIC - Estrutura da ConversaMoLIC - Estrutura da Conversa

Como a conversa é aberta?Como a conversa é aberta?

abertura

© SERG, 2008 6

Como a conversa é fechada?Como a conversa é fechada?

fechamento

© SERG, 2008 7

fechamento

Cadastrar disciplina

Sobre o quê o usuário poderá falar?Sobre o quê o usuário poderá falar?

Cadastrar

disciplina

tópico

cena

Cadastrar disciplina

d+u: código, título, horário,

professor, sala

© SERG, 2008 8

tópicocena

diálogos

Dúvidas?Dúvidas?

Cadastrar

© SERG, 2008 9

Cadastrar

disciplina

Cadastrar disciplina

d+u: código, título, horário,

professor, sala

Cadastrar disciplina

d+u: código, título, horário,

professor, sala

u: gravar

Quando e como o preposto pode responder ao que o usuário disse?Quando e como o preposto pode responder ao que o usuário disse?

fala de transição do usuário

© SERG, 2008 10

Cadastrar disciplina

d+u: código, título, horário,

professor, sala

u: gravar

O que houve?O que houve?

u: gravar

d: dados válidos e

armazenamento OK

© SERG, 2008 11

processamento do sistema

fala de transição do preposto

O que houve?O que houve?

© SERG, 2008 12

monólogo do preposto

E se algo der errado?E se algo der errado?

fala de recuperaçãode breakdown

© SERG, 2008 13

serg semiotic engineering research group

Prevenção e Tratamento de BreakdownsPrevenção e Tratamento de Breakdowns

Prevenção PassivaPrevenção Passiva

15© SERG, 2008

Prevenção ativaPrevenção ativa

(permite apenas entrada de números)

© SERG, 2008 16

Prevenção apoiadaPrevenção apoiada

© SERG, 2008 17

Tratamento apoiadoTratamento apoiado

© SERG, 2008 18

Captura de erroCaptura de erro

© SERG, 2008 19

serg semiotic engineering research group

Voltando à MoLICVoltando à MoLIC

E se algo der errado?E se algo der errado?

fala de recuperaçãode breakdown

© SERG, 2008 21

E se demorar para o sistema concluir um processamento?E se demorar para o sistema concluir um processamento?

© SERG, 2008 22

Quando um usuário pode “falar” sobre um tópico?Quando um usuário pode “falar” sobre um tópico?

acesso ubíquo

© SERG, 2008 23

acesso ubíquo com pré-condição

Dúvidas?Dúvidas?

Cadastrar disciplina

d+u: código, título, horário,

professor, sala

u: gravar

d: [TA] código da

u: cadastrar disciplina

© SERG, 2008 24

d: dados válidos e

armazenamento OK

d: Disciplina criada com

sucesso

: [ ] código da

disciplina já existe

A interação de um usuário pode afetar a do outroA interação de um usuário pode afetar a do outro

© SERG, 2008 25

Cenas epistêmicas – conversa com materiaisCenas epistêmicas – conversa com materiais

somente signos, sem diálogos

© SERG, 2008 26

Decisões de design (I)Decisões de design (I)

Publicar notícia

d+u:dados da notícia:

categoria,

data(default=hoje),

título,

primeira página,

imagem,

conteúdo

u: publicar notícia

u: gravar notícia [TA] d: título ou

Publicar notícia

d+u:dados da notícia:

categoria,

data(default=hoje),

título,

primeira página,

imagem,

conteúdo

u: publicar notícia

u: gravar notícia [TA] d: título ou

© SERG, 2008 27

gravar notícia

d: notícia gravada

com sucesso

conteúdo vaziogravar notícia

d: notícia gravada

com sucesso

conteúdo vazio

Confirmar notícia

d: dados da notícia

d: título e conteúdo válidos

u: confirmar

u: modificar

notícia

Decisões de design (II)Decisões de design (II)

Publicar notícia

d+u: dados da notícia: título,

data

u: publicar notícia

pre: título preenchido

© SERG, 2008 28

pre título preenchido

u: continuar

Publicar notícia (cont.)

d+u: texto da notícia

pre: texto preenchido

u: publicar

...

Como construir o diagrama de interação?Como construir o diagrama de interação?

MoLIC – Montar TCPMoLIC – Montar TCP

MoLIC – Montar TCPMoLIC – Montar TCP

MoLIC – Montar TCPMoLIC – Montar TCP

MoLIC – Montar TCPMoLIC – Montar TCP

MoLIC – Montar TCPMoLIC – Montar TCP

MoLIC – Montar TCPMoLIC – Montar TCP

MoLIC – Montar TCPMoLIC – Montar TCP

Como MoLIC ajuda o projetista de IHC a pensarComo MoLIC ajuda o projetista de IHC a pensar

Questões relacionadas à interaçãoQuestões relacionadas à interação

• para cada meta ou fragmento de conversa

– seqüência

• Como você faz isto hoje? Como você gostaria de fazer isto? Quais são os passos necessários para fazer isto?

• Em que momento você começa a fazer isto?

• O que precisa para você fazer isto? O que precisa ter acontecido? O que dispara isto?

– resultados

• O que acontece após fazer isto? Qual é o resultado?

• para cada meta ou fragmento de conversa

– seqüência

• Como você faz isto hoje? Como você gostaria de fazer isto? Quais são os passos necessários para fazer isto?

• Em que momento você começa a fazer isto?

• O que precisa para você fazer isto? O que precisa ter acontecido? O que dispara isto?

– resultados

• O que acontece após fazer isto? Qual é o resultado?

© SERG, 2008 39

• O que acontece após fazer isto? Qual é o resultado?

• O que você { precisa | deve } fazer depois disto? O que mais precisa ser feito?

– problemas e dificuldades

• Que problemas podem ocorrer ao fazer isto? Como você os detecta? Como os resolve?

• Que dificuldades você enfrenta ao fazer isto? Como você as resolve?

• Como você { cancela | desfaz } isto?

– alternativas

• Você gostaria de fazer isto de alguma outra forma? Como?

• O que acontece após fazer isto? Qual é o resultado?

• O que você { precisa | deve } fazer depois disto? O que mais precisa ser feito?

– problemas e dificuldades

• Que problemas podem ocorrer ao fazer isto? Como você os detecta? Como os resolve?

• Que dificuldades você enfrenta ao fazer isto? Como você as resolve?

• Como você { cancela | desfaz } isto?

– alternativas

• Você gostaria de fazer isto de alguma outra forma? Como?

adaptado de Aureliano 2007

Resumo: Elementos MOLiCResumo: Elementos MOLiC

© SERG, 2008 40

serg semiotic engineering research group

Da interação para a interfaceDa interação para a interface

Da interação para a interfaceDa interação para a interface

• acessos ubíquos → menu principal ou barra de navegação

• acessos ubíquos → menu principal ou barra de navegação

© SERG, 2008 42

Disciplina

Nova...

Buscar...

Trabalho

Novo...

Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• cena → unidade de apresentação (tela, página)

• cena → unidade de apresentação (tela, página)

© SERG, 2008 43Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• diálogo → grupos de signos relacionados• diálogo → grupos de signos relacionados

Cadastrar disciplina

d+u: código, título, horário,

professor, sala

© SERG, 2008 44Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• signo → elemento de interface (widget)• signo → elemento de interface (widget)

código: expressão = AA9999;título: restrição = 50 chars;professor: conjunto;sala: texto livre;horário: texto livre

© SERG, 2008 45Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• fala de transição do usuário → botão ou link• fala de transição do usuário → botão ou link

© SERG, 2008 46Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• fala de transição do preposto → unidade de apresentação separada ou feedbackembutido numa unidade de apresentação

• fala de transição do preposto → unidade de apresentação separada ou feedbackembutido numa unidade de apresentação

Student LifeStudent LifeCadastrar disciplina

© SERG, 2008 47

Student LifeStudent Life

Disciplina armazenada com sucesso.

Cadastrar disciplina

d+u: código, título, horário,

professor, sala

u: gravar

d: dados válidos e

armazenamento OK

Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• mecanismos de recuperação de ruptura →mensagens de erro

• mecanismos de recuperação de ruptura →mensagens de erro

Erro ao cadastrar disciplinaErro ao cadastrar disciplina

Cadastrar disciplina

d+u: código, título, horário,

professor sala

© SERG, 2008 48

O código “INF1001” já existe e está

associado à disciplina ‘Introdução à

Ciência da Computação”

OK

professor, sala

u: gravar

d: dados válidos e

armazenamento OK

d: [TA] código da

disciplina já existe

Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• mecanismos de prevenção passiva de ruptura → instruções contextualizadas

• mecanismos de prevenção passiva de ruptura → instruções contextualizadas

49Silva & Barbosa 2007

Da interação para a interfaceDa interação para a interface

• pré-condições → ativar/desativar; exibir/ocultar elementos de interface

• pré-condições → ativar/desativar; exibir/ocultar elementos de interface

50Silva & Barbosa 2007

Cenário para os exercíciosCenário para os exercícios

• Marta precisa transferir o dinheiro do aluguel para Ana. Mas antes precisa verificar se a sua bolsa já foi depositada. Ela entra no sistema bancário, informa seu número de conta e senha, e recebe o saldo da conta. Ela percebe que tem mais dinheiro do que esperava, e resolve verificar o extrato das transações mais recentes. Pelas últimas transações apresentadas, Marta percebe que o

• Marta precisa transferir o dinheiro do aluguel para Ana. Mas antes precisa verificar se a sua bolsa já foi depositada. Ela entra no sistema bancário, informa seu número de conta e senha, e recebe o saldo da conta. Ela percebe que tem mais dinheiro do que esperava, e resolve verificar o extrato das transações mais recentes. Pelas últimas transações apresentadas, Marta percebe que o últimas transações apresentadas, Marta percebe que o cheque que tinha passado no dia anterior ainda não foi depositado. Ela então prossegue para transferir o dinheiro a Ana: ela seleciona a conta da Ana de uma lista de contas cadastradas, informa a quantia a ser transferida e confirma a operação com sua senha. Ela obtém uma confirmação impressa da transferência para dar para Ana, verifica o seu saldo mais uma vez e sai do sistema.

últimas transações apresentadas, Marta percebe que o cheque que tinha passado no dia anterior ainda não foi depositado. Ela então prossegue para transferir o dinheiro a Ana: ela seleciona a conta da Ana de uma lista de contas cadastradas, informa a quantia a ser transferida e confirma a operação com sua senha. Ela obtém uma confirmação impressa da transferência para dar para Ana, verifica o seu saldo mais uma vez e sai do sistema.

© SERG, 2008 51

Exercício: construa um diagrama de interação para os objetivos de verificar saldo, extrato e realizar transferência.

Exercício: construa um diagrama de interação para os objetivos de verificar saldo, extrato e realizar transferência.

© SERG, 2008 52

Exercício: Esboce as telas da aplicação bancáriaExercício: Esboce as telas da aplicação bancária

© SERG, 2008 53