Livro Engenhariua de Usabilidade

autor

FABIANO GONÇALVES DOS SANTOS

1ª edição SESES

rio de janeiro 2016

ENGENHARIA

Conselho editorial regiane burger; roberto paes; gladis linhares; karen bortoloti; helcimara affonso de souza

Autor do original fabiano gonçalves Projeto editorial roberto paes

Coordenação de produção gladis linhares

Coordenação de produção EaD karen fernanda bortoloti Projeto gráfico paulo vitor bastos

Diagramação bfs media

Revisão linguística amanda carla duarte aguiar Imagem de capa kran77 | dreamstime.com

todos os direitos reservados. Nenhuma parte desta obra pode ser reproduzida ou transmitida por quaisquer meios (eletrônico ou mecânico, incluindo fotocópia e gravação) ou arquivada em qualquer sistema ou banco de dados sem permissão escrita da Editora. Copyright seses, 2016.

Dados Internacionais de Catalogação na Publicação (cip) G635e Gonçalves, Fabiano

Engenharia de usabilidade / Fabiano Gonçalves Rio de Janeiro : SESES, 2016.

136 p. : il.

isbn: 978-85-5548-234-2

1. Interface homem-máquina. 2. Interface humano-computador. 3. Usabilidade. I. SESES. II. Estácio.

Sumário

Prefácio 7

1. Conceituação

9

1.1 Ergonomia 11

1.1.1 Ergonomia física e cognitiva 12

1.2 Usabilidade e Engenharia de Usabilidade 16

1.3 Interação Humano-Computador 21

1.3.1 A primeira geração (ENIAC) 23

1.3.2 Segunda geração (IBM 7030) 24

1.3.3 Terceira Geração (IBM 360) 25

1.3.4 Quarta Geração 26

1.4 Interfaces e o projeto de interação 28

1.4.1 Futuro da IHC 31

2. Conhecimento

35

2.1 Princípios Ergonômicos para IHC 37

2.2 Critérios Ergonômicos 37 2.2.1 Condução 38 2.2.2 A carga de trabalho 39 2.2.3 O controle explícito 40 2.2.4 Adaptabilidade 40 2.2.5 A gestão de erros 41 2.2.6 A homogeneidade/Consistência (coerência) 41

2.2.7 O significado dos códigos e denominações 42

2.2.8 A compatibilidade 42

2.3 Recomendações Ergonômicas para IHC 43

2.3.1 Objetos de interação 44

2.3.1.1 Painéis de controle 46

2.3.1.2 Controles complexos 49

3. Desenvolvimento 55

3.1 Introdução ao projeto de IHC 57

3.2 Um modelo de ciclo de vida simples para o projeto de IHC 60

3.3 Sobre os usuários 61 3.4 Técnicas de concepção 63 3.4.1 Brainstorming 63 3.4.2 CardSorting 64 3.4.3 Diagrama de afinidade 66 3.4.4 Storyboard 67

3.4.5 Maquetes – protótipos em papel 68

3.4.6 Prototipagem rápida 69

3.4.7 Prototipagem de baixa e alta fidelidade 70

3.5 Técnicas de modelagem de interface 71

3.5.1 The Bridge 72

3.5.2 Usercentered design 72

3.6 Considerações finais 76

4. Avaliação 79

4.1 Introdução 81

4.2 Por que avaliar? 81

4.3 O que avaliar? 82

4.4 Onde avaliar? 83

4.5 Quando avaliar? 84

4.6 Técnicas de Avaliação de Usabilidade 85

4.6.1 Técnicas prospectivas 85

4.6.2 Técnicas preditivas 86

4.6.2.1 Avaliação Heurística 86

4.6.2.2 Inspeção por meio de lista de verificação 91

4.6.3 Técnicas objetivas 95

5. Acessibilidade à Web

103

5.1 Introdução à acessibilidade 105

5.2 Acessibilidade na web e sua importância 108

5.3 A Web acessível 110

5.4 Componentes essenciais para acessibilidade na Web 111

5.4.1 Interdependência entre componentes 114

5.4.2 O ciclo de implementação 115

5.5 Projeto e desenvolvimento de um site acessível 117

5.5.1 Recomendações do W3C 118

5.5.1.1 Princípio 1 - Percepção 119

5.5.1.2 Princípio 2: Operável 119

5.5.1.3 Princípio 3: Entendível 120

5.5.1.4 Princípio 4: Robusto 120

7

Prefácio

Prezados(as) alunos(as),

Desenvolver sistemas é uma tarefa muito interessante e, se bem aproveita-da, pode te dar um retorno financeiro bem interessante. Porém não basta con-seguir analisar um problema e saber solucioná-lo usando uma linguagem de programação. Isto é importante, porém o desenvolvimento envolve muito mais detalhes do que se imagina.

É muito comum ver programadores super experientes e conhecedores de frameworks como o Bootstrap, por exemplo. Mas será que, além do framework passa na cabeça deles que existem detalhes importantes a respeito de algo além de um programa bonito?

Um dos detalhes é a questão da usabilidade. É importante que ao criar a parte que interage com o usuário, alguns detalhes sejam observados, como a questão da acessibilidade.

Esta disciplina tem como objetivo introduzir você em um tópico no qual muitos desenvolvedores não pensam ou ao qual não dão importância, que é a questão da usabilidade. Como foi citado, não basta saber um bom framework; é necessário saber aplicá-lo corretamente. Esta disciplina envolve conhecimen-tos de diversas áreas, como: psicologia, sociologia, antropologia, sistemas de informação, ciência da computação, design gráfico e ergonomia. Porém, não vamos entrar a fundo em cada uma dessas áreas. O que é importante você saber é que desenvolver interfaces não é apenas uma questão de saber programação e um determinado framework de apresentação. Vai um pouco mais além.

Nosso objetivo é despertar sua atenção para este conhecimento e colocá-lo em contato com algumas questões básicas destas áreas mencionadas. É inte-ressante e, se você se dedicar, saiba em que é uma área que há grande demanda de bons profissionais.

Conceituação

Neste capítulo vamos tratar de um assunto que é encontrado em várias áreas, comArquitetura, Engenharia de Produção, Engenharia de Segurança e Tecno-logia da Informação: a ergonomia.

A ergonomia trata basicamente da adequação das pessoas aos locais de tra-balho e outros tipos de sistemas (não necessariamente computacionais).

Além disso, vamos estudar uma introdução à usabilidade e à engenharia de usabilidade. A usabilidade é uma área da computação relacionada com outra grande área chamada Interação (ou Interface) Homem-Máquina (IHM). A IHM sempre foi um motivo de grande discussão, porque a tecnologia, evoluindo ao longo dos anos, proporcionou uma grande evolução nas interfaces que ligam os humanos ao computador e às máquinas em geral. A IHM, por sua vez, é uma área estudada pela Engenharia de Software, que é uma disciplina que também será vista no curso.

A usabilidade tem ganhado muito destaque no desenvolvimento de siste-mas, principalmente no desenvolvimento web. Atualmente, vários frameworks têm aparecido e ajudado os desenvolvedores a criarem sites mais interativos e intuitivos, e isso tem um grande relacionamento com usabilidade.

OBJETIVOS

Ao final deste capítulo, você estará apto a:

•  Entender e reconhecer questões relacionadas à ergonomia em geral; •  Saber os conceitos básicos de usabilidade e engenharia de usabilidade; •  Conhecer os principais conceitos da área de interface homem-máquina.

capítulo 1

 • 11

1.1 Ergonomia

A ergonomia pode ser definida como “adaptação ou melhoria na adequação dos produtos aos indivíduos”. Ela existe desde a Pré-História quando o homem primitivo sentiu a necessidade de criar objetos e utensílios que o ajudassem a realizar as mais diversas tarefas, como armazenar água, cozinhar alimentos, fazer roupas para se proteger do frio e caçar (figura 1.1).

©

HBCS0084 | DREAMSTIME.COM

Figura 1.1 – Primórdios da Ergonomia.

Com a evolução do homem também veio a evolução da ergonomia, que se preocupava com a necessidade de melhorar equipamentos de forma a tornar o uso mais simples e intuitivo. A ergonomia tomou uma conotação realmente relevante na Segunda Guerra Mundial, quando aviões, tanques de guerra e ar-mas precisavam ser produzidos rapidamente. Entretanto, esses equipamentos foram produzidos sem a preocupação de adequação às características percepti-vas e físicas dos usuários, o que levou a diversas mortes de soldados.

