design e usabilidade em ihc - dimap.ufrn.brjair/erbase2010/erbase2010-introducao.pdf · • apoio a...

EPOCA 2009 Jair C LeiteERBASE 2010 - Design e usabilidade em IHC

Design e usabilidade em IHC

Jair C LeiteDepartamento de Informática e Matemática Aplicada

Universidade Federal do Rio Grande do [email protected]


Roteiro

• Introdução ao design de IHC– Interatividade: história e evolução– A disciplina de IHC

• Teoria de IHC– Engenharia Semiótica

• Processo de design de IHC– A atividade de design– Modelos e protótipo– Análise de usuários e cenários

• Design da comunicação de IHC– Arquitetura da interface e layout– Design da interação (diálogo)– Visualização da informação

• Avaliação de IHC– O que, quando, como, onde e com quem avaliar– Métodos e técnicas de avaliação


Interatividade com computadores:

história e evolução


Evolução das interfaces de usuário

• 50s – Interfaces são painel de controles do hardware – usuário são engenheiros

• 60-70s – Interfaces são programas em linguagenscomo COBOL, FORTRAN

• 70-80s – Primeiros aplicativos e linguagens de comandos

• 80s – Interfaces gráficas com aplicativos• 90s – Interfaces multimídia e interfaces Web• 00s - Interface tornam-se ubíquas – estão em todo

lugar e em dispositivos móveis.


Interfaces como painel de controle


Cartões perfurados

• As instruçõesfornecidas em cartõesperfurados (Holleritt)

• Cada programa (JOB) era entregue no CPD para ser processado.

• Resultados do programa em relatóriosimpressos.


Popularização dos computadores

• Com os micro-processadores, os usuáriospoderiam ter computadoresem casa para programar e se divertir

• Computadores ligados emtelevisores

• Linguagem BASIC empermitia construção de programas simples e faziatarefas do S.O.

• Interpretador em ROM• Programa armazenados em

fitas K7

Apple I

TK2000


Interagindo em BASIC

• A forma primária de interação éprogramando emBASIC.

• Pode-se construirprogramas com entradae saída através de teclado e tela, respectivamente– “INPUT var”– “PRINT var”

Fontes:


As interfaces gráficas

• Placas gráficas de alta resoluçãoe monocromáticas– Bit-mapped display

• Conceitos e Princípios– Metáfora de “desktop”

• Objetos representados porícones, armazenados em pastas e visualizados em janelas

– Manipulação direta• Objetos tem propriedades e

podem sofre ações

– Estilo WIMP • Windows, Icons, Menus, Pointer

– WYSIWYG - “What You See Is What You Get”

– Comandos gerais• Move, copy, delete

Apple Macintosh, 1984

Xerox Star, 1981


Primeiras interfaces gráficas

Macintosh, 1984

Xerox Star, 1981


Diversidade: Desktops, Laptops,

Palmtops…


Toque na tela

• Interação com toque na tela– Selecionar– Arrastar– Teclado virtual

• Estilos– Hierarquia de menus– Manipulação direta

• Botão hardware único para voltar à tela inicial (home)


Hands-On Computing


Roomware


Realidade aumentada

• Combinação de imagens captadas por câmeras e sintetizadas por computação


Ipad: foco na interatividade

“iPad creates and defines an entirely new category of devices that will connect users with their apps and content in a much more intimate, intuitive and fun way than ever before.” (Steve Jobs, Jan 2010)

“iPad creates and defines an entirely new category of devices that will connect users with their apps and content in a much more intimate, intuitive and fun way than ever before.” (Steve Jobs, Jan 2010)

“The precise Multi-Touch interface makes surfing the web on iPad an entirely new experience, dramatically more interactive and intimate than on a computer”

“The precise Multi-Touch interface makes surfing the web on iPad an entirely new experience, dramatically more interactive and intimate than on a computer”


Desafios

• As pessoas dependem cada vez mais de serviços computacionais– Sistemas bancários

• Uso incorreto pode levar a prejuízos financeiros

– Sistemas corporativos• Uso intensivo e obrigatório

– Sistemas governamentais• O que deveria ser um direito não pode ser uma

dificuldade

Profissionais de computação não tem formaçãoadequada para lidar com os fatores humanos dos sistemas computacionais


Interagindo com um sistema bancário

• O sistema bancário oferece vários serviços para os clientes

• Ao utilizar com um caixa, estamos interagindo com um sistema computacional

• Questões– As pessoas sabem como

utilizar?– As pessoas conseguem

fazer o que querem?– As pessoas estão

satisfeitas?

• O design de IHC é a atividade de melhorar a qualidade na utilizaçãodos sistemascomputacionais.


IHC e a diversidade de usuários

• O design de IHC deveconsiderar que um sistema deve estaradequado aos seususuários

• Sistemas podem ser utilizados por umagrande diversidades de usuários.


Interagindo com um sistema

corporativo• SIGAA: Sistemas de controle acadêmico da UFRN• Apoio a diversas atividades acadêmicas

– Matricula on-line– Registro de falta e notas– Programa do curso– Foruns e enquetes– Distribuição de material do curso

• Professores, alunos e funcionários são obrigados a usar no dia-a-dia

