1. Design e Usabilidade
Fundamentos

2. ?
 Como seria o utilização deste equipamento :


3. Interfaces
 Para a comunicação com equipamentos eletrônicos os
designers desenvolveram interfaces.
 Conhecidos também como mediadores entre o usuário e
aparelhos eletrônicos.

4. Tipos de interface:
 Táteis:
Interação por meio de toques
 Sonora:
 Interfaces que são ouvidas.

5. Tipos:
 Interface Gráfica :

6. Tipos.
 E em caso de emissão de cheiros teríamos uma interface
olfativa.
 Todas essas formas mediadoras chamamos de interface humana
computador.
 Interface é o mediador entre o usuário e a maquina;
 Em aspectos educativos, essa mediação deve facilitar a
comunicação entre o educador e o educando.

7. Requisitos Básicos:
 Quem irá utilizar a interface ?
 Crianças;
 Idosos;
 Deficientes.
 Interfaces que o usuário está habituado a usar;

8. Público infantil:
 Crianças;
Segundo pesquisa realizada pelo Centro de Estudos sobre as Tecnologias
da Informação e da Comunicação (CETIC), 51% das crianças com idade
entre 5 e 9 anos já usaram um computador e 27% declararam ter acessado
a internet (2011).
Dados do IPOBE aponta que 5,2 milhões de crianças entre 2 e 11 navegam
na internet em sua casa.
 Características;
 Aplicações sem muitos textos;
 Fontes com caixas altas;
 Uso de sons;
 Para melhorem a usabilidade por parte da criança.

9. Público idoso:
 Idosos:
Perda progressiva das habilidades
(percepção, condição de rápida resposta)
Fácil aprendizado.
Realçar conteúdo.
Ajuda
Somam mais de 23,5 milhões de brasileiros, na comparação
entre 2009 a terceira idade aumentou 7,6%, ou seja, mais de
1,8 milhões de pessoas.

11. Público deficiente:
Mais de 45,6 milhões de brasileiros
declararam ter alguma deficiência, segundo
dados do Censo Demográfico 2010, divulgado
nesta sexta-feira (27)pelo Instituto Brasileiro de
Geografia e Estatística (IBGE). O número
representa 23,9% da população do país.
Obs.: Deficiência visual se destaca com 35,7
milhões de pessoas.

12. Comunicação interativa entre
computador usuário.
 Sempre que interagimos com a interface dos nosso
computador, sempre esperamos um resultado previamente
estabelecido.
 Que podem ser ele a resposta de uma escolha de um jogo, o
envio de um documento a impressora ou a execução de um
aplicativo.
 A interação entre computador e usuário envolve alguns
processos específicos.

13. Processo de Interação

14. Design
 Definição: design é todo o processo lógico e criativo
desenvolvido para elaboração, execução e instalação
de um produto.
 O design lida com os conhecimentos do:
 Usuário;
 Meios utilizados para a realização de uma tarefa ;
 Contexto sociocultural do meio;

16. Ergonomia
 Definição:
 Wisner - A Ergonomia é o conjunto de
conhecimentos científicos relativos ao homem e
necessários a concepção de instrumentos,
máquinas e dispositivos que possam ser utilizados
com o máximo de conforto e eficácia (1972).
 Self - A Ergonomiareúne os conhecimentos da
fisiologia e psicologia, e das ciências vizinhas
aplicadas ao trabalho humano, na perspectiva de
uma melhor adaptação ao homem dos métodos,
meios e ambientes de trabalho.

17. Ergonomia
 Historia
 A ergonomia nasceu na era paleolítica, quando o
homem criou o seu 1º utensílio de sobrevivência. A
partir da idade média e com a chegada de novas
tecnologias, foram criados laboratórios, e a partir daí,
esta ciência passou a englobar conhecimentos de
outras áreas – como medicina, psicologia, engenharia,
arquitetura, design –, todas focadas no objetivo
comum, o conforto.

19. Ergonomia Cognitiva
 A ergonomia cognitiva é a mais relacionada ao
design de interfaces porque trata basicamente dos
processos mentais.
 Sempre considere que o usuário que está tentando
aprender numa interface, também está tendo que
aprender a usar a interface. O sucesso ou insucesso da
primeira interação com a interface pode determinar se
o usuário vai voltar a utilizá-la. (Ex: curso online)

20. Ergonomia
 “O ser humano ao desenvolver um trabalho desenvolve
corpo e mente, o trabalho mental não pode se opor ao
trabalho físico, eles se complementam e isso diz respeito
a todos os aspectos do trabalho humano.”

21. Os Sentidos
 De acordo com HOCHBERG, não se tem apenas os
cinco sentidos, mas também tem os seguintes:
 Distancia: ver e ouvir
 Pele: tato, calor, frio, dor
 Profundidade: posição, movimento de músculos

22. Sentido Visual
 Dentro do olho temos a retina, onde acontece a ligação
entre o mundo externo e o sistema nervoso.
 Temos algumas camadas de células, que são:
 Cones: não muito sensíveis a luz, porem é capaz de discriminar
diferentes comprimentos de onda, com isso permite a visão em
cores.
 Bastonetes: responsável pela visão noturna, é extremamente
sensível a luz, porem incapaz de distinguir cor, temos em media
120milhoes de bastonetes

23. Sistema Oculomotor
 É um conjunto de músculo responsável por varrer todo o
campo visual. Os movimentos são controlados por três
músculos, que são:
 Músculos retos, interno e externo: Responsável por fazer o
movimento de um lado para o outro dos olhos
 Músculos retos, superior e inferior: Faz com que o olho possa se
movimentar para cima e para baixo
 Músculos oblíquos superior e inferior: Permite adaptar o globo