É evidente que a perda de vidas implica em sérios problemas; dessa forma, houve um esforço conjunto de especialistas de diversas áreas para adaptar os equipamentos, a fim de desenvolver projetos que adaptassem sua interface de uso (alavanca, botões, pedais e painéis) e campo de visão a soldados que

deveriam utilizá-los em situações extremas, quando sua maior preocupação deveria ser o combate, e não a forma de uso das armas e equipamentos.

Após a Segunda Guerra Mundial a ergonomia ganhou grande avanço por meio da NASA e seu impressionante avanço tecnológico, atingindo os mais di-versos setores das indústrias pela América do Norte e Europa.

Atualmente, a ergonomia é uma área extremamente multidisciplinar que envolve desde engenheiros e físicos até médicos, fisioterapeutas e psicólogos na tentativa de solucionar a necessidade do ser humano em aplicar menos es-forço mental e físico em suas tarefas cotidianas. Assim, algumas premissas de-vem ser “pretendidas" na criação de um sistema ergonômico:

•  O usuário deve desempenhar somente as funções absolutamente essen-ciais, e que não possam ser desempenhadas pelo sistema, transferindo para o sistema uma função mesmo que ela possa ser desempenhada pelo usuário.

•  O usuário deve ter de memorizar o mínimo possível.

•  O usuário só deve ter de aprender o essencial para sua tarefa.

•  O usuário não deve ter de aprender a terminologia, passos não relaciona-dos à sua tarefa – instruções ou comunicações do sistema devem ser feitas ao longo da tarefa.

•  Os comandos do usuário devem ter execução natural e simples, não de-vem ser complexos e compostos.

•  O usuário deve ter frustração mínima.

1.1.1 Ergonomia física e cognitiva

Imagine que você está em uma sala de cinema e, após 10 minutos de o filme ter começado, ocorre um problema, as luzes não se acendem e começa a soar o alarme de incêndio. As pessoas ao seu redor se desesperam e você começa a sentir o cheiro de fumaça. Você se mantém calmo e vê que ao lado esquerdo da tela, um pequeno painel com uma luz vermelha acesa, e logo abaixo vê uma porta e a associa à saída de emergência. Você sai em direção à porta e, em um único movimento empurra uma longa barra horizontal pouco acima da altura da sua cintura, saindo da sala que já está bastante esfumaçada, sentindo um grande alívio ao respirar ar fresco.

capítulo 1

 • 13

O ponto-chave para que você pudes-se pudes-se livrar desta situação foi a facilida-de facilida-de achar e abrir a porta da saída facilida-de emergência. Essas saídas foram proje-tadas para que, em uma situação de pe-rigo iminente, as pessoas possam ser encaminhadas para a saída sem pen-sar, de forma simples e instintiva, sim-plesmente ao ver um painel com uma luz vermelha. Da mesma forma, em relação ao sistema de abertura da por-ta, em uma situação de risco, a pessoa não terá tempo ou estará tão apavora-da que não conseguirá encontrar uma maçaneta ou identificar uma forma de abrir a porta. Sendo assim, a porta se abre quando a pessoa empurra a barra, o que é uma ação intuitiva, uma vez que sua principal preocupação é fugir. Aqui podemos notar elementos claros de ergonomia física e cognitiva: o fato de a saída de emergência estar posicionada imediatamente ao lado da tela, faz com que você não precise procurar muito por ela, uma vez que, durante a seção, a sua atenção estará voltada para a tela; além disso, o fato de a barra horizontal estar posicionada um pouco acima de sua cintura faz com que você não preci-se fazer movimentos antinaturais, portanto abrir a portapreci-será o menor dos preci-seus problemas.

Temos então dois exemplos de ergonomia física que está relacionada a adaptação de um sistema a anatomia humana, antropometria, fisiologia e bio-mecânica. Ou seja, as ações a serem realizadas se aproximam ao máximo de movimentos naturais aos seres humanos. Podemos notar também elementos de ergonomia cognitiva, uma vez que a saída de emergência é indicada por uma luz vermelha, enquanto todas as luzes estão apagadas, sendo assim bastante visível, e também outro elemento é o fato de a porta se abrir quando a barra é empurrada, o que é um movimento bastante natural, que não requer grande carga de raciocínio. Nesse tipo de ergonomia, é levada em consideração a carga

©

EDIT

OR77 | DREAMSTIME.COM

Figura 1.2 – Saída de emergência com a barra horizontal.

mental de uma determinada ação, na tentativa de diminuir raciocínio, estresse e tomada de decisão.

Este é um exemplo no qual é possível mostrar que a ergonomia não está relacionada apenas a equipamentos ou máquinas, uma vez que entendemos a sala de cinema como um sistema, e as pessoas como usuários.

Existem outros exemplos mais diretos também , em que podemos notar ele-mentos claros de ergonomia física e cognitiva. Por exemplo, a comparação entre dois controles remotos: um tem um formato quadrado (com uma pegada ruim), os botões são pequenos, seguindo o mesmo padrão, e os botões mais usados estão longe um do outro, exigindo que você olhe para o controle para executar qualquer ação; o outro é anatômico (seu formato encaixa na sua mão) os botões são grandes e em formatos diferentes de forma que você não precise se preocu-par em olhar preocu-para o controle preocu-para executar qualquer ação, você identifica qual botão apertar apenas com o tato, são poucos botões, e o que diferencia a uma ação realizada da outra, é a forma como esses botões são manipulados, apertan-do, deslizando o dedo sobre o botão para um lado ou para o outro.

©

FRANCE

SCO ALE

capítulo 1

 • 15

©

PANY

A CHITMEDHA | DREAMSTIME.COM

Figura 1.4 – Controle remoto "bom".

Podemos identificar também esses elementos na evolução do interior dos carros. Antigamente os botões e as alavancas eram espalhados pelo painel do carro e, muitas vezes, para executar uma ação, você precisava desviar a atenção do trânsito para olhar para o painel e identificar o botão ou alavanca desejado. Hoje em dia, nos carros mais modernos, grande parte dos controles do carro es-tão no próprio volante, inclusive controle multimídia, ar-condicionado e trocas de marchas, fazendo com que o condutor foque sua atenção no trânsito, não precisando retirar as mãos do volante para quase nada.

E, finalmente, no mundo da informática, podemos comparar os touchpads de diversos laptops com o touchpad desenvolvido pela Apple, que torna a expe-riência de uso do computador muito mais simples e intuitiva, uma vez que são adicionados elementos de percepção naturais multitouch como: para dar zoom em uma imagem, basta abrir dois dedos; para movimentar a barra de rolagem basta deslizar dois dedos para cima ou para baixo...

Sendo assim, vistos esses exemplos, o desafio a ser vencido é criar softwares ergonômicos, ou seja, que exijam o menor esforço físico e cognitivo do usuário, evitando, frustrações, grande uso de raciocínio e memória do usuário.

1.2 Usabilidade e Engenharia de Usabilidade

Vamos supor outra situação: você está no escritório postergando o que precisa fazer: o manual formatado do software recém-produzido que havia prometido ao seu chefe há tempos, mas está tranquilo, pois o texto já está todo escrito e as figuras já estão todas prontas, a única coisa que falta é a formatação do arquivo. Já são duas horas da tarde, e, quando abre a caixa de e-mails, surpresa: uma cobrança do chefe dizendo que precisa desse manual pronto até o fim do dia.

Você percebe que, se abrir mão do cafezinho das quatro horas, consegue terminar a formatação do arquivo. Porém, quando abre o editor de texto, nota que ele foi atualizado para a versão mais recente, com novas funcionalidades e um layout completamente diferente, as ferramentas que você estava acostu-mado a usar não estão mais onde sempre estiveram. Você procura, passa por todos os menus, mas a interface está muito diferente, as horas vão passando e após buscar por informações na internet, consegue encontrar algumas ferra-mentas e avançar um pouco na formatação, mas já são 16:30 e pensa: “Como uma empresa tão grande, não faz um interface mais fácil, mais intuitiva? Será que ninguém pensou na usabilidade deste software”?

