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

25
serg 1 1 (c) SERG, 2010 1 1 INF1403 INF1403 Introdu Introdu ç ç ão a Intera ão a Intera ç ç ão ão Humano Humano - - Computador (IHC) Computador (IHC) Turma 3WA Turma 3WA Aula dada por Andr Aula dada por Andr é é ia Sampaio ia Sampaio Projeto de IHC: Projeto de IHC: Modelos de Design de Intera Modelos de Design de Intera ç ç ão ão 12/05/2010 12/05/2010

Upload: hanhi

Post on 25-Feb-2018

213 views

Category:

Documents


0 download

TRANSCRIPT

serg

11

(c) SERG, 2010

11

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

Turma 3WATurma 3WAAula dada por AndrAula dada por Andrééia Sampaioia Sampaio

Projeto de IHC: Projeto de IHC: Modelos de Design de InteraModelos de Design de Interaççãoão

12/05/201012/05/2010

serg

22

(c) SERG, 2010

Explorando o design da Urna Eletrônica BrasileiraQuestões1. Quem são os usuários?

R: TODOS os eleitores brasileiros.2. Necessidades?

R: Exercer o direito/dever civil de votar.

3. O que é votar?R: Indicar sobre qual(quais) candidato(s) recai sua preferência.

4. O que é voto branco e voto nulo?R: Voto branco = não indicar preferência. Voto nulo = invalidar voto, através de erro voluntário ou involuntário.

Texto ao lado retirado, em 15/05/2006, do Texto ao lado retirado, em 15/05/2006, do websitewebsite do TSE na URL:do TSE na URL:httphttp://www.tse.://www.tse.govgov..brbr//downloadsdownloads/eleicoes2004//eleicoes2004/faqfaq..htmlhtml#pergunta16#pergunta16

O CO Cóódigo Eleitoral prevê que se mais da metade dos votos for de digo Eleitoral prevê que se mais da metade dos votos for de votos nulos, servotos nulos, seráá convocada nova eleiconvocada nova eleiçção ("Art. 224. Se a nulidade ão ("Art. 224. Se a nulidade atingir a mais de metadeatingir a mais de metade dos votos do Pados votos do Paíís nas eleis nas eleiçções ões presidenciais, do Estado nas eleipresidenciais, do Estado nas eleiçções federais e estaduais, ou do ões federais e estaduais, ou do MunicMunicíípio nas eleipio nas eleiçções municipais, julgarões municipais, julgar--sese--ãoão prejudicadas as prejudicadas as demais votademais votaçções, e o Tribunal marcarões, e o Tribunal marcaráá dia para nova eleidia para nova eleiçção dentro ão dentro do prazo de 20 (vinte) a 40 (quarenta) diasdo prazo de 20 (vinte) a 40 (quarenta) dias””).).Os votos em branco, de forma diversa, não anulam o pleito, pois Os votos em branco, de forma diversa, não anulam o pleito, pois não não são considerados como nulos para efeito do art. 224 do Csão considerados como nulos para efeito do art. 224 do Cóódigo digo Eleitoral (AcEleitoral (Acóórdão nrdão nºº 7.543, de 03/05/1983).7.543, de 03/05/1983).

serg

33

(c) SERG, 2010

Do que trata o design de interação

• Design = “plano ou concepção intelectual que seráexecutada posteriormente”

• Atividades Básicas do Design de Interação1. Identificar necessidades e estabelecer requisitos2. Desenvolver designs alternativos3. Construir versões interativas (avaliáveis, mesmo que como

esboço ou maquete) dos designs4. Avaliar as alternativas

serg

44

(c) SERG, 2010

Do que trata o design de interação (Cont.)• Design = “plano ou concepção intelectual que será executada

posteriormente”• Atividades Básicas do Design de Interação

1. Identificar necessidades e estabelecer requisitos2. Desenvolver designs alternativos

