Baixe o app para aproveitar ainda mais
Prévia do material em texto
UVA – Universidade Veiga de Almeida IHM - Princípios de Projeto - Cap. 10 Introdução • As interfaces H-M devem funcionar como veículo de comunicação entre os usuários e a máquina. • Devem ser compatíveis com o pensamento humano. • Devem minimizar as situações de erro ou de má interpretação. UVA – Universidade Veiga de Almeida IHM - Princípios de Projeto - Cap. 10 Capacidades humanas: Sentir (receber estímulos externos); Memorizar (lembrar de fatos que ocorreram); Raciocinar (processar regras lógicas com os fatos memorizados); Expressar (gerar sinais para o exterior); UVA – Universidade Veiga de Almeida IHM - Princípios de Projeto - Cap. 10 Objetivos humanos: Conhecimento - curiosidade por tudo; Liberdade - busca não limitada pelo conhecimento; Reconhecimento - confirmação de sua superioridade sobre outros seres; UVA – Universidade Veiga de Almeida IHM - Princípios de Projeto - Cap. 10 Limitações humanas: Espacial (não podem estar em dois lugares ao mesmo tempo); Temporal (sabem que um dia irão deixar de existir, o que leva à angústia de determinação deste momento); Fragilidade (perdem a vida facilmente); UVA – Universidade Veiga de Almeida IHM - Princípios de Projeto - Cap. 10 Compensações humanas : Competição por mais espaço; Aproveitamento melhor do tempo (evitam repetições que resultam em perda de tempo); Evitar o desconhecido que pode ameaçar sua vida (instinto de proteção e sobrevivência). UVA – Universidade Veiga de Almeida IHM - Princípios de Projeto - Cap. 10 Modelagem do Ser Humano • As capacidades humanas (sentir, memorizar e raciocinar) geram expectativas de como algo se comporta quando a aparência, a interatividade e a terminologia são semelhantes ao que estamos acostumados. Procuramos transferir o que aprendemos para uma nova situação, prevendo como será o comportamento em um futuro imediato. UVA – Universidade Veiga de Almeida Conhecimento e Liberdade Mudar de uma atividade para outra conforme sua vontade; Interromper atividades que não desejam continuar; Realizar ações em qualquer seqüência para atingir um objetivo; Não gostem de ser obrigados a se lembrar; Gostem de ver como devem proceder; Busquem a forma diferente (beleza) e o novo e inédito, portanto gostam da variedade; Querem que um dado seja transformado em informação da maneira mais simples possível. UVA – Universidade Veiga de Almeida Modelagem do Ser Humano - Responsabilidade Devido à busca do reconhecimento e fragilidade: Gostamos de suspender ou cancelar a qualquer instante qualquer atividade sem causar resultados desastrosos; Nos sentimos mais confortáveis quando os erros não causam resultados severos ou irreversíveis; Gostamos de expressar nossos desejos reservadamente (respeito à individualidade); UVA – Universidade Veiga de Almeida Modelagem do Ser Humano - Monotarefa Devido às limitações de tempo e de espaço: Gostamos de permanecer com o foco na tarefa que desejamos terminar; Percebemos que estamos no controle quando podemos ver quais ações são válidas antes de executá-las. • UVA – Universidade Veiga de Almeida Modelagem do Ser Humano - Esforço Mínimo O ser humano busca praticidade, proximidade e rapidez: Desejamos antecipar o que é necessário fazer; Gostamos de indicações e recomendações; Desejamos rapidez na escolha e no atendimento; Evitamos tarefas inconvenientes e repetitivas; Ex: Selecionar um objeto várias vezes para poder aplicar todas as ações necessárias; Detestamos ficar em situação "modal" : - Precisam interromper ou cancelar o que estamos fazendo antes de poder fazer qualquer outra coisa; - Uma mesma ação produz resultados diferentes em situações diferentes. UVA – Universidade Veiga de Almeida Modelagem do Ser Humano - Insegurança A fragilidade humana gera: Receio de interagir com o desconhecido e complexo; Receio de ferramentas e mecanismos que fazem a algo se mover ou funcionar; Comportamento paradoxal de exigência de exclusividade (superioridade) e igualdade/identidade (moda) Ex: Festas (desejo que todos estejam na festa) e nos convites de festas (somente alguns podem ser convidados); Comportamento paradoxal de exigência de variedade e rapidez na escolha (quanto maior é um, menor é o outro); UVA – Universidade Veiga de Almeida Princípios Gerais Os usuários devem desenvolver um modelo conceitual de interface Quando a aparência, as técnicas interativas e a terminologia são consistentes, os usuários desenvolvem uma expectativa de como a aplicação se comporta. Se as novas aplicações suportam um mesmo modelo conceitual, os usuários reduzem o tempo total necessário para o aprendizado dessas aplicações. UVA – Universidade Veiga de Almeida Princípios Gerais Os usuários devem estar no controle do diálogo Os usuários devem ser capazes de realizar qualquer ação em qualquer seqüência que desejarem para completar uma tarefa. Aplicações sequenciais não suportam este princípio. Deverá existir uma relação coesiva e integral entre a interface do usuário, a aplicação e os próprios usuários. UVA – Universidade Veiga de Almeida Modelo Conceitual - Ambiente de Trabalho • O ambiente de trabalho descreve a integração de aplicações numa versão digital que simula o local de trabalho real. • As aplicações são integradas através de objetos apresentados como ícones na área de trabalho do ambiente. • Os objetos devem ser mostrados de forma parecida com os objetos que o usuário está acostumado no mundo real. – Ex: Um escritório virtual deverá ter ícones para a caixa de correio, armário de arquivos, telefone, impressoras, e deverão ser compartilhados por todas as aplicações. • O processo de utilização deve ser simples: – Ex: Para imprimir um documento, o usuário deverá usar o mouse para arrastar um ícone do documento para um ícone da impressora. UVA – Universidade Veiga de Almeida Técnicas para construção de Modelos Conceituais Utilizar metáforas Projetar a interface orientada ao usuário Tornar a interface consistente Evitar situações modais Tornar a interface transparente ao usuário. UVA – Universidade Veiga de Almeida Metáforas • Metáfora (analogia): associação de fatos não relacionados. • A utilização de metáforas é o caminho para desenvolver o modelo conceitual do usuário para uma aplicação. • Uma metáfora deve atender às expectativas do usuário geradas na sua experiência com o mundo real: conhecimento prévio do ambiente de trabalho é transferido pelo usuário para a interface da aplicação. • Deve-se utilizar formas similares às formas do mundo real: – Ex: Aplicações bancárias podem apresentar formulários visualmente equivalentes aos formulários de papel. UVA – Universidade Veiga de Almeida Interface orientada ao Usuário • Reforça o modelo conceitual dos usuários. • Projetar uma aplicação é permitir que os usuários apliquem seus conhecimentos do mundo real à interface da aplicação. • O projeto deve suportar o ambiente e os objetivos do mundo de trabalho do usuário. • É importante que seja realizada previamente: – análise das tarefas desenvolvidas pelo usuário para aprender o que eles desejam e como eles fazem. – identificação do tipo de audiência da aplicação. – estudo de como os usuários executam correntemente suas atividades. • Os resultados na análise das tarefas devem ser usados para modelar a interface com o usuário. UVA – Universidade Veiga de Almeida Tornando uma InterfaceConsistente • É uma maneira de desenvolver e reforçar o modelo conceitual do usuário. • As aplicações devem ser consistentes com os ambientes: – Hardware – por exemplo: as teclas devem possuir sempre as mesmas funções – Software – os componentes fundamentais e técnicas utilizadas são as mesmas de outras aplicações • A consistência através de uma aplicação é suportada quando se estabelece: – Apresentação comum – o que os usuários vêem. Ocorre quando os componentes da interface de uma aplicação são reconhecidos pelo usuário. – Interação comum – os usuários interagem com os componentes da mesma maneira – Seqüência de processos comum –os usuários e a máquina se comunicam um com o outro numa única seqüência – Ações comuns – ações similares são implementadas da mesma maneira UVA – Universidade Veiga de Almeida Apresentação Comum Os usuários se tornam familiares com os componentes da interface quando: A aparência visual desses componentes é consistente A localização desses componentes é padronizada Exemplos: Uma barra de título de uma janela deve ser consistente em aparência (retângulo azul com botões no lado direito e título ajustado à esquerda do retângulo) e localização (sempre no topo de uma janela). Um radio button é consistente apenas na aparência (círculo com ponto no interior), mas não na localização (eles podem aparecer em qualquer posição dentro de uma janela) Aplicações distintas são apresentadas como objetos na forma de ícone na área de trabalho. UVA – Universidade Veiga de Almeida Interação Comum • Ocorre quando a interface suporta consistentemente as técnicas interativas associadas à cada componente, • O usuário fica familiarizado com essas técnicas interativas. • As formas de interação durante a execução do aplicativo são paronizadas. UVA – Universidade Veiga de Almeida Seqüência de Processos Comum • Ocorre quando a interface suporta consistentemente uma mesma seqüência de processos. • O usuário fica familiarizado com a maneira como ele interage com a aplicação. • Aprende como a aplicação responde às suas solicitações. • Por exemplo, quando o usuário seleciona um objeto na área de trabalho e seleciona uma ação na barra de tarefas, aparece um menu “pull down”. – Neste menu, qualquer escolha não disponível é mostrada com o texto em cinza. – Isto permite que o usuário explore as ações disponíveis para a escolha selecionada. – Depois de aprender, de maneira esperada, como a máquina responde, fica mais difícil de ser assimilado um outro modelo conceitual que não suporta esta seqüência de processos. UVA – Universidade Veiga de Almeida Seqüência de Processos Comum • Para a interação entre o usuário e a máquina, a seqüência de processos deve ser orientada por objeto-ação. • Nesta seqüência de processos, o usuário seleciona um objeto e depois seleciona uma ação a aplicar neste objeto. • Reforça o modelo conceitual da interface. • Equivale a notação polonesa usada em algumas máquinas de calcular: – Por exemplo: as máquinas de calcular da família HP) onde o usuário entra um objeto, depois outro objeto e só então entra o operador (ação). UVA – Universidade Veiga de Almeida Seqüência de processos objeto-ação Fornece uma base para usuários explorarem a aplicação através de ações sensíveis ao contexto. – Os usuários podem primeiro selecionar um objeto e então investigar as ações para identificar qual a que se aplica ao objeto selecionado. – Os usuários percebem que estão no controle pois eles podem ver quais ações são válidas antes de executá-las. Reduz a complexidade da interface e simplifica a arquitetura geral através da redução dos níveis hierárquicos necessários para a aplicação UVA – Universidade Veiga de Almeida Permite aos usuários executarem uma série de ações em um objeto selecionado ao invés de repetidamente selecionar um objeto para cada ação desejada. – Por exemplo: em um processador de textos, os usuários podem selecionar algum texto (objeto) e então aplicar a ele uma série de estilos (ações), tais como: negrito, itálico, sublinhado. – Os usuários acham uma interface inconveniente e repetitiva se tiverem que selecionar um objeto muitas vezes para aplicar todas as ações que desejam. Seqüência de processos objeto-ação UVA – Universidade Veiga de Almeida Ação Comum • Um conjunto de significados para grande parte das ações dos aplicativos deve ser definido. • A ação comum fornece uma linguagem entre o usuário e a máquina de modo a que o significado e o resultado dessas ações possam ser compreendidos. – Por exemplo: sempre que o usuário selecionar o botão <OK>, ele estará informando ao computador que finalizou o trabalho com uma janela particular e deseja continuar com a aplicação. UVA – Universidade Veiga de Almeida SITUAÇÃO MODAL • Os usuários ficam em situação "modal" quando: – Precisam cancelar o que estão fazendo antes de poderem fazer qualquer outra coisa. – Uma mesma ação produz resultados diferentes em situações diferentes. • Os usuários precisam permanecer com o foco na tarefa que desejam terminar ao invés de como o programa funciona - isto não acontece quando o sistema gera uma situação modal • A moda interfere na habilidade do usuário de utilizar o modelo conceitual de como a aplicação deverá funcionar. • Deve-se fazer com que as modas sejam uma exceção, limitando estas situações ao mínimo possível. • Toda vez que for necessário a inclusão de “moda”, deve-se tornar tal situação óbvia para o usuário através de retornos visuais específicos. UVA – Universidade Veiga de Almeida Tipos de Situação Modal Diálogo Modal – quando uma aplicação necessita de mais informação para continuar o processamento. – O retorno visual para o diálogo modal se faz colorindo- se o contorno das caixas de diálogo. Exemplos: – Fornecimento de um nome de arquivo em determinado ponto do processo; – Solicitação de uma ação do usuário, que precisa ser realizada antes de continuar o processamento, quando ocorre uma situação de erro. UVA – Universidade Veiga de Almeida Tipos de Situação Modal Modas de Amortecimento – quando os usuários agem continuamente de maneira que permanecem sempre na situação modal. – O retorno visual para modas de amortecimento se faz iluminando-se (highlight) o trecho em moda. Exemplo: quando os usuários arrastam o cursor sobre um trecho com texto. UVA – Universidade Veiga de Almeida Tipos de Situação Modal Modas de Ferramentas – quando os usuários selecionam uma ferramenta eles ficam em moda até que a ferramenta seja utilizada. – O retorno visual para modas de ferramentas se faz alterando-se a forma do cursor (a nova forma faz com que o usuário se lembre permanentemente de que ele está em moda). Exemplo: em aplicações de desenho no computador (como o paintbrush), é comum a seleção de ferramentas como pincéis, borrachas, lupas e outras. – Nestas aplicações, o cursor normalmente assume uma forma que lembra a própria ferramenta (pincel, borracha, lupa). UVA – Universidade Veiga de Almeida Tornando uma Interface transparente • Não se deve colocar o foco do usuário na mecânica de uma aplicação, isto é, o usuário não deve se preocupar com a maneira e os algoritmos de processamento da interface. • A interação com o usuário deve ser simples e o mais natural possível. UVA – Universidade Veiga de Almeida Tornando uma interface simples e natural • Os usuários não devem ter receio das ferramentas e mecanismos que fazem a aplicação funcionar. • Exemplo: A interface do automóvel com o motorista é muitosimples: os motoristas precisam apenas girar o volante, passar a marcha e acionar pedais de freio, aceleração e embreagem para operar um automóvel. • A interface com o usuário deve ser intuitiva de forma que os usuários possam antecipar o que vão fazer, aplicando seus conhecimentos prévios de executar tarefas em ambientes naturais (fora de um computador). UVA – Universidade Veiga de Almeida Permitindo o Controle do Diálogo pelo Usuário • Os projetos de interface caracter colocavam o aplicativo no controle do diálogo. • Para os usuários ficarem no controle do diálogo deverá ocorrer um relacionamento coeso e integral entre a interface, a aplicação e os usuários. • Os usuários estão no controle do diálogo quando: – São capazes de mudar de uma atividade para outra de acordo com sua vontade; – São capazes de interromper atividades que não mais desejam continuar; – São capazes de suspender ou cancelar a qualquer instante qualquer atividade sem causar resultados desastrosos. UVA – Universidade Veiga de Almeida IHM - Princípios de Projeto - Cap. 10 Técnicas que colocam os usuários no controle do diálogo • Esquecimento • Perdão • Apresentação Visual • Retorno Imediato das Ações UVA – Universidade Veiga de Almeida Técnicas para usuários no controle do diálogo Esquecimento • A interface deverá poder reverter as ações do usuário (Undo) • Devido ao processo de aprendizagem através de exploração (que envolve tentativa e erro), os usuários devem ser capazes de retornar ou desfazer suas ações prévias sem o temor de causar um erro irreversível. UVA – Universidade Veiga de Almeida Técnicas para usuários no controle do diálogo Esquecimento • A interface deverá poder reverter as ações do usuário (Undo) • Devido ao processo de aprendizagem através de exploração (que envolve tentativa e erro), os usuários devem ser capazes de retornar ou desfazer suas ações prévias sem o temor de causar um erro irreversível. UVA – Universidade Veiga de Almeida Técnicas para usuários no controle do diálogo Perdão • A interface deverá poder perdoar as ações do usuário (Cancel) • Todas as ações que são destrutivas requerem uma confirmação (força o sistema a entrar em situação modal). • Os usuários sentem-se mais confortáveis com um computador quando seus erros não causam resultados severos ou irreversíveis. UVA – Universidade Veiga de Almeida Apresentação Visual • Com uma interface gráfica, os usuários podem ver como devem proceder, o que é melhor do que serem obrigados a se lembrar. • As seguintes apresentações devem ser visuais: – Componentes da interface; – Interação com os componentes. • Sempre que possível, deve-se fornecer uma lista de itens os quais os usuários escolherem em vez de fazê-los lembrar das escolhas válidas. Técnicas para usuários no controle do diálogo UVA – Universidade Veiga de Almeida Retorno Imediato das Ações • Os usuários nunca devem pressionar uma tecla ou selecionar uma ação sem o recebimento imediato de retorno visual e/ou audível. • Quando o cursor estiver numa opção de escolha, indicadores de seleção devem enfatizar a cor ou o fundo para mostrar ao usuário que ele pode selecionar esta alternativa. • Depois de feita a escolha, indicadores de cor e seleção mudam para mostrar ao usuário que a escolha foi selecionada. Técnicas para usuários no controle do diálogo UVA – Universidade Veiga de Almeida Requisitos de Construção de Interfaces Gráficas Visão do processo Antes de desenvolver um protótipo do produto, a equipe de projeto deverá realizar as seguintes atividades: Análise das necessidades - validação da idéia do produto. Perfil do usuário - visão de alto nível do grupo de usuários. Definição clara do objetivo. Análise do usuário - pesquisa a intenção do usuário. Análise das tarefas - quebra das tarefas em etapas de procedimentos Mapa das tarefas - técnica usada para compilar os dados. Descrição do produto UVA – Universidade Veiga de Almeida Requisitos de Construção de Interfaces Gráficas Idéia Análise das Objetivo Perfil do Necessidades Usuário Análise do Análise das Usuário tarefas Mapa das tarefas Descrição do Produto UVA – Universidade Veiga de Almeida Análise das necessidades Validação da idéia do produto. Preenche a lacuna entre a percepção da idéia do produto e a demanda real pelo produto. Responde à questão: o produto preenche os desejos e necessidades do usuário? A resposta capacita a equipe de desenvolvimento a definir mais claramente as fases de análise das tarefas e análise do usuário. Requisitos de Construção de Interfaces Gráficas UVA – Universidade Veiga de Almeida Perfil do Usuário É uma visão de alto nível do grupo de usuários. Ele esboça o que os usuários da aplicação fazem profissionalmente, e onde irão utilizar o produto. – Ex: Os usuários deste sistema necessitam de comunicação entre si, em todos os níveis da hierarquia da empresa; – Eles estarão acessando o sistema 24 horas por dia, de escritórios distribuídos em diversos locais). Requisitos de Construção de Interfaces Gráficas UVA – Universidade Veiga de Almeida Objetivo É a documentação da visão da equipe de desenvolvimento do produto. Inclui informações tais como compatibilidade e suprimento de hardware. Será usado como especificação padrão nas fases seguintes. – Ex: Os usuários deste sistema serão capazes de criar, enviar e receber mensagens. – Os usuários irão compor todos os níveis hierárquicos?. Requisitos de Construção de Interfaces Gráficas UVA – Universidade Veiga de Almeida Análise do usuário Pesquisa a intenção do usuário. Através de entrevistas com o usuário e da observação de como eles trabalham, pode-se aprender como eles executam as tarefas e processos. Assegura que o produto não irá violar o processo atual de execução das tarefas pelos usuários. O nível de educação dos usuários também é um dos itens necessários para o projeto. – Ex: Se a audiência potencial tem um nível escolar equivalente a uma pessoa de somente 5 anos de escola , a aplicação certamente terá um aspecto muito diferente do que aquele para uma audiência de profissionais de nível superior. Requisitos de Construção de Interfaces Gráficas UVA – Universidade Veiga de Almeida Análise do usuário (cont.) Todavia as aplicações devem sempre usar terminologias claras e simples. Um outro tipo de informação necessária é a experiência do usuário. Experiência em computação irá apontar o nível de treinamento necessário contra um volume de informações de ajuda. A experiência com dispositivos de entrada de dados irá apontar a preferência pelo mouse ou pelo teclado. Experiência nas tarefas e tempo com a aplicação também devem ser considerados. Requisitos de Construção de Interfaces Gráficas UVA – Universidade Veiga de Almeida Análise das tarefas Quebra das tarefas em etapas de procedimentos. Mapa das tarefas Técnica usada para compilar os dados. Descrição do produto Contém os objetivos do sistema refinado e o critério para seu estabelecimento. Requisitos de Construção de Interfaces Gráficas UVA – Universidade Veiga de Almeida Limitações físicas e de ambiente de Operação • Confusão de cores - código de cores pode ser um problema para certos usuários. • Inabilidade física - O uso de sons para uma audiência com problemas auditivos • Ruído - ambientes com ruídos deverá limitar os usuários na escuta de “beeps”ou outros retornos audíveis. • Iluminação - iluminação pobre pode afetar o desenho da interface. UVA – Universidade Veiga de Almeida Conhecimento e experiência Educação – Primário / Secundário / Técnico / Superior Linguagem nativa – Português / Inglês / Espanhol Uso do mouse – Alto / Médio / Baixo Conhecimento computacional – Alto / Médio / Baixo Experiência com equipamentos – Especialista / Intermediário / Iniciante. UVA – Universidade Veiga de Almeida Características psicológicas e físicas • Estilo de aprendizado – Verbal ou analítico / espacial ou intuitivo • Atitude em relação aos computadores – Positiva / Neutra / Negativa • Motivação – Alta / Média / Baixa • Temores e tensões – Falha / Qualidade de vida no trabalho / Má experiência / Mudança / Pressão de tempo / Tratamento com o público • Características físicas – Daltônico / Canhoto / Sexo / Idade / Limitações UVA – Universidade Veiga de Almeida Características das tarefas Freqüência de uso – Alta / Média / Baixa Impacto das tarefas – Imediato / Curto prazo / Longo prazo Complexidade – Alta / Média / Baixa Uso – Obrigatório / Opcional Custo do recurso – Alto / Médio / Baixo Treinamento – Obrigatório / Opcional / Formal / No trabalho / Somente documentação / Nenhum UVA – Universidade Veiga de Almeida Características das tarefas Categoria do trabalho – Executivo / Gerencial / Técnico / Suporte / Administrativo Quantidade de variação permitida na performance da tarefa – Alta / Média / Baixa Familiaridade com Ferramentas similares – Telefone / Calculadora / Máquina de escrever / Outras Taxa de turnover – Alta / Média / Baixa Supervisão e Monitoramento – Contínua / Diária / Semanal / Mensal / Ocasional UVA – Universidade Veiga de Almeida Análise de tarefas Documentar cada etapa que o usuário realiza para fazer uma tarefa Registrar termos e jargões utilizados na comunicação Identificar: – As ferramentas que os usuários utilizam para fazer uma tarefa – Duração das tarefas – Artefatos usados para completar as tarefas UVA – Universidade Veiga de Almeida Análise de tarefas Regras Gerais: – Encontrar padrões e significados empregados durante a realização das tarefas; – Foco no processo da tarefa e não nas ferramentas; – O entrevistador deverá funcionar como um observador; – Determinar as razões porque cada tarefa é feita; – Verificar a possibilidade da tarefa ser realizada de outras maneiras. UVA – Universidade Veiga de Almeida Programação orientada a processo Características – Estabelece uma ordem fixa para os passos que serão executados. – Processo semelhante às instruções que compõem uma receita. Efeito – Quem escreve a receita assume o controle do que vai ser produzido. UVA – Universidade Veiga de Almeida Programação orientada a eventos Característica – Responde às ações do usuário. – O aplicativo é um conjunto de pequenos programas acionados por meio de eventos disparados pelo usuário final. – Recomendado para o tratamento da interação gráfica. Efeito – Faz com que o usuário final assuma o controle dos acontecimentos. UVA – Universidade Veiga de Almeida Recomendações para o Projeto Gráfico Descrição dos elementos de projeto gráfico de interface estritamente do ponto de vista prático. Todos os melhoramentos devem ser implementados com maior ênfase na usabilidade do que na estética pura. Problemas de usabilidade são freqüentemente problemas estéticos A tendência de projetos de GUI aponta a direção de grande usabilidade através de apelos estéticos. – Ex: Títulos multimídia em CD; – Páginas na WWW; – Aplicações de produtividade; – Front-ends de bancos de dados corporativos.
Compartilhar