ocular através de seu movimento giratório, mantendo o campo
visual adequado.

24. Sentido visual e as cores
 As cores são determinadas por freqüências, que vão de
380 a 760 nanômetros. Com isso a não há uma cor padrão
para todos, e sim uma freqüência que varia entre cada ser
humano.

25. COGNIÇÃO VISUAL
•Percepção sensorial: é o pensamento da
imagem, requisitos para uma percepção
suficiente quanto a organização e
reconhecimento dentro da experiência
perceptiva ;

26. Gestalt
Gestalt é uma teoria criada para os mecanismos de
organização perceptiva de um objeto ou imagem.

28. Leis da Gestalt

31. COGNIÇÃO VISUAL E
NÍVEIS COGNITIVOS
A cogniçao visual esta no espaço que vai desde a
percepçao sensorial ate a obtençao de um significado
que permita uma reposta eficiente a um estimulo
visual
Alto nível cognitivo: Faz uma analise da imagem
com detalhes, a interpetraçao do conteudo é
expressada por um grande numero de palavras;
Baixo nível cognitivo: Faz uma interpretaçao
imediata da imagem, explica em poucas palavras.

32. Fases da percepção visual
 Primeira fase:
Capacidade: Recepção da Informação
Processo: Sensação Visual
 Segunda fase:
Capacidade: Armazenamento da Informação
Processo: Memória Visual
 Terceira fase:
Capacidade: Processamento da Informação
Processo: Pensamento Virtual

33. Representações mentais
 Analógicas: Sao as imagens mentais, as
representações das sensações, entre outras
formas de representação de figura concreta do
objeto.
 Proposicionais: Formulada por uma linguagem
própria da mente dando significado ao objeto
atraves de palavras, mistura informação espacial
com a informação das definições do objeto.

34. Memória Visual
A memoria visual é uma das formas de armazenar informações para o
processo de aquisição do conhecimento
Pode ser abordada de várias formas:
 Implícita: Quando a realização da tarefa utiliza experiências do
inconsciente;
 Explícita: Quando utiliza recordações conscientes;
 Ativas: Pode se dar por um estimulo externo como uma sensação ou
interno como uma recordação ou um pensamento;
 Inativas: Feita através de uma conexão vizinha que não estava ativa.

35. Funcionamento geral da memória:
 Memória sensorial: Guarda quantidades pequenas de
informações por período muito breve;
 Memória de curto prazo: Guarda uma quantidade também
limitada de informações por período um pouco mais longo;
 Memória de longo prazo: Com grande capacidade de
guardar informações por período muito longo, talvez
definitivamente;

36. ERGONOMIA E USABILIDADE
Em um aspecto mais técnico, a ergonomia esta
incluída no conceito de usabilidade.

37. Definições de termos a partir da
NBR (9241-11:2002, p.2) de referência:
 Usabilidade: medida na qual um produto pode ser usado por usuários
específicos para alcançar objetivos específicos com eficiência, eficácia e
satisfação em um contexto específico de uso.
 Eficácia: acurácia e completude com as quais usuários alcançam objetivos
específicos.
 Eficiência: recursos gastos em relação à acurácia e abrangência com as quais
usuários atingem objetivos.
 Satisfação: ausência de desconforto e presença de atitudes positivas para
com o uso de um produto.

38.  Contexto de uso: usuários, tarefas e equipamentos (hardware, software
e
materiais), e ambiente físico e social no qual o produto é usado.
 Sistema de trabalho: sistema composto de usuários, equipamentos,
tarefas
e o ambiente físico e social com o propósito de alcançar objetivos
específicos.
 Usuário: pessoa que interage com o produto.
 Objetivo: resultado pretendido.
 Tarefa: conjunto de ações necessárias para alcançar um objetivo.
 Produto: parte do equipamento (hardware, software e materiais) para o
qual
a usabilidade é especificada ou avaliada.
 Medida: valor resultante da medição e o processo usado para obter tal
valor.

40. Para especificar ou medir a usabilidade
podemos usar estas perguntas:
 Quais os objetivos pretendidos com o produto?
 Qual a descrição dos componentes do contexto de uso?
 Quais os valores reais ou desejados de medidas de
eficácia, eficiência e satisfação no uso do produto?
 INRIA (Institut National de Recherche en Informatique et
en Automatique)

41. Se o programa e interface são componentes
do mesmo produto. Então é pela interface
que devemos começar um projeto
ergonômico?
 Sim, pois será através dela que será atendida a
necessidade do usuário.

42. A CONDUÇÃO
 A interface tem que ter uma series de mensagens uteis para que o
usuário se sinta seguro.
 Alertas
 Rótulos
 Pequenos textos.
 Isso possibilita que:
O usuário se localize no software
O usuário conheça as ações e suas consequências.
 Obter informações complementares para orientar sua
interação.

43. Outros aspectos.
CARGA DE TRABALHO
 Evitar que o usuário tenha de fazer o que o software pode fazer.
CONTROLE EXPLÍCITO
 O usuário deve ter controle total sobre o software
ADAPTABILIDADE
 Fazermos o mesmo trabalho de diferente formas.
GESTÃO DE ERROS
 O sistema deve informar quando o usuário for clicar em algo errado.
HOMOGENEIDADE/COERÊNCIA
 Identidade visual.

44. SIGNIFICADO DOS CÓDIGOS
 Seja claro nos ícones do software.
COMPATIBILIDADE
 O software deve ser compatível com a realidade.

45. Obrigado!!!
FIO – Faculdades Integradas de Ourinhos,
7°termo BSI, 2013
Leonardo Romano
Bruno Barbieri
Pedro R. Domingues Santos
Matheus Gomes Inácio
Jonas Alexandre Benevenuto
Murilo Piccin Caramujo