– Design conceitual: como representar?– Representações abstratas (em notações gráficas ou textuais)– Representações “em discurso” (textos descritivos/narrativos em português ou

outra língua, com/sem ilustrações gráficas)3. Construir versões interativas (avaliáveis, mesmo que como esboço ou

maquete) dos designs– Desgin físico: como representar?

– Esboços ou maquetes– Protótipos (de baixa ou de alta fidelidade, parciais ou completos)

4. Avaliar as alternativas

serg

55

(c) SERG, 2010

Do que trata o design de interação (Cont.)

• Design = “plano ou concepção intelectual que seráexecutada posteriormente”

• Atividades Básicas do Design de Interação1. Identificar necessidades e estabelecer requisitos2. Desenvolver designs alternativos3. Construir versões interativas (avaliáveis, mesmo que como

esboço ou maquete) dos designs4. Avaliar as alternativas

– Avaliação sobre representações– Que métodos podem ser aplicados?– Qual o significado dos resultados?– Como tomar decisões sobre a melhor escolha?

serg

66

(c) SERG, 2010

Do que trata o design de interação (Cont.)

• Características-chave do processo de design de IHC1. Manter sempre o foco no usuário2. Estabelecer objetivos específicos com relação à experiência

que se espera que o usuário tenha3. Iterar o processo

serg

77

(c) SERG, 2010

Usuários• Quem são os usuários?

1. Obviamente, quem usa o sistema.2. Mas também, quem tem relação direta com quem usa (por exemplo:

superiores ou subordinados, clientes, etc.)

Classificação de Eason (1987)– Usuários primários (freqüentes).– Usuários secundários (ocasionais ou que têm intermediários)– Usuários terciários (afetados pela introdução do sistema ou os

decisores que determinam a sua introdução)

“Stakeholders” são todos os que têm alguma participação ou interesse no uso do sistema.Pergunta: Quem são os stakeholders da urna eletrônica brasileira?

serg

88

(c) SERG, 2010

Usuários (Cont.)

• Quais as suas “necessidades”?– O design de IHC deve contemplar as “necessidades” dos

