Baixe o app para aproveitar ainda mais
Prévia do material em texto
Aula de Hoje • Projeto de Interfaces do Usuário HCI – Human Computer Interface Motivação • O mundo está rodeado de sistemas • E, os sistemas requerem interação humana • Daí surge a necessidade de boa Usabilidade Usabilidade “Usabilidade é uma medida qualitativa da facilidadefacilidade e eficiênciaeficiência com a qual um ser humano consegue empregar as funções e os recursos consegue empregar as funções e os recursos oferecidos pelo produto de alta tecnologia” [Pressman, 2011] Usabilidade • Nas três primeiras décadas da era computacional, usabilidade não era uma preocupação dominante entre os que construíam softwareentre os que construíam software • Em 1988, Donald Norman argumentou que já era tempo de uma mudança de atitude Usabilidade “ Para criar tecnologia que se adapte ao ser humano, é necessário estudá-lo. Hoje temos uma tendência de estudar apenas a tecnologia. Como consequência, exige-se que as pessoas se adaptem consequência, exige-se que as pessoas se adaptem à tecnologia. É chegada a hora de inverter a tendência, a hora de fazer com que a tecnologia se adapte às pessoas” [Donald Norma] Estudo da Interação Humana • A partir dos estudos das interações humanas surgiram duas questões importantes • Conjunto de Regras de Ouro que se aplicam a toda • Conjunto de Regras de Ouro que se aplicam a toda interação humana com produtos tecnológicos • Conjunto de Mecanismos de Interação para permitir aos projetistas de sw construir sistemas que implementam de forma apropriada essas regras de ouro As Regras de Ouro 1. Deixar o usuário no comando 2. Reduzir a carga de memória do usuário 3. Tornar a interface consistente 1. Deixar o usuário no comando “O que eu realmente gostaria é de um sistema que leia a minha mente. Ele saberia o que eu quero fazer antes mesmo de eu ter de fazê-lo e isso me facilitaria tremendamente a de eu ter de fazê-lo e isso me facilitaria tremendamente a vida. Isso é tudo, apenas isso.” [Ass: usuário] 1. Deixar o usuário no comando • O usuário quer um sistema que reaja às suas necessidades e o ajude a concretizar suas tarefas • O usuário quer controlar o computador, e não que o computador o controle 1. Deixar o usuário no comando • Como projetistas, somos tentados a introduzir restrições e limitações para simplificar a implementação da interfaceimplementação da interface • O resultado é uma interface fácil de ser construída, mas frustrante sob o ponto de vista do usuário 1. Deixar o usuário no comando • Theo Mandel em 1997 definiu 6 (seis) princípios de projeto que possibilitam a um usuário manter o controle 1. Deixar o usuário no comando 1.1. Defina modos de interação para não forçar o usuário a realizar ações desnecessárias ou indesejadas • Ex: sistema solicita todos os dados para o cadastro de um funcionário, depois do usuário preencher tudo e clicar em salvar, o sistema avisa que o CPF já existe e apaga todos os dados digitados. � 1. Deixar o usuário no comando 1.2. Proporcione interação flexível: ofereça diferentes opções de interação • Ex: permitir ao usuário interagir por meio de comandos do teclado (teclas de atalhos), movimentação do mouse, caneta digitalizadora, tela multitoque, etc... • Ex: Sistema de controle de eventos em calendário, visualização dos eventos em lista ou em forma de calendário Exemplo Google Calendar OPÇÃO 1 OPÇÃO 2 Exemplo Google Calendar Diversas opções de visualização 1. Deixar o usuário no comando 1.3. Possibilite que a interação possa ser interrompida e desfeita • Permitir ao usuário interromper o que está fazendo para fazer outra coisa SEM perder o que já tinha feito • Ex: usuário preenchendo um formulário enorme que só pode salvar no final, ou seja, quando começa a preencher TEM que ir até o final, senão perde tudo� solução salvar parcial ☺ • Ex: telas sem opção de cancelar uma ação e voltar ao passo anterior � 1. Deixar o usuário no comando 1.4. Simplifique a interação à medida que os níveis de competência avançam e permita que a interação possa ser personalizada • Ex: No Microsoft Office Word 2007, é possível automatizar tarefas usadas frequentemente criando macros. Uma macro é uma série de comandos e instruções agrupadas como um único comando para realizar uma tarefa automaticamente. Por exemplo, para inserir uma tabela com um tamanho e bordas específicos e com um número específico de linhas e colunas 1. Deixar o usuário no comando 1.5. Oculte os detalhes técnicos de funcionamento interno do usuário casual • A interface não deve exigir que o usuário interaja em um nível “interno” à máquina • Ex: digitar comandos do SO a partir do ambiente de aplicação • Ex: editor de texto LATEX Exemplo LATEX 1. Deixar o usuário no comando 1.6. Projete uma interação direta com objetos que aparecem na tela • Usuário tem sensação de controle quando manipula objetos para realizar uma tarefa no sistema de maneira similar como aconteceria no mundo físicoaconteceria no mundo físico • Ex: uma interface de aplicação que permita “esticar” um objeto (aumentar ou diminuir seu tamanho) é uma implementação de manipulação direto • Ex: Talking Ginger, Talking Tom Cat As Regras de Ouro 1. Deixar o usuário no comando 2.2. Reduzir a carga de memória do usuárioReduzir a carga de memória do usuário 3. Tornar a interface consistente 2. Reduzir a carga de memória do usuário “Quanto mais o usuário tiver de se lembrar, mais sujeita a erros está a interação com o sistema.” sujeita a erros está a interação com o sistema.” [Pressman, 2011] 2. Reduzir a carga de memória do usuário • Theo Mandel em 1997 definiu 5 (cinco) princípios de projeto que possibilitam a um interface reduzir a carga de memória do usuário 2. Reduzir a carga de memória do usuário 2.1. Reduza a demanda de memória recente • A interface deve ser projetada para reduzir a exigência de recordar ações, entradas e resultados passados. Isso poderecordar ações, entradas e resultados passados. Isso pode ser obtido pelo fornecimento de pistas visuais que permitam a um usuário reconhecer ações passadas, em vez de ter de recordar delas • Ex: escolhi tipo de evento e data desejada, quando mostrar a lista de eventos, mostrar qual tipo e data eu havia escolhido Exemplo Windows Explorer O sistema mostra onde você está hierarquicamente nas pastas 2. Reduzir a carga de memória do usuário 2.2. Estabeleça defaults significativos • um conjunto de parâmetros iniciais devem fazer sentido para um usuário comum, porém o usuáriosentido para um usuário comum, porém o usuário deve poder altera-lo para definir suas preferência. Mas, tenha sempre a opção de “reset” para voltar aos valores padrões iniciais • Ex: filtro de eventos da próxima semana... Exemplo Google Calendar 2. Reduzir a carga de memória do usuário 2.3. Defina atalhos intuitivos • Quando forem usados mnemônicos para alguma função de sistema, esse deve estar ligado à ação,função de sistema, esse deve estar ligado à ação, ser intuitivo e de fácil memorização • Ex: a primeira letra da ação = CTRL + P = print 2. Reduzir a carga de memória do usuário 2.4. O layout visual da interface deve se basear na metáfora do mundo real • Para que o usuário se apoie em indicações visuais• Para que o usuário se apoie em indicações visuais compreensíveis em vez de memorizar sequência de interações misteriosas • Ex: um sistema de pagamento de contas, pode usar uma metáfora de talão de cheque para orientar o usuário no processo de pagamento de contas Exemplo metáfora do mundo real 2. Reduzir a carga de memória do usuário 2.5. Revele informações de maneira progressiva • Organize a interface hierarquicamente• Informações sobre uma tarefa, um objeto ou um comportamentoum objeto ou um comportamento devem ser apresentadas inicialmente em um alto nível de abstração. Mais detalhes devem ser apresentados após o usuário demonstrar interesse por meio de alguma seleção • Ex: função sublinhado As Regras de Ouro 1. Deixar o usuário no comando 2. Reduzir a carga de memória do usuário 3.3. Tornar a interface consistenteTornar a interface consistente 3. Tornar a interface consistente • As informações visuais devem ser organizadas de acordo com regras de projetos mantidas ao longo de todas as telas – Ex: botão de voltar sempre no mesmo lugar • Os mecanismos de entrada devem ser usados de forma consistente por toda a aplicação • Os mecanismos de navegação para passar de uma tarefa a outra devem ser implementados de forma consistente 3. Tornar a interface consistente • Theo Mandel em 1997 definiu um conjunto de princípios de projeto para tornar uma interface consistente 3. Tornar a interface consistente 3.1. Permita ao usuário inserir a tarefa atual em um contexto significativo • É importante fornecer indicadores que permitam o usuário saber o contexto do trabalho em mãosusuário saber o contexto do trabalho em mãos 3. Tornar a interface consistente 3.2. Mantenha a consistência ao longo de uma família de aplicações • Um conjunto de aplicações devem implementar as• Um conjunto de aplicações devem implementar as mesmas regras de projeto para manter consistência na interação • Ex: CTRL + C = copiar no Excel = Word = Power Point 3. Tornar a interface consistente 3.3. Se modelos interativos anteriores tiverem criado expectativa nos usuários, não faça alterações • Uma vez que a sequência interativa for definida o• Uma vez que a sequência interativa for definida o usuário pressupõe que isso vá ocorrer em qualquer aplicação futura Projeto de Interface do Usuário • O projeto de interface do usuário deve enfatizar a necessidade do usuário final e a facilidade de uso Exemplo de Projeto de Interface Exemplo de Projeto de Interface Exemplo de Projeto de Interface Análise X Projeto use-cases - text use-case diagrams activity diagrams data flow diagrams control-flow diagrams f l ow- or i ent e d e l ement s scena r i o- based e l ement s Com pone nt - Le v e l De sign Analysis Model activity diagrams swim lane diagrams control-flow diagrams processing narratives behav ior a l e l ement s c l a ss- based e l ement s class diagrams analysis packages CRC models collaboration diagrams state diagrams sequence diagrams Da t a / Cla ss De sign A rc h it e c t u ra l De sign In t e rf a c e De sign Design Model Interface Design Trabalho em Grupo – Fazer o projeto de interface do sistema do grupo – Como fazer?– Como fazer? – Analise o diagrama dos casos de uso e crie as telas na sequencia das interações – Para cada tela criada, indique quais regras de ouro foram consideradas – Pode utilizar ferramentas que apoiem o projeto de interface. Ex: Pencil Leitura Recomendada – Capítulo 11 do livro texto: Pressman, Roger. Engenharia de Software, 7ed. McGrawHill, Porto Alegre, RS, 2011.
Compartilhar