• Desenvolvido pela equipe da UFRN– Ex-alunos, estagiários


Preciso consultar informações

sobre a disciplina de Sistemas Distribuídos...


Vou procurar nos menus...Turmas?

Consulta Turmas?Consulta Cursos?

…


Eu precisofornecer todos

estes dados parafazer a busca?Eu não sei o

código, o tipo …Por que o check-

box?


Nossa! E agora?O que devo fazer?


A disciplina de IHC


Interação Humano-Computador

• “Disciplina ou campo de estudo interessada no design, implementação e avaliação de sistemas computacionais interativos para uso humano.”

• e “estudo dos fenômenos associados ao uso humano de sistemas computacionais interativos.”

• (ACM SIGCHI, 1992)


Interface de Usuário

• Conjunto de artefatos de software e hardware para a interação usuário-sistema.

• Parte do sistema com a qual o usuário entra em contato físico, perceptivo e cognitivo [Moran 83]

• Mensagem do designer para o usuário [de Souza 93]


Níveis em Sistemas Computacionais

Nível do computador

Nível do usuário Nível social e organizacional

Interação Humano-Computador

Usuário

Sistema Computacional

Contexto social e organizacional


Focus de interesse em IHC

Instrumentaçãoteórica e prática parao processo deDesign e Desenvolvimentoda aplicação

Instrumentaçãoteórica e prática parao processo deDesign e Desenvolvimentoda aplicação

Modelos do processo de Interaçãosistema-usuário

Modelos do processo de Interaçãosistema-usuário

Estudo das capacidades e limitações

físicas e cognitivas dos usuários

Estudo das capacidades e limitações

físicas e cognitivas dos usuários

Design e desenvolvimentodo hardware e software que implementam a funcionalidade

e o modelo de interação.

Design e desenvolvimentodo hardware e software que implementam a funcionalidade

e o modelo de interação.

Usuário

Sistema Computacional

Análise do domínio e de aspectos sociaise organizacionais queinfluenciam e motivama utilização do sistema

Análise do domínio e de aspectos sociaise organizacionais queinfluenciam e motivama utilização do sistema

Designer


Conhecimento e Habilidades dos

Especialistas em IHCTeorias,Métodos,

Técnicas eFerramentas

deDesign de IHC

Disciplinas associadas à IHC

InteligênciaArtificial

Lingüística

Sociologia

Antropologia

Design

Engenharia

Ergonomia e Fatores

Humanos

PsicologiaSocial e

OrganizacionalPsicologiaCognitiva

Ciência da computação

Semiótica

Filosofia


Ergonomia e Fatores Humanos

• Disciplina interessada no design de produtos e processos de trabalho em conformidade com as necessidades e o bem estar dos seres humanos.

• Ergonomia – termo utilizado na Europa e Brasil

• Fatores Humanos – termo utilizado nos EUA

• Ergonomia cognitiva tem objetivos semelhantes àIHC


Design de IHC

• Design = desenho, projeto ou concepção • Atividade de conceber (ou desenhar),

prototipar, construir e avaliar:– A interface de usuário do sistema– A interação usuário-sistema– A experiência do usuário

• Apoiada pelas disciplinas que contribuem para IHC.

• Realizada por uma equipe de especialistas em diversas disciplinas de IHC


Contexto social e organizacional

Pesquisa em IHC

IHC

Conhecimento sobre IHC: Princípios, diretrizes, padrões, normas, modelos e teorias.

Conhecimento sobre IHC: Princípios, diretrizes, padrões, normas, modelos e teorias.

Pesquisador

Designer


Usabilidade – Normas ISO 9126

• Norma ISO 9126– Inteligibilidade:

• É fácil entender os conceitos utilizados?

– Apreensibilidade: • É fácil aprender a usar?

– Operacionabilidade: • É fácil operar e controlar a operação?


Normas ISO 9241-11

• Definição de usabilidade:– Qualidade de um produto de poder ser utilizado por usuários específicos

para atingir determinadas metas com eficiência, eficácia e satisfação num contexto de uso específico.

• Eficácia– Precisão e completeza com que os usuários atingem os seus

objetivos • Obter uma informação correta, entrar dados corretamente

• Eficiência– Recursos fornecidos para se atingir uma meta com precisão e

completeza• Encontrar rapidamente uma informação correta sem ter que fornecer

muita informação

• Satisfação• Conforto e aceitabilidade do produto

• Contexto de Uso• Usuários, tarefas, equipamentos e ambiente físico e social


Problemas com usabilidade

• Alto custo com treinamento• Baixa produtividade

• Alto índice de erros cometidos• Dificuldades de entendimento

• Desmotivação para explorar• Insatisfação• Custo do sistema não gera os benefícios

esperados


Resumo

• IHC é a disciplina voltada para:– O entendimento dos fenômenos de interação– A melhoria da usabilidade– A melhoria da prática de design e

desenvolvimento

• IHC utiliza conhecimento de diversasdisciplinas

• IHC visa oferecer:– Teorias e métodos de investigação (ciência)– Métodos e técnicas de design, desenvolvimento e

avaliação (prática)

design e usabilidade em ihc - dimap.ufrn.brjair/erbase2010/erbase2010-introducao.pdf · • apoio a...

Documents