usuários (i.e. resposta para a pergunta: “Do que [você] precisa?”, respondida pelo próprio e/ou por pessoas envolvidas no atendimento destas necessidades.

– O design de IHC deve contemplar também as “oportunidades”que os usuários poderiam passar a ter (e as novas necessidades daí advindas) pela introdução de tecnologia nova.

serg

99

(c) SERG, 2010

Designs alternativos

• Como criar?– Examinar problemas similares e suas respectivas soluções

• Adaptar soluções correntes• Construir uma (ou mais) solução(soluções) nova(s)

– Não havendo problemas similares• Inventar uma solução e explorar alternativas para ela

serg

1010

(c) SERG, 2010

Designs alternativos (Cont.)

• Como escolher a melhor alternativa?– AVALIANDO

• Quando avaliar?– Depende do ciclo de vida do design e do desenvolvimento do sistema.

serg

1111

(c) SERG, 2010

Modelos do Ciclo de Vida de um Sistema Interativo

• Modelo de ciclo de vida simples para design de IHC

AvaliarAvaliar(Re)Design(Re)Design

Identificar necessidades/

estabelecer requisitos

Construirversõesinterativas

Final product

serg

1212

(c) SERG, 2010

Explorando o design da Urna Eletrônica BrasileiraExemplo de AvaliaçãoObjetivo: encontrar uma alternativa

de design para a interface do voto “nulo” na Urna Eletrônica Brasileira.

1. Identificar as necessidades de um eleitor com o seguinte perfil:• consegue ler/entender “palavras”

ou “frases curtas” escritas• tem “alguma” familiaridade com

caixas eletrônicos ou quiosques usados para serviços da Previdência Social

2. Elaborar um design alternativo para o eleitor votar “nulo”

3. Representar seu design4. Avaliar esta representação com

um ou mais métodos conhecidos.

serg

1313

(c) SERG, 2010

Modelos do Ciclo de Vida de um Sistema Interativo (Cont.)

• Modelos de ciclo de vida elaborados para engenharia de software– O modelo CASCATA

Análise de requisitos,design, codificação,teste e manutenção

– RAD (rapid application development)Set up, oficinas com usuários (JAD),

iteração design/construção, engenhariafinal e teste, implementação/revisão

serg

1414

(c) SERG, 2010

O modelo ESPIRAL (Boehm)

From cctr.umkc.edu/~kennethjuwng/spiral.htm

serg

1515

(c) SERG, 2010

Modelos do Ciclo de Vida de um Sistema Interativo (Cont.)

• Modelos de ciclo de vida para IHC– O modelo ESTRELA (Hartson & Hix)

Evaluation

Conceptual/formal design

RequirementsspecificationPrototyping

task/functionalanalysisImplementation

serg

1616

(c) SERG, 2010

Resumindo

• No Design de Interação é importante:– Conhecer o Usuário– Focar no Usuário– Elaborar alternativas de design (se possível, interativas)– Selecionar um modelo “iterativo”

• Existem modelos para apoiar o design de interação:– Simples– Cascata– RAD– Espiral– Estrela

Pesquisando para Modelar Usuários do

WNH

Ferramenta para usuário comunicar modificações de

sistemas

serg

1717

(c) SERG, 2010

EUD - End User Development

• Existe uma tendência de envolver e capacitar usuários no processo de desenvolvimento de software (EUD).

• O que temos feito para ajudar os usuários a participarem do ciclo de design junto com os desenvolvedores?

Modelo para Comunicar ideias de Modificações de Sistemas

serg

1818

(c) SERG, 2010

Não vejonecessidade!

Por que o sistemanão envia email

automaticamente?

DD

E se algo dererrado?

Preciso enviar email para quem

criou o processo e não para quematuou na estapa

anterior!

É melhor um link.

Problemática: como trocar ideias sobre modificações de sistemas?

Inserir um botão de envio de email aosresponsáveispela tarefa anterior

Inserir onde?!

serg

1919

(c) SERG, 2010

Não vejonecessidade!

Por que o sistemanão envia email

automaticamente?

DD

E se algo dererrado?

Preciso enviar email para quem

criou o processo e não para quematuou na estapa

anterior!

É melhor um link.

Problemática: como trocar ideias sobre modificações de sistemas?

Inserir um botão de envio de email aosresponsáveispela tarefa anterior

Inserir onde?!

A ideia não ficou clara.

Não serve paraele.

Questionou o tipo de objeto.

Quer mudar as regras Solução

otimizadaApontou

requisito de Engenharia de

Software

serg

2020

(c) SERG, 2010

Por que o sistema não envia email

automaticamente?

DD

E se algo der errado?

Será que isso ébom no meu caso?

Não vejo necessidade!

?

Representação Icônica

Próxima da UIL

serg

2121

(c) SERG, 2010

Cabeçalho

De: [email protected]: [email protected]: [email protected]: Inserir botão de email para os alunos

MensagemEstou no papel de: designerFalando para: designerTipo de fala: sugiroDescrição geral: Temos recebido emails de alunos querendo comunicar-se com as

pessoas que estão avaliando seus processos. Sugiro inserir um botão de email para o aluno, de maneira que ele possa enviar sua dúvida diretamente para o coordenador que está com o processo dele.

Descrição detalhada: Segue em anexo o HTML com a proposta de modificação.

Modelo

serg

2222

(c) SERG, 2010

Ferramenta

Tipo de Alteração da ferramenta.

Clicar com o botão esquerdo.

Objetos ficam marcados de vermelho quando recebem anotação

serg

2323

(c) SERG, 2010

Ferramenta

serg

2424

(c) SERG, 2010

Ferramenta

serg

2525

(c) SERG, 2010

Referência Bibliográfica

• Capítulo 6 de Preece, Rogers e Sharp (2005) – Design de Interação.

• “Usuário podem Escrever Extensões de Sistemas?”IHC2008 (Sampaio, A. L, de Souza, C.S., 2008)