É evidente que, se os construtores do editor de texto realmente tivessem se preocupado com a usabilidade do software sua tarde teria sido muito mais tranquila, e você teria a certeza de que conseguiria entregar o manual pronto ao seu chefe, mas infelizmente o software, não era nem um pouco usual.

Mas, então, o que seria a usabilidade?

O termo usabilidade surgiu como uma parte, um ramo da ergonomia volta-da para às interfaces computacionais, mas acabou se difundindo para outras áreas. Hoje o termo também é utilizado em contexto de produtos, como apa-relhos eletrônicos, em áreas da comunicação e produtos de transferência de conhecimento, como manuais, documentos e ajudas online.

Podemos definir usabilidade como a facilidade com que as pessoas têm ao manusear algum determinado objeto, de modo eficiente, intuitivo, sem provo-car erros operacionais e oferecendo ainda satisfação aos usuários. Ou seja, po-demos associar usabilidade à facilidade de uso. Se um produto é fácil de usar, o usuário tem maior produtividade: aprende mais rápido, memoriza o passo a

capítulo 1

 • 17

Pode ser o subsolo? Mas e se houvesse mais andares abaixo do solo? Seria “-2”, “-3”, etc? Isto não é um pouco estranho?

©

TA

TABRAD

A | DREAMSTIME.COM

Figura 1.5 –

Uma boa usabilidade costuma andar de mãos dadas com um bom design! Smartphones em geral tentam fazer com que a experiência de uso seja sim-ples e fácil, uma vez que é necessária apenas a realização de movimentos na-turais e intuitivos para a troca de páginas e seleção de operações e aplicativos.

©

DK88888

| DREAMSTIME.COM

Outro exemplo de usabilidade em produtos são controles remotos. O Weemote é um controle remoto focado em atender às necessidades de crianças e idosos com botões grandes e coloridos só com funções básicas. Nesse ponto podemos fazer uma associação entre usabilidade e interação. Assim, fica claro que a usabilidade não depende só das características do produto, mas também das características do usuário, da tarefa e do ambiente ao qual todos esses fa-tores estão incluídos, ou seja, a interface deve ser desenvolvida levando-se em consideração a causa e a forma de contato entre usuário e produto.

Segundo (JORDAN, 1998), a usabilidade pode ser avaliada de acordo com alguns princípios:

•  Evidência: Devem ser evidentes o modo de operação e a função do produ-to, como, por exemplo, maçanetas de portas de carros (figura 1.7):

©

MAK

SYM GORPENYUK | DREAMSTIME.COM

Figura 1.7 – Maçaneta de carro.

•  Consistência: Operações semelhantes devem ser resolvidas de formas semelhantes. Um exemplo é a atualização do editor de texto que mantém as ferramentas mais utilizadas em seus lugares, sem maiores alterações que con-fundam o usuário.

•  Capacidade: As capacidades do usuário para cada função não devem ser ultrapassadas. Por exemplo, colocar os principais controles do carro no volan-te, faz com que ele seja capaz de fazer mais operações sem desviar sua atenção do trânsito.

capítulo 1

 • 19

•  Prevenção de erros: Os produtos devem evitar ao máximo procedimen-tos errados.

•  Realimentação: O sistema deve dar um retorno ao usuário sobre o suces-so de sua tarefa, para que ações repetitivas sejam evitadas.

Figura 1.8 – Retorno de uma ação do programa. Fonte: autor.

Mas, então, qual a diferença entre usabilidade e ergonomia, já que, em am-bos os casos, vários dos mesmos exemplos podem ser utilizados?

Atualmente, a palavra ergonomia se refere à característica de um sistema ou tarefa que se adapte ao usuário, e não o contrário. É uma área multidisciplinar que compreende diversos ramos da ciência, como: anatomia, antropometria, biomecânica fisiologia, psicologia etc. Baseia-se em conhecimentos adquiri-dos, nas habilidades e capacidades humanas para adaptar as mais diversas, atividades, ferramentas, máquinas e produtos, com o objetivo a torná-los mais seguros, eficientes e confortáveis para uso humano.

Já a usabilidade, como mencionado anteriormente, é uma ramificação da ergonomia, preocupa-se em produzir uma interface que deve ser usada para se executar uma dada tarefa da forma mais simples possível, de modo a per-mitir que os usuários foquem apenas no trabalho que eles desejam executar

(NORMAN, 1986). Segundo (ISO/IEC 9126), “usabilidade é a capacidade de uma aplicação ser compreendida, aprendida e utilizada, sendo atraente para o usuário, em condições específicas de utilização”. Isso significa que aquele editor de textos do início deste tópico deveria, entre outras coisas, ter as seguin-tes características:

APRENDIZAGEM

Quão fácil e quanto de treinamento os usuários precisam para realizarem tarefas básicas no primeiro contato que têm com a interface do sistema?

EFICIÊNCIA

MEMORIZAÇÃO

ROBUSTEZ

SATISFAÇÃO

É importante salientar que, nas áreas de Interação Humano-computador e na Ciência da Computação, muitas empresas têm consciência da importância da usabilidade. Porém, muitas delas ainda veem a usabilidade como um fator que consome tempo e recurso, como se ela representasse um custo adicional, fora do que é essencia,l que só encareceria seu produto. Entretanto, as empre-sas têm muito mais a perder ao minimizar a usabilidade dessa forma. De acor-do com CYBYS, BETIOL e FAUST (2007):

capítulo 1

 • 21

da rotatividade do pessoal, mas também pela baixa produtividade, competitivi-dade e menor retorno de investimento. Sistemas difíceis de usar implicam em erros e perda de tempo, fatores que se multiplicam com a frequência das tare-fas e o número de usuários. A perda de dados e informações pode implicar na perda de clientes e de oportunidades. Acontecimentos deste tipo causam des-de uma resistência ao uso do sistema até a sua subutilização e abandono com-pleto, com o devido consentimento da empresa. O barato terá custado caro.

1.3 Interação Humano-Computador

Vamos usar outra situação cotidiana para exemplificar: imagine um senhor que vai ao banco sacar o dinheiro de sua aposentadoria e sempre faz o mesmo “ritual” todo mês, indo até o caixa. Mas desta vez há uma diferença: ao chegar ao banco, vê uma fila enorme de pessoas à espera de as portas se abrirem, mas ainda faltavam 15 minutos para as 10 horas. Em vez de enfrentar a fila, o senhor pensou na possiblidade de mudar e tentar se atualizar e provar a si mesmo que conseguiria fazer o saque de sua aposentadoria no caixa eletrônico, afinal, não poderia ser tão complicado assim. Ele via pessoas tocando a tela e recolhendo seu dinheiro a todo momento. Ele ia tentar.

Assim que a porta se abriu, o senhor correu para o caixa eletrônico, olhou para o lado e viu uma moça a toda pressa tocando no visor. Ele então toca no visor também, quando uma mensagem aparece: “Insira seu cartão”. Ele pro-cura e vê um lugar onde colocar o cartão, quando outra mensagem aparece: “falha na identificação do cartão”. Ele imagina que colocou o cartão na posi-ção errada, reposiciona e coloca novamente o cartão no local indicado, quando outra mensagem aparece: “digite sua senha”. Ele digita e, quando pensa estar dominado o assunto vem, a mensagem: “posicione seu dedo no leitor biométri-co”. Ele o faz prontamente, mas uma mensagem aparece: leitura não efetuada. Repita a operação, ele olha para trás e a fila está aumentando, quando ele come-ça a ficar preocupado, repete a operação e uma série de quadrados aparecem na tela, com várias possibilidades, dentre elas o saque. Ele escolhe um quadrado e vários outros quadrados aparecem: conta corrente, poupança, conta salário, etc. Creio que você consegue imaginar o resto desta situação.

Situações como essas ocorrem o tempo todo. Muitas pessoas não sabem como agir quando se deparam com uma máquina ou um sistema computacio-nal. Por que essa interação é tão difícil?

Existe uma área na Computação que estuda a interação de forma a dei-xá-la mas simples, objetiva e satisfatória, chamada de Interação Homem Computador (IHC).

Essa necessidade surge no cotidiano com as mais diversas tarefas que en-volvem máquinas que se utilizam de algum tipo de sistema computacional. Esses sistemas na maioria das vezes são criados e desenvolvidos para facilitar nossas vidas, mas em vários casos acabam atrapalhando, por não serem bem planejados, projetados e pensados, daí a necessidade de toda uma ciência mul-tidisciplinar, envolvendo ciência da computação, psicologia cognitiva, psicolo-gia organizacional e social, ergonomia e fatores humanos, engenharia, design, antropologia, sociologia, filosofia, linguística e inteligência artificial, por trás desse assunto, que estuda como interagimos com os computadores nas mais diversas situações, para tornar cada vez mais simples e natural a interação ho-mem computador. Então uma definição para IHC seria: a interação Humano-Computador (IHC) é uma disciplina que diz respeito ao design, avaliação e implementação de sistemas de computação interativos para uso humano em um contexto social e com os estudos dos principais fenômenos que os cercam (Curricula for Human-Computer Interaction, 2009).

Porém, a interação entre humanos e computadores necessita de um meio de comunicação que é chamado de interface, por meio da qual o usuário entra em contato com a máquina de forma física, perceptiva e cognitiva (NORMAN, 1986)

A interface é o lugar onde ocorre contato entre duas partes. Toda forma de interação onde uma ação do usuário (entrada) leva a uma resposta do sistema (saída) é intermediada por uma interface. Podemos ter como exemplos, com-putadores, maçaneta, televisões, rádios, micro-ondas, aparelhos de telefone e etc.

A interface permite que um agente (humano) faça uma ação por meio de uma interface (maçaneta) e tenha uma resposta do paciente (porta).

A interface do computador provoca estímulos ao usuário de forma que ele manipule a interface por meio de dispositivos e tenha as respostas

relaciona-capítulo 1

 • 23

Mas será que desde o surgimento dos computadores a interação homem computador é a mesma?

É evidente que não. Desde seu surgimento computadores e interfaces evo-luíram juntos até chegar ao que conhecemos e convivemos hoje, de uma inter-face simples e rudimentar passando por apenas linhas de código, até chegar-mos nas interfaces gráficas e intuitivas de hoje em dia.

Todos sabem que os computadores atuais são fruto de uma intensa evolução tanto em termos de hardware quanto de software, mas o que poucos sabem é que, na década de 1950 já existiam computadores. É certo que eles não se pare-ciam nem um pouco com os computadores que conhecemos hoje, mas já eram capazes de fazer alguns cálculos de forma bem rápida para determinadas tarefas.

1.3.1 A primeira geração (ENIAC)

©

WIKIPEDIA

Figura 1.9 – O ENIAC (https://en..org/wiki/ENIAC).

A interação com os primeiros computadores, os chamados ENIAC e UNIVAC, era muito complexa, já que naquela época não existia linguagem de programação,

os computadores eram programados para resolver um problema em específi-co, se quisesse resolver outro problema todo computador deveria ser reprogra-mado. Eles eram enormes e tinham literalmente o tamanho de salas inteiras, pesando aproximadamente 30 toneladas, além de sofrerem com superaqueci-mento pois, em vez de utilizarem microprocessadores, eles utilizavam válvulas. Elas funcionavam de maneira parecida com uma placa de circuitos, sendo que cada válvula acesa ou apagada representava uma instrução à máquina. Cada um deles necessitava de cerca de 19 mil válvulas por ano, porque as válvulas queimavam com poucas horas de uso e precisavam ser substituídas.

1.3.2 Segunda geração (IBM 7030)

©

WIKIPEDIA

Figura 1.10 – O IBM7030.

A segunda geração de computadores apresentou uma série de novidades e avanços em relação à primeira geração. O IBM 7030 foi o modelo de maior su-cesso dessa geração, sua programação foi bastante simplificada, uma vez que utilizava a linguagens como Fortran e Cobol em vez de linguagens de máquina

capítulo 1

 • 25

diante das 30 toneladas do ENIAC. Essa considerável diminuição no tamanho só foi possível porque o IBM 7030 utilizava transistores em vez de válvulas, os transistores eram bem menores em relação às válvulas e os computadores fica-ram mais econômicos com relação ao gasto de energia e também em relação ao custo das peças.

© W IK IP E D IA

Figura 1.11 – Réplica do primeiro resistor.

1.3.3 Terceira Geração (IBM 360)

©

WIKIPEDIA

Figura 1.12 – O IBM 360.

No final da década de 1970, o emprego dos semicondutores fez com que os com-putadores da terceira geração tivessem um aumento significativo na velocidade

e na eficiência. Nessa geração foram introduzidos teclados para digitação de comandos e monitores para visualização de sistemas operacionais primitivos e a possibilidade de fazer upgrades. Entretanto, os computadores dessa geração ficaram maiores do que os da geração anterior. O IBM 360 (modelo de maior expressão dessa geração), claramente pesava mais do que seus antecessores. Nessa época, os computadores já começaram a ficar mais acessíveis.

1.3.4 Quarta Geração

Na década de 1970 foram lançados os primeiros computadores da forma como conhecemos hoje, os microcomputadores. Esses computadores ficaram bem menores (pesando cerca de 20 kg), e a redução foi possível graças ao uso de componentes chamados microprocessadores. Com isso, os computadores fi-caram muito mais acessíveis, tanto que era possível adquirir um computador como o Altair 8800 com um kit de montar vendidos por revistas especializadas nos Estados Unidos.

©

capítulo 1

 • 27

Nessa mesma época, Steve Jobs e Steve Wozniak criaram o Apple I, que ti-nha como objetivo ser um computador de fácil acesso para leigos e logo foi substituído pelo Apple II. O grande diferencial introduzido nesses computa-dores é que Jobs e Wozniak se basearam no BASIC para criar um sistema com interface gráfica, incluindo editores de texto, planilhas eletrônicas e bancos de dados. Isto contribuiu com a popularização dos computadores, saindo do meio científico e atingindo a população em geral. Posteriormente, a Apple também foi responsável pela adoção dos mouses, que tornou a experiência de interação humano computador mais amigável ainda. Pouco tempo depois, a Microsoft também lançou o seu sistema operacional gráfico, o Windows.

CONEXÃO

BASIC – Beginner’s All-purpose Instruction Code, ou código de instruções de uso geral para iniciantes, é uma linguagem de programação criada por John George Kemeny e Thomas Eugene em 1964 para aprendizado dos sistemas computacionais. Veja mais em

http://www.vintage-basic.net/.

©

WIKIPEDIA

©

WIKIPEDIA

Figura 1.15 – A primeira versão do MacOS.

Com isso nós temos um breve histórico da evolução dos computadores e da forma de interação homem computador até chegarmos aos tempos de hoje. É possível perceber que sempre hove preocupação para tornar a expereiencia de interação mais agradável, principalmente quando hove a evolução da criação de sistemas operacionais com interface gráfica.

1.4 Interfaces e o projeto de interação

A comunicação entre usuário e computador deve permitir o diálogo e ela pode ocorrer de duas formas distintas: interface física ou interface virtual.

INTERFACE FÍSICA

É feita por meio de hardware e por meio físico, empregando materiais como cabos, fios, placas, ou dispositivos como mouses, teclado joystic, scanners, caixas de som etc.

capítulo 1

 • 29

INTERFACE VIRTUAL OU

LÓGICA

É feita por softwares meio cognitivo que faz uso de aspectos léxicos (funcionais), sintáticos (es-truturais) e semânticos (conteúdo). Um aspecto importante das interfaces virtuais ou lógicas é o uso de metáforas e modelos mentais, que podem ser vistas nos principais sistemas operacionais uti-lizados atualmente. Elas são analogias a elemen-tos naturais de forma a representar as abstrações contidas nos sistemas computacionais. A partir do momento em que começaram a ser utilizados sis-temas operacionais com interfaces gráficas, foram feitos usos de metáforas, por um exemplo o desk-top ou área de trabalho é uma analogia a uma mesa onde são organizadas todas as tarefas, outra analogia são as pastas, que representam onde são guardados os documentos, também podemos no-tar a lixeira, onde são descartados os documentos e arquivos que não serão mais utilizados. Todos esses são esforços para deixar a experiência de uso o mais natural possível ao usuário.

A combinação de interfaces física e gráfica ou lógica em celulares exige um projeto de interação que leve em conta uma relação compreensível entre o apli-cativo do aparelho e seus botões e teclado. Em avaliações feitas por alunos da dis-ciplina de TASI utilizando princípios de projeto, metas de usabilidade, heurísti-cas, entre outros conceitos, foi possível verificar que o parelho Nokia é um dos mais simples de operar, enquanto o Motorola está entre os mais complicados.

Mas, na verdade, quando falamos de interação de humanos e computado-res, falamos de congruência de interfaces, que nada mais é do que a combina-ção de interfaces físicas e interfaces virtuais. Nesse sentido, é preciso entender que a combinação entre ambos os elementos precisa ser efetiva, clara e consis-tente, para que, por meio de dispositivos físicos, a interface gráfica reaja apre-sentando repostas aos estímulos de acordo com as expectativas dos usuários. Agora me diga, quem não fica louco de raiva quando o mouse para de funcio-nar? Entretanto, alguns novos dispositivos já vêm eliminando alguns elemen-tos de interação física, como é o caso de dispositivos touchscreen.

ATENÇÃO

Tanto interfaces físicas como virtuais devem levar em consideração as capacidades físicas e culturais dos seres humanos, e aqui um ponto de extrema importância e a acessibilidade desses sistemas, aos mais diferentes tipos de usuários que irão utilizar o sistema.

Sendo assim, independentemente de qualquer tipo de sistema que seja pro-jetado, é preciso considerar os seguintes aspectos:

•  Atender o tipo de atividade esperada pelo usuário;

•  Estudar a interface mais apropriada para entrada e saída de dados, que seja apropriada às características do usuário.

•  Oferecer funcionalidades complementares como forma de flexibilizar o processo de interação.

Para o desenvolvimento de uma boa interface o que costuma ser chamado de uma interface amigável, deve-se levar em consideração:

capítulo 1

 • 31

Mas o que seria uma interface ideal? Amigável?

É o conceito de que a interface de um sistema deve produzir uma experiên-cia prazerosa, de fácil manuseio e aprendizado. Deve-se tentar agregar ao má-ximo características com as quais o usuário já esteja acostumado.

Outro ponto a ser evitado são interfaces carregadas com muita informação. Ao contrário do que se possa imaginar, ao disponibilizar muita informação, a interface pode ficar tão confusa que o usuário não consiga encontrar o que ele está procurando.

O sistema deve ter componentes que incentivem o aprendizado autôno-mo, ou seja, interfaces amigáveis devem ser invisíveis, de forma que o usuá-rio somente se preocupe com a tarefa a ser realizada Ela não pode tomar mais atenção do usuário do que a própria tarefa e deve ser fácil de usar, aprender e memorizar.

1.4.1 Futuro da IHC

É claro que nós ainda não alcançamos os níveis propostos pela ficção científi-ca, mas podemos dizer que estamos caminhando, mesmo que lentamente para um novo paradigma na construção de softwares que trabalham segundo uma nova e diferente perspectiva de interface, uma evolução substancial já foi expe-rimentada com a popularização de dispositivos touchscreen, como celulares e tablets, tecnologia que também já atingiu os computadores. Essa mudança de paradigma mudou drasticamente os tipos de interação, alterando também os níveis de abstração e os tipos de metáforas utilizadas nos softwares e aplicati-vos desenvolvidos.

Os movimentos realizados em dispositivos touchscreen (movimentos de pinça) são mais naturais do que os realizados em desktops com o uso de mou-ses. Também podemos citar o kinect desenvolvido pela Microsoft que, com cer-teza, entrega uma experiência completamente nova, se levarmos em considera-ção o que foi produzido até hoje.

Uma tecnologia que não se popularizou ainda, e é uma quebra de paradig-ma, é o recém-desenvolvido Google Glass, que permite uma experiência com-pletamente diferente do que estamos acostumados.

©

FALL

OSTUPIDO | DREAMSTIME.COM

Figura 1.17 – O Google Glass.

Ou seja, essa área ou ciência de interação humano computador ou humano máquina é bastante dinâmica e com certeza muitos paradigmas ainda serão quebrados, mas os profissionais devem estar preparados para as novas tendên-cias do mercado e, mais do que isso, devem estare preparados para inovar e ditar as novas tendências do mercado. É uma área que exige criatividade, e re-compensa muito bem por essa criatividade. Você pode conquistar o mundo, é só ter uma boa ideia. Alguém se habilita?

ATIVIDADES

01. Faça uma pesquisa na internet e procure o termo “tecnologia vestível”. O que é isso? 02. O que é engenharia de usabilidade?

capítulo 1

 • 33

05. Faça uma pesquisa e explique como o JQuery e outras bibliotecas colaboram para as interfaces atualmente.

06. Faça outra pesquisa na internet e descreva resumidamente o que melhorou nas interfa-ces do Microsoft Windows, desde sua primeira versão até a versão 10.

REFLEXÃO

A área de interface e de usabilidade realmente precisa ser levada a sério, e que bom que as empresas e a academia estão se preocupando com isso. Porém, é uma área multidisciplinar o pessoal da área de TI tem de entender que, sem profissionais com formação em design e comunicação, um novo sistema operacional, um site, ou qualquer outra forma de interação entre o computador e o homem, não serão adequadamente desenvolvidos. E vice-versa: o pessoal de design precisa da turma da TI para poder colocar em prática as ideias e conceitos que eles estão desenvolvendo. Pensando assim, grandes sites e sistemas operacionais foram desenvolvidos e fazem sucesso até hoje.

LEITURA

Sugerimos os seguintes sites como recomendação e forma de aprimorar o que foi visto neste capítulo:

O JQuery é uma biblioteca que proporcionou grandes avanços na área de interatividade na internet. Acesse o site do JQuery para ver o que é possível ser feito: https://jquery.com/

Apesar de ser um pouco antigo, o artigo a seguir mostra um estudo de caso envol-vendo usabilidade: http://www.scielo.br/scielo.php?pid=S1415-65552003000200007&s-cript=sci_arttext

Ainda vamos falar muito do W3C, o World Wide Web Consortium. O W3C contém os padrões que são usados na web para o desenvolvimento de sites e aplicações. Este site deve ser visitado e estudado por todos aqueles que desenvolvem para a internet: http:// www.w3.org/standards/

REFERÊNCIAS BIBLIOGRÁFICAS

ASSOCIAÇÃO BRASILEIRA DE NORMAS TÉCNICAS. NBRISO/IEC9126-1 Engenharia de software - Qualidade de produto - Parte 1: Modelo de qualidade. 2003.

CURRICULA for Human-Computer Interaction. ACM SIGCHI, 2009. Disponivel em: <http://old. sigchi.org/cdg/index.html>. Acesso em: 1 jul. 2015.

CYBIS, W.; BETIOL, A. H.; FAUST, R. Ergonomia e usabilidade. São Paulo: Novatec, 2007. JORDAN, P. W. An introduction to usability. Philadelphia: Taylor & Francis, 1998.

Conhecimento

Toda vez que alguém precisa usar um programa novo, é aquela mesma história: Como faço isso? Como altero aquilo? Por que fazer um programa tão difícil? Será que ninguém pensa que o usuário não tem tempo para aprender a usar os programas? Ele tem que simplesmente executar uma tarefa sem precisar per-der horas lendo manual.

A maioria dos softwares específicos – aqueles que não atingem o grande pú-blico e que não são fabricados pelas gigantes do mercado – não é construída tendo uma grande preocupação com usabilidade. Para tal, é demandada uma intensa participação dos usuários, no processo de definição da interface, na realização de diversos testes e avaliações. Estes passos, além de aumentarem o prazo de construção do software, aumentam também o seu custo. Mas será que não existe um conjunto de regras e critérios para a construção de um programa ergonômico?

OBJETIVOS

Este capítulo tratará dos princípios ergonômicos para IHC e fará com que você possa res-ponder à seguinte pergunta:

capítulo 2

 • 37

2.1 Princípios Ergonômicos para IHC

Assim como o conceito de ergonomia visto na unidade 1, em que se mostrou que os produtos são planejados para atender às necessidades físicas, psicomo-toras e cognitivas do ser humano, pode-se observar também a necessidade de construção de softwares ergonômicos que facilitem a vida das pessoas.

A ergonomia em IHC tem como objetivo não só facilitar a vida do usuário, mas também adaptar os softwares e a forma de interação às capacidades dos usuários, dando conforto e satisfação. Hoje em dia é quase impossível uma empresa se es-tabelecer no mercado sem se preocupar com esses temas. Assim, a importância dessas características sobre como as mais diversas ferramentas serão usadas é clara. Portanto, foram desenvolvidas diversas técnicas utilizando-se as teorias existentes para desenvolver parâmetros para gerar softwares ergonômicos.

2.2 Critérios Ergonômicos

Os critérios ergonômicos são parâmetros a serem seguidos que podem tornar a experiência de uso mais agradável e eficiente. Em 1993, Dominique Scapin e Christian Bastien propuseram um conjunto de critérios que tem como objetivo minimizar problemas na interação do usuários com o software baseados em dados de aplicação musical.

Dois grupos de especialistas avaliaram a interface de uma base de dados de aplicação musical. Após a exploração da interface, as ações e os comentá-rios dos avaliadores foram registrados junto ao estado corrente da aplicação. Posteriormente, uma segunda avaliação foi realizada. Em um grupo a avalia-ção foi realizada em uma interface utilizando critérios ergonômicos, e o outro grupo fez a avaliação sem critérios ergonômicos. Os resultados preliminares mostram que na primeira fase, ambos os grupos apresentaram problemas de usabilidade realizando avaliações semelhantes. Já na segunda fase a utilização de critérios ergonômicos fez com que os avaliadores encontrassem um numero maior de problemas do que o grupo que avaliou a interface sem levar os cri-térios ergonômicos em consideração. Sendo assim, ficou clara a utilidade dos critérios ergonômicos na identificação de falhas no projeto. A utilização desses critérios leva ao aumento da integridade do sistema e à diminuição do número de especialistas necessários para identificar possíveis falhas. São no total oito critérios que serão descritos a seguir:

2.2.1 Condução

A condução tem como objetivo auxiliar usuários novatos a utilizar o sistema. A interface deve conduzir o usuário na realização das mais diversas tarefas, no sentido de aconselhar e informar o usuário na interação com o sistema. Quan-do o usuário é bem conduziQuan-do, pode ser observada uma diminuição significati-va no número de erros cometidos, uma vez que o aprendizado é facilitado.

Presteza: Permite que o usuário identifique em qual estado de interação ele se encontra, ferramentas de ajuda e o seu modo de acesso. Uma boa presteza facilita a navegação no software, diminuindo o erro, como por exemplo:

•  Dirigir a entrada de dados indicando o formato adequado e os valo-res aceitáveis.

•  Exibir as unidades de medidas dos dados a digitar. •  Indicar todas as informações sobre estado. •  Para cada campo de dados, fornecer um rótulo. •  Indicar o tamanho do campo quando ele é limitado.

•  Quando necessário, fornecer no rótulo informações suplementares. •  Dar um título a cada janela.

•  Fornecer ajuda on-line e orientação.

Agrupamentos e distinção entre os itens:

Este item diz respeito à distribuição espacial dos itens na tela. Com isso é possí-vel que o usuário faça uma rápida compreensão da tela, para identificar os itens de seu interesse. O critério de distribuição e distinção dos itens se divide em dois:

AGRUPAMENTO E

DISTINÇÃO POR

LOCALIZAÇÃO

Permite ao usuário identificar semelhanças ou di-ferenças nos itens segundo o padrão de organiza-ção espacial deles na tela, por exemplo: itens com conteúdos parecidos estão mais próximos. • Organizar os itens em listas hierárquicas. • Organizar as opções de um diálogo por menus,  em função dos objetos aos quais elas se aplicam.

capítulo 2

 • 39

AGRUPAMENTO E

DISTINÇÃO POR

FORMATO

Permite ao usuário identificar semelhanças ou diferenças entre diferentes classes de itens de acordo com características gráficas.

Clareza: Refere-se as características que podem auxiliar ou atrapalhar na leitura das informações  textuais. Recomenda-se levar em considera-ção características cognitivas e perceptivas dos usuários.

Feedback imediato: refere-se às respostas do computador referentes às ações dos usuários. O  computador deve responder a todas as ações dos  usuários o mais rapidamente possível. Para os usuários, ausência ou demora no feedback podem ser consideradas como falhas no sistema.

2.2.2 A carga de trabalho

Este critério se preocupa em fazer com que o usuário diminua a carga cognitiva e perceptiva, sendo subdividido em brevidade e densidade informacional.

BREVIDADE

CONCISÃO

AÇÕES MÍNIMAS

Este critério leva em consideração o respeito que se deve ter com as capacidades cognitivas, perceptivas e motoras dos usuários.

Diminui a carga de traba-lho, cognitiva e perceptiva com relação às entradas e saídas do software. Apresenta títulos, rótulos, denominações curtas.  Fornece o preenchimen-to aupreenchimen-tomático de vírgulas, pontos decimais e zeros à direita da vírgula nos campos de dados.

Tenta facilitar ao máximo a carga de trabalho do usuário, simplificando e minimizando as ações  necessárias para que uma tarefa seja rea-lizada. Presença de atalhos, com imagens representativas.

2.2.3 O controle explícito

Este critério se refere tanto ao controle que o usuário tem sobre a interface do sistema quanto ao processamento e respostas dados pelo sistema ao usuário.

AÇÕES

EXPLÍCITAS

Se refere ao processamento e resposta dados pelo siste-ma a usiste-ma ação executada pelo usuário por intermédio da interface. Deve ficar explicito que o sistema só irá executar estritamente o que foi solicitado pelo usuário.

CONTROLE DO

USUÁRIO

O usuário deve estar no controle, e o sistema deve retornar estritamente o que lhe foi solicitado, entretanto é interessante que o sistema se antecipe e o ofereça op-ções que lhe auxiliem a executar determinadas ações, mas  sempre deixando o usuário no controle da situação.

2.2.4 Adaptabilidade

Não é possível uma interface atender às necessidades de todos os seus usuários. Sendo assim, ela deve ser capaz de se adaptar segundo as preferências dos usuários.

FLEXIBILIDADE

Permite que uma tarefa possa ser realizada de diversas formas, dando ao usuário a possibilidade de escolher a estratégia com a qual mais se familiarize.

EXPERIÊNCIA DO

USUÁRIO

O sistema deve prever que existem usuários de diferentes níveis (iniciantes e especialistas) e que esses usuários têm necessidades diferentes. Muitos diálogos são ente-diantes e maçantes para usuários experientes, ao passo que a falta deles torna a experiência de uso inviável para

capítulo 2

 • 41

2.2.5 A gestão de erros

Este critério se refere a todos os mecanismos disponíveis no sistema capa-zes de reduzir a ocorrência de erros, e, caso eles ocorram, que a sua correção seja facilitada.

PROTEÇÃO

CONTRA OS

ERROS

Refere-se aos mecanismos disponíveis para detectar e prevenir os erros de entrada de dados.

QUALIDADE DAS

MENSAGENS

Refere-se à qualidade, clareza e legibilidade da mensagem de erro apresentada ao usuário, qual foi o erro e o que deveria ter sido feito para que esse erro não ocorresse ou o que deve ser feito para corrigir o erro?

CORREÇÃO DE

ERROS

Quais são os recursos disponíveis para que o usuário possa corrigir eventuais erros?

2.2.6 A homogeneidade/Consistência (coerência)

Neste critério, o objeto das interfaces são idênticos para contextos idênticos, e diferentes para contextos diferentes.

•  Localização similar dos títulos das janelas. •  Formatos de telas semelhantes.

•  Procedimentos similares de acesso às opções dos menus.

•  Na condução, sempre utilizar as mesmas pontuações e as mesmas cons-truções de frases.

•  Apresentar na mesma posição os convites (prompts) para as entradas de dados ou de comandos.

2.2.7 O significado dos códigos e denominações

A significância dos códigos se refere à adequação expressão/objeto dos códigos empregados na interface com o usuário.

Adequar o vocabulário de rótulos, títulos, cabeçalhos, mensagens, opções de menu, bem como, definir figuras significativas para os ícones e abreviatu-ras significativas.

2.2.8 A compatibilidade

A organização das saídas e entradas de uma dada aplicaçãodeve estar de acordo com as características dos usuários (memória, percepção, hábitos, com-petências, idade, expectativas, etc.) e da tarefa. Um método de avaliação com base em critérios constitui uma abordagem analítica. Como tal, os critérios são não se destinam a substituir outros métodos de avaliação (por exemplo, "basea-da em modelo" métodos, questionário, entrevista, etc).

ATENÇÃO

A abordagem de utilização de critérios é um meio de garantir a conformidade com as diretri-zes de design de software. Assim, pode ser usada antes do teste do usuário para descobrir e corrigir eventuais falhas no projeto inicial. Entretanto, os critérios devem ser vistos como um suplemento a outros métodos de avaliação, e são usadas somente abordagens analíticas sem em nenhum momento contar com métodos de avaliação baseados em questionários, entrevistas e etc.

PROJEÇÕES FUTURAS

– Estender o conteúdo de cada critério, aumentando os níveis de detalhamento, incluindo um conjunto completo de "regras" específicas para cada um dos critérios. – Definir um conjunto de prioridades para a avaliação para cada critério. Por exemplo:

capítulo 2

 • 43

PROJEÇÕES FUTURAS

– Definir os pré-requisitos para a avaliação, ou seja, definir quais são todas as caracte-rísticas necessárias aos usuários para aplicação de cada critério.

– Definir formas de avaliar sistematicamente os elementos e estados da interface (telas, janelas, sequências de tarefas, etc.).

– Utilização de ferramentas de apoio para um completo sistema de avaliação (help).

2.3 Recomendações Ergonômicas para IHC 

As recomendações ergonômicas representam a fonte de conhecimentos mais utilizada pelos ergonomistas em suas intervenções.

A maior parte dos padrões para IHC têm orientações e recomenda-ções ergonômicas que vêm sendo desenvolvidas pelos órgãos de norma-lização, International Organização de Normalização (ISO) e Internetional Electrotechnical Comission (IEC), ao longo dos últimos 20 anos.

Esses padrões são desenvolvidos por grupos de peritos ao longo de vários anos. Nas fases iniciais, os documentos podem mudar significativamente de uma versão para outra, até que um consenso seja atingido. A partir do momen-to em que o padrão se momen-torna mais ”maduro”, uma votação formal ocorre através da participação de membros de órgãos de normalização.

Uma das funções das normas é impor consistência. Houve uma tentativa de fazer isso por meio das normas ISO / IEC para componentes de interface, tais como: ícones, scripts, controle de cursor, etc. No entanto, para essas áreas os padrões definidos pela indústria foram mais influente do que as normas ISO. Sendo assim, elas não foram amplamente adotadas. As normas podem ser:

•  Oficiais, concebidas por organismos de padronização. •  Guias de estilo, concebidos por grandes companhias.

As normas tiveram maior impacto a partir da norma ISO 9241 e ficaram mais centradas em atividades necessárias para produzir produtos utilizáveis a partir da norma ergonômica ISO 13407. Estes princípios foram refinados e ampliados em um modelo de boas práticas de usabilidade que pode ser utilizados para

avaliar a capacidade de uma organização em desenvolver um design centrado no usuário com a norma ISO TR 18529. A norma ISO PAS 18152 estende esses conceitos para a avaliação da maturidade de uma organização na execução dos processos que fazem um sistema utilizável, saudável e seguro.

As normas relativas à usabilidade abordam principalmente temas como: 1. Eficácia, eficiência e satisfação na utilização do produto.

2. Interação do usuário com a interface.

3. O processo utilizado no desenvolvimento do produto. 4. Design centrado no usuário.

ATENÇÃO

Um ponto fraco da maioria dos padrões estabelecidos para IHC é que eles são discutidos  e desenvolvidos com base em teorias, e não em processos práticos, ou seja, as normas não são desenvolvidas om base na resposta dos utilizadores ao interagirem com os sistemas testando protótipos durante o desenvolvimento.

Outra limitação das normas internacionais é que o processo de desenvolvimento é lento, e o conteúdo depende do esforço voluntário de especialistas apropriados.

2.3.1 Objetos de interação

Há algum tempo, na história dos computadores, a interação com os usuários era extremamente difícil. Somente especialistas eram capazes de interagir com o computador, enviando-lhe comandos e recebendo respostas. Não vamos aqui traçar uma nova linha do tempo descrevendo novamente a história dos com-putadores, mas acho que todos já tiveram a oportunidade de ver o que era a famosa linha de comando.

capítulo 2

 • 45

Antigamente toda a interação era assim, escreviam-se comandos específi-cos, que por vezes mais pareciam códigos, e esperavam-se as repostas na tela em formato texto.

Contudo, desde o Apple 2, esse conceito foi modificado com o intermédio da interface gráfica, onde são geradas imagens para interagir com os usuários, que podem ser manipulados (aumentados, diminuídos, movimentadas), sen-do organizasen-dos por uma estrutura de janelas, menus, barra de ferramentas etc., utilizando metáforas do mundo real e linguagem natural para tornar a in-teração dos usuários com o computador mais fluida e intuitiva.

Com a evolução da informática foram estabelecidos alguns elementos e ob-jetos de interação entre usuário e computador que serão explorados a seguir.

2.3.1.1 Painéis de controle

Janelas

As janelas devem ter um layout padronizado para toda aplicação, geralmen-te geralmen-tem um título, em sua pargeralmen-te superior, centralizado ou à esquerda, geralmen-tendo os principais comandos à vista do usuário. Quando for possível abrir várias janelas simultaneamente, a janela ativa deverá estar destacada.

Figura 2.3 – Figura 3: Uma janela simples.

Caixas de diálogo

As caixas de diálogo apoiam operações específicas, não contendo menus ou barras de tarefas. E, assim como nas janelas, os títulos devem ser centralizados

capítulo 2

 • 47

• Caixas de diálogo modal: impedem o usuário de realizar qualquer outro tipo de ação nos sistema, exigindo dele atenção exclusiva.

Figura 2.4 – Figura 4: Caixa de diálogo.

• Caixas de diálogo não modal: Não exige atenção exclusiva do usuá-rio, permitindo que ele realize outras ações, enquanto a caixa de diálogo fica em segundo plano.

Figura 2.5 – Figura 5: Caixa de diálogo.

Formulários:

Este tipo de caixa de diálogo está destinado especificamente à entrada de dados. O layout deve ser autoexplicativo, agrupando de forma lógica e intuitiva os diferentes tipos de dados. As ações de entrada devem iniciar-se pelo preen-chimento do primeiro campo, no alto, à esquerda, que deverá estar com o foco das ações quando da apresentação dele.

•  Campos de preenchimento obrigatório devem ser diferenciados visual-mente e, se possível, os campos que contenham dados críticos para o sistema devem ser identificados e protegidos contra acidentes de operação. Mensagem que advirta sobre os efeitos da ação e solicite a confirmação do usuário, deve ser apresentada sempre que o campo for modificado.

capítulo 2

 • 49

Caixas de Mensagens:

São utilizadas para informar o usuário sobre: •  O que fazer nas interações;

•  Em que estado se encontra o sistema; •  A resposta do sistema a uma ação sua;

•  Uma situação perigosa, de erro ou de anormalidade; •  Como recuperar a normalidade de um sistema.

Normalmente, essas mensagens são do tipo modal, ou seja, o usuário preci-sa tomar conhecimento clicando em algum botão (Ok, por exemplo), para con-tinuar usando o sistema. Quando a mensagem se destina a solicitar a confirma-ção de uma aconfirma-ção destrutiva, a opconfirma-ção default deve recair sobre a anulaconfirma-ção, e não sobre a confirmação da ação. Caixas de mensagens envolvendo ações perigosas (formatar disco rígido) devem ser destacadas pelo uso de cor vermelha, pelo efeito de intermitência (pisca) ou ainda por um som.

Figura 2.8 – Caixa de mensagem.

2.3.1.2 Controles complexos

São objetos com estrutura complexa de navegação interna, que permitem a se-leção de outros controles e comandos.

•  Painel de menu

São menus dispostos verticalmente, uns abaixo dos outros.

Figura 2.9 – Menu do Windows 10.

•  Barra de menu

Contém as opções do menu principal e leva às opções secundárias relacio-nadas ao menu selecionado.

capítulo 2

 • 51

•  Barra de ferramentas

Menu sem submenus, com opções em forma de ícones associadas a coman-dos ou ferramentas.

Figura 2.11 – Barra de ferramentas.

•  Lista de seleção

É uma lista de valores possíveis predefinidos pelos desenvolvedores, deve ter de 5 a 9 itens de visualização imediata.

•  Caixa de combinação (ou Combo Box)

Deve ser ordenada seguindo ordem alfabética numérica ou por ordem de uso.

Figura 2.13 – Uma caixa de combinação

2.3.2 Atributos de objetos de interação

Os atributos de interação representam símbolos e sinais arbitrários com repre-sentação concreta, ou seja, são os modificadores dos objetos de interação. Po-demos exemplificar: •  Ícones •  Denominações •  Abreviaturas •  Cores •  Fontes •  Textura •  Vídeo Reverso

capítulo 2

 • 53

ATIVIDADES

01. Os critérios de software apresentados servem para qualquer tipo de plataforma digital? Tablets, smartphones ...

02. Sobre o critério de controle do usuário. Dê um exemplo de auxílio ao usuário sem tirar o seu poder de decisão.

03. Qual a relação entre o critério "Agrupamentos e distinção entre os itens” e o conceito de ergonomia cognitiva?

04. Qual a importância de construir um software seguindo as normas sobre IHC? Qual o benefício no resultado final?

05. Cite 3 exemplos de novas metáforas com o mundo real que poderiam ser utilizadas como objetos de interação com o usuário.

REFLEXÃO

Construir um programa voltado para usabilidade levando em consideração critérios ergo-nômicos não é uma tarefa fácil. Existe a necessidade de uma equipe multidisciplinar, alta-mente treinada, e a paciência necessária para a interação e participação dos usuários nos processos de determinação das interfaces do sistema. Apesar de encarecer o produto, a utilização de elementos ergonômicos no software torna a experiência de uso mais agradável, colocando o software alguns pontos acima no mercado. Logo essa será uma a exigência do mercado e softwares que não forem construídos segundo princípios ergonômicos cairão naturalmente em desuso.

Em contrapartida, novas ferramentas e plataformas vêm cada vez mais ganhando, com novas propostas e novas formas de interação. Mas será que os princípios ergonômicos para esses dispositivos devem ser diferentes, uma vez que a forma de interação é diferente? Essa é uma área em grande ascensão, em que profissionais gabaritados estão em falta. A grande pergunta que fica é: os critérios ergonômicos mudam conforme a forma de interação com o dispositivo?

LEITURA

As normas podem ser adquiridas (compradas) diretamente da ISO ou por meio de outras or-ganizações. Para um maior e completo entendimento sobre toda a abrangência das normas,  é recomendada vista ao site www.iso.org/iso/en.

Leia mais sobre os tipos de objetos de interação. No tutorial da linguagem Java existem vários suportados pela linguagem:

https://docs.oracle.com/javase/tutorial/uiswing/components/index.html

Para a parte de web, veja os principais componentes que podem ser usados na série de tutoriais da W3Schools. Este link é excelente:

http://www.w3schools.com/html/html_forms.asp

REFERÊNCIAS BIBLIOGRÁFICAS

BARBOSA, S.; SANTANA, B. Interação Humano-Computador. Rio de Janeiro: Campus-Elsevier, 2010.

BASTIEN, J. M. C. Ergonomic criteria for the evaluation of human computer interfaces. Research Gate, Lorraine, maio 1993.

BEVAN, N. International Standards for HCI. International Journal of Human Computer Studies, Londres, 4, 1 out. 2001. 533-552. Disponivel em: <http://dl.acm.org/citation.cfm?id=565970>. Acesso em: 1 jul. 2015.

OREN, T.; YILMAZ, L. Quality Principles for the Ergonomics of Human-Computer Interfaces of Modeling and Simulation Software. Publications - School of Electrical Engineering and Computer Science, Ottawa, 01 maio 2005. ? Disponivel em: <http://citeseerx.ist.psu.edu/viewdoc/ summary?doi=10.1.1.506.4251>. Acesso em: 1 jul. 2015.

Desenvolvimento

Neste capítulo, vamos estudar a parte de desenvolvimento de interfaces ho-mem-computador, ou IHC, também conhecida por interface homem-máquina ou IHM.

Esta área é muito abrangente e tem vários desdobramentos, mas, neste ca-pítulo vamos estudar alguns assuntos que compõem, de maneira geral, a parte de desenvolvimento de IHC e em especial as técnicas de concepção e de mode-lagem de interfaces.

A interface de um software é algo bastante determinante para o seu sucesso. É muito difícil encontrar um software de sucesso cuja interface não esteja de acordo com sua proposta ou agrade.

Até mesmo em jogos eletrônicos: existem alguns sucessos recentes que, mesmo não tendo gráficos realísticos e sofisticados, tiveram uma grande acei-tação pelo mercado, e a interface tem grande parcela de responsabilidade nis-so. Como exemplo, veja o jogo “FlappyBird”, disponível originalmente para o iphone. Feito em 2013, ele se destacou principalmente pela sua jogabilidade e dificuldade. Outros jogos mais “pesados” se destacam pelos efeitos realísticos de última geração, os quais são verdadeiras produções de Hollywood (literal-mente, uma vez que alguns estúdios de jogos são em Los Angeles). Enfim, a interface é um fator que determina o sucesso final de um software.

OBJETIVOS

Ao final deste capítulo, você estará apto a:

•  Entender o fluxo de desenvolvimento de interfaces gráficas, passando pelas técnicas de concepção e de modelagem de interfaces.

capítulo 3

 • 57

3.1 Introdução ao projeto de IHC

Em primeiro lugar, precisamos definir o que é projeto, ou design, de IHC. Se-gundo BARBOSA e SANTANA (2010), podemos dividir o design de IHC em duas partes; a primeira é o Design:

•  O Design parte de uma concepção intelectual da experiência do usuário. Cada usuário temsuas experiências e visões a respeito da forma como gostaria que um determinado software fosse.

•  A partir daí, o design passa a ser uma concretização desta concepção em uma representação que pode ser implementada.

•  A segunda é a parte “de IHC”:

•  Neste caso, estamos falando da experiência do usuário, ou seja, como ele vai interagir com o computador, e isto tem a ver com o projeto do software, po-rém não é sinônimo de projeto de software.

Experiência do usuário ou também chamada de UsereXperience (UX), compreen-de vários fatores sobre o que o usuário sente em relação ao uso compreen-de um compreen-determinado produto, sistema ou serviço. A ISO 9421-210 define que a experiência do usuário são “as percepções e reações de uma pessoa que resulta do uso ou utilização prevista de um produto, sistema ou serviço”. Na prática, a experiência envolve todo o acúmulo de preferências, respostas, sensações e comportamentos que o usuário possui e adquire com o uso de um software.

De acordo com o trabalho de ROGERS, SHARP e PREECE (2013), o processo de projeto de IHC possui quatro atividades básicas como:

1. Identificação das necessidades e estabelecimento dos requisitos. Nesta atividade, as necessidades dos usuários são levantadas e listadas a fim de serem analisadas para poder ser contempladas futuramente na interface. Desta for-ma, os requisitos são estabelecidos e documentados.

2. Desenvolver designs alternativos. Nesta atividade, a exploração de vá-rios aspectos com relação ao visual e usabilidade do software podem ser inves-tigados. Novos cenários de interação podem ser criados a fim de avaliá-los e perceber o quanto contribuem com a experiência do usuário.

3. Construir versões interativas dos designs. Atualmente existem vários softwares que ajudam nesta tarefa. Ter uma representação “usável” do software

é muito importante, porque também é uma forma de esclarecer os requisitos para a interface.

Entre os softwares mais usados para este tipo de versão estão os softwares do tipo wireframe, entre eles:

capítulo 3

 • 59

Alguns destes softwares têm versões para estudante e, embora sejam pagos quando usados em empresas, são gratuitos para estudantes.

4. Avaliar o design. Uma vez que designs alternativos foram testados e mo-delados em uma ferramenta de simulação como as apresentadas, as alterna-tivas de design são avaliadas e classificadas por meio de critérios incluindo o número de erros que os usuários cometem ao usar a alternativa avaliada. Além disso, outros critérios como aparência, quantidade de requisitos satisfeitos e outros também são usados.

Mesmo com estas atividades mostradas, qualquer processo de design de IHC tem algumas características essenciais que devem ser prezadas durante todo o processo:

1. O foco deve ser mantido sempre no usuário;

2. A experiência que se deseja que o usuário tenha deve ser clara e com os objetivos bem definidos;