usabilidade com paper prototype

USABILIDADE COM PAPER PROTOTYPE

Prof. Esp. Francisco GamaIF - Sertão PE - francisco.gama@ifsertao-pe.edu.br

Prof. Esp. Eudis OliveiraIF - Sertão PE - eudis.oliveira@ifsertao-pe.edu.br

Professores

Francisco Gama, Francisco Gama, especialista em Engenharia de Software, professor do Instituto Federal do Sertão Pernambucano, campus Floresta e Engenheiro de Software da STI Fábrica de Software.

Eudis Oliveira TeixeiraEudis Oliveira Teixeira, especialista em Engenharia de Software, professor e coordenador dos cursos de Informática do Instituto Federal de Educação Ciência e Tecnologia – IF Sertão - PE, Campus Petrolina.

Minicurso

Usabilidade e Prototipação em Papel

Este minicurso mostra a importância do design de Interação para o desenvolvimento de software centrado no usuário, principalmente o uso de técnicas de usabilidade e prototipação em papel (paper prototype). Dentre os temas abordados teremos: Conceito e benefícios da usabilidade, ciclo de vida para um projeto com usabilidade, teste de usabilidade, prototipação rápida em papel, exemplos, ferramentas e teste de protótipos.

Primeiro Help Desk da História

Alguns não precisam de Help Desk

http://sorisomail.comhttp://www.mdblogger.com.br

E com o tempo...

http://sorisomail.com

E com o tempo...

http://sorisomail.comhttp://www.mdblogger.com.br

E com o tempo...

http://www.mdblogger.com.br

E os que não tem tanta facilidade?

Maior interação facilitaria?

www.vol.com.br

Acesso aos conteúdos

Garantir o acesso aos conteúdos não passa por ter os conteúdos on-line e um servidor.

Existem barreiras funcionais e estruturais que podem dificultar o acesso aos mesmos.

Valor do Acesso

Maior Usabilidade

Maior o Valor

Acesso aos conteúdos

Quanto mais fechado o acesso à informação, menor será o número de utilizadores que consegue tirar partido da informação, menor a "exposição" dessa informação e por consequência menor o valor da mesma.

Acesso aos conteúdos

Liquidificador: está em “Eletrodoméstico” ou “Eletroportáteis”?Walkman: está em “Eletrônicos” ou “Eletroportáteis”?Aparelho de DVD: está em “DVDs”“Eletrônicos”?

O que é UD? O que tem dentro de UD?

Acesso aos conteúdos

Acesso aos conteúdos

O poder da Usabilidade na Web

Em 1998 cerca de 3 bilhões de dólares deixaram de ser ganhos na WEB norte americana por causa de designs mal feitos;

Em 2001 os Websites mais conhecidos de comércio eletrônico perderam 65% de suas vendas; (cerca de 15 bilhões de dólares devido o “carrinho de compras” dos usuários não chegar ao seu destino final (pagamento);

Em sites de comércio eletrônicos a interfaceprecisa compensar a ausência do vendedor;

O poder da Usabilidade na Web

No desenho de produtos ou de software tradicionais o consumidor paga antes e tem experiência com a usabilidade depois;

O Poder É DO CLIENTE: Quem clica no mouse decide tudo. Todos os concorrentes do mundo estão a um simples clique do mouse;

Na Web o usuário experimenta a usabilidade

antes e compra depois.

O que é USABILIDADE?

“Usabilidade é a medida na qual um produto pode ser usado por usuários específicos para alcançar objetivos específicos com eficácia, eficiência e eficácia, eficiência e satisfaçãosatisfação em um contexto específico de uso.”

ISO 9241-11

O que é USABILIDADE?

O termo usabilidade é utilizado para medir a qualidade das interfaces. Está relacionada com a facilidade de aprendizado, eficiência, memorização, tolerância a erros e a satisfação do usuário (Nielsen, 1993).

Assegurar que algo funcione bem: que uma pessoa com habilidade e experiência médias (ou mesmo abaixo da média) consiga usar este “algo” – seja um site, um avião de caça ou uma porta giratória – de acordo com o propósito dela, sem ficar desesperadamente frustrado. (Krug, 2001).

Tornar mais fácil de usar ?”

Atributos associados a Usabilidade

Existem vários atributos e metas (critérios) associados à usabilidade e cada software busca enfatizar os que são mais importantes para seus usuários.

Atributos da Usabilidade (NIELSON,1993):

Facilidade de Aprendizagem (Interação logo no primeiro momento);

Eficiência de uso (Grau de produtividade atingido pelo usuário depois que aprendeu a utilizar o sistema;

Facilidade de memorização (Utilizar o sistema novamente após um tempo);

Atributos associados a Usabilidade

Atributos da Usabilidade (NIELSON,1993):

Baixa taxa de erros

(Medida do quando o usuário pode ser induzido ao erro pelo sistema e o quando pode se recuperar do mesmo);

Satisfação subjetiva

(Medida quando o usuário de sente feliz de esta utilizando o sistema).

Atributos associados a Usabilidade

Atributos da Usabilidade (NIELSON,1993):

Flexibilidade

(possibilidade de acrescentar, modificar funções, medindo a criatividade do sistema de realizar novas tarefas);

Produtividade

(capacidade de permitir que o usuário seja mais produtivo com a utilização do sistema).

Atributos associados a Usabilidade

Exemplos de critérios de usabilidade

Tempo para completar a tarefa (eficiência); Tempo para aprender a tarefa; Número de erros cometidos ao realizar a

tarefa num dado tempo (memorability).

Criação de sistemas que sejam:

satisfatórios motivadores

agradáveis Esteticamente apreciáveis

divertidos Incentivadores de criatividade

interessantes compensadores

úteis Emocionalmente adequados

Metas de usabilidade e metas decorrentes da experiência do usuário

Metas de usabilidade e metas decorrentes da experiência do usuário

Metas de Usabilidade → São fundamentais para o design da interação e são operacionalizados por meio de critérios diferentes.

Metas decorrentes da experiência do usuário → são subjetivas e menos claramente definidas.

Obs. Às vezes dependendo do objetivo do projeto essas metas são contrariadas. É preciso reconhecer o equilíbrio entre as duas metas, levando em consideração a necessidade do usuário.

Ex_1: Prego eletrônico (eficiente, agradável e divertido)

Ex_2: Sistema de controle de processos (seguro e divertido)

ATIVIDADE - USABILIDADE

Apresentamos alguns produtos interativos. Quais você acha que sejam as metas de usabilidade e as decorrentes da experiência do usuário em cada um deles.

1. um dispositivo portátil que permite a crianças comunicar-se umas com as outras e brincar com jogos colaborativos.

2. um sistema de vídeo e computador para conferências que permite aos estudantes aprender em casa.

3. uma aplicação da Internet que permite ao público em geral acessar seu prontuário médico através de uma TV interativa.

4. um sistema de CAD para arquitetos e engenheiros.

5. uma comunidade on-line que fornece suporte a pessoas que recentemente tiveram amigos e familiares falecidos.

ATIVIDADE - USABILIDADE

Comentário: Atividade

1. Esse dispositivo colaborativo deve ser de uso simples, eficaz, eficiente, fácil de aprender a utilizar, engraçado e interessante.

2. Esse dispositivo para aprendizagem deve ser fácil de entender e de utilizar, eficaz, motivador e compensador.

3. Esse sistema pessoal deve ser seguro, fácil de usar e de lembrar como usar, eficaz e eficiente.

4. Essa ferramenta precisa ser fácil de aprender, fácil de lembrar como usar, ter uma boa utilidade, ser segura, eficiente, eficaz, fornecer suporte à criatividade e ser esteticamente agradável.

5. Esse sistema dever ser fácil de aprender, fácil de usar, motivador, emocionalmente adequado e compensador.

Princípios de Usabilidade e design

Uma outra forma de aprender e conceituar sobre usabilidade é através dos princípios de design.

Aspectos mais comuns:

1. Visibilidade

2. Feedback

3. Restrições

4. Simplicidade

Princípios de Usabilidade e design

1. Visibilidade → Princípio que mostra de imediato o procedimento a ser realizado por usuários mediante um produto interativo. Quanto mais visíveis forem as funções, mais os usuários saberão como agir.

Ex: Ícones, Botões em Veículos

2. Feedback → Associado totalmente ao conceito de visibilidade. Refere-se ao retorno de informações a respeito de que ação foi feita e do que foi realizado, permitindo ao usuário continuar com a atividade.

Tipos de feedback para o design da interação:

Áudio, Tátil, Verbal, Visual ou suas combinações.

Princípios de Usabilidade e design

3. Restrições → Utilizado para determinar as formas de delimitar o tipo de intervenção que pode ocorrer em um determinado momento.

Podem ser:

Física → forma como os objetos físicos restringem os movimentos das coisas. Ex: Instalação de um HD, Tomadas externas PC, Pré-requisitos Hardware.

Lógica → Dependem do entendimento como as pessoas tem sobre a maneira como o mundo funciona. Ex: Aviso de chegada de mensagens, desativar opções do menu.

Cultural → No âmbito das convenções aprendidas. Ex: Uso do vermelho para alerta, sinais de áudio, uso de janelas para representação de informações.

Princípios de Usabilidade e design

4. Simplicidade → Nome também dado a usabilidade. Criação de soluções simples e originais. Às vezes “Complicar o simples é fácil”

Nielsen propõe que os designers analisem todos os elementos do seu projeto e os removam um a um. Caso ele funcione bem sem um desses elementos, elimine-o.

ATIVIDADE - USABILIDADE

Tarefa:

Colocando em prática alguns conceitos de usabilidade. O objetivo é permitir que você defina as metas decorrentes da experiência do usuário e as metas de usabilidade e que utilize princípios de design e usabilidade para avaliar a usabilidade de um produto interativo.

Encontre um dispositivo (p. ex: notebook, celular, etc).

1. Das suas primeiras impressões, escreva a que primeiro vem a sua mente, a respeito do que é bom ou ruim na maneira como o dispositivo funciona. Liste (i) sua funcionalidade e (ii) variedade de tarefas que um usuário típico poderia querer realizar com o dispositivo. A funcionalidade é maior, igual ou menor do que a desejada pelo usuário?

ATIVIDADE - USABILIDADE

2. Compile um conjunto de metas de usabilidade e de metas decorrentes da experiência com o usuário as quais você considera que seriam mais úteis na avaliação do dispositivo. Decida quais são os mais importantes e explique por quê.

3. Transforme as principais metas de usabilidade e decorrentes da experiência do usuário que você selecionou em duas ou três perguntas. Use-as para avaliar se o dispositivo funciona bem (p. ex.: Metas de usabilidade. Que mecanismos específicos foram utilizados para garantir segurança? É fácil aprender a utilizá-los? Metas decorrentes da experiência do usuário: É divertido utilizar os mecanismos? O usuário frusta-se facilmente? Se sim, por quê?). Discuta possíveis melhorias para a interface, baseando-se em sua avaliação de usabilidade.

Como é que nunca me ocorreu essa ideia?

Como é que nunca me ocorreu essa ideia?

Como é que nunca me ocorreu essa ideia?

Como é que nunca me ocorreu essa ideia?

Como é que nunca me ocorreu essa ideia?

Tá difícil ...

http://tadificil.wordpress.com/

Ciclo de Vida para Projeto com Usabilidade

início conhecer usuários e suas tarefas

prototipação

avaliação de usabilidade

protótipo em trabalho

produto final

Paper Prototype

O que são protótipos em papel?

Mock-up ou representações de um design. É uma maneira para avaliar um design através

de um teste com usuários; Ferramenta de comunicação para facilitar o

entendimento de um design; São feitos através de:

Esquemas feitos a mão; Foto-copias; Recortes de pedaços de papel Uma combinação criativa de qualquer um

dos itens acima

Porque usar protótipos em papel?

Explorar – Permite testar facilmente diferentes idéias;

Comunicar – Apresentar as idéias de forma que pode ser entendida facilmente ;

Colaborar- Facilita que todo time de design construa e avalie o protótipo;

Validar – Determina a eficiência dos elementos de design e do fluxo de navegação.

Quando usar protótipos em papel?

Nos primeiros processos de design, porque: As pessoas são menos resistentes a

mudança; Foi investido pouco tempo e recursos no

projeto; Ainda não se tem clareza de qual a melhor

solução.

Vantagens dos protótipos em papel

Requerem poucos recursos para serem construídos;

Construídos com ferramentas simples , que não requerem habilidade especifica;

Permite que as ideias sejam testadas nos primeiros estágios do processo de design;

São construídos rapidamente; Identifica os maiores problemas de usabilidade

de um projeto.

Passos para criar um protótipos em papel

1.Identificar o que prototipar;

2.Criar o protótipo;

3.Planejar o teste

4.Conduzir o teste com o usuário;

5.Analisar os resultados;

6.Modificar o design;

7.Refazer o teste.

1 – Identificando o que prototipar

Defina as tarefas mais importantes: Tarefas mais comuns ou típicas; Tarefas mais críticas; Tarefas com maior impacto no

negócio. Crie um protótipo que permita

executar estas tarefas

Quais elementos incluir no protótipo em Papel?

O protótipo não precisa ser completo; Considere as 3 tarefas prioritárias do

projeto e faça um protótipo para testá-las;

Comece com conceitos simples e depois evolua para protótipos mais abrangentes ou profundos

2 – Criando o Protótipo

Fazer um brainstorming sobre as idéias e conceitos do projeto;

Formar times com pessoas de diferentes áreas da empresa (máximo de 6 pessoas); Facilita o entendimento e divide a

responsabilidade; Reduz a competição e conflitos; Existe uma base de conhecimento maior; Gera idéias mais criativas.

Ferramentas necessárias

Papel; Canetas coloridas; Tesoura; Post-it; Durex; Quaisquer outro material de escritório.

MUITA CRIATIVIDADE !

Exemplos de como criar protótipos

Exemplos de como criar protótipos

Exemplos de como criar protótipos

Exemplos de como criar protótipos

Exemplos de como criar protótipos

Protótipos em papel 3D

Destina a representar um hardware;

Avalia a interação do aparelho físico: Telefones celulares; Caixas eletrônicos; Aparelhos de dvd;

3 – Planejando o teste

Desenvolva um script com as tarefas que se deseja avaliar;

Teste o script com alguns usuários;Recrute usuários para o teste definitivo;

Os usuários devem representar os perfis do público alvo;

Teste com um pequeno número de usuários (de 4 a 6 usuários);

Escolha o local do teste:Formal: Laboratórios de usabilidade com salas

com espelho falso. Os observadores ficam atrás do espelho;

Informal: Sala de reunião com privacidade. Os observadores ficam na mesma sala

4 – Conduzindo o teste com o usuário

O teste com protótipo em papel é semelhante a qualquer outro teste de usabilidade de produto.

Peça para o usuário pensar em voz alta;

Deixe o usuário interagir com o produto e realizar as tarefas;

Pessoas envolvidas com o teste

Normalmente quatro pessoas são envolvidas na realização do teste:

Facilitador;A pessoa que representa o “computador”;O Usuário;Os observadores.

Facilitador

É usualmente um especialista em usabilidade;Auxilia o usuário a interagir com o protótipo

Explica ao usuário a que se destina o teste;Informar ao usuário que o que sendo

testado é o sistema, não o usuário;Passa ao usuário as instruções das tarefas

a realizar; Acompanha e intervem quando necessário;

Observa e anota como o usuário realizou a tarefa;

Senta-se próximo ao usuário.

“Computador”

Deve ser uma pessoa familiarizada com o protótipo;

Apresenta as telas conforme o usuário interage com o protótipo;

Deve sentar-se de frente ao usuário;Dicas:

Deve ter um postura neutra e quieta durante toda a sessão de teste;

Manter uma linguagem corporal neutra. Não manifestar emoções;

Manter as demais folhas do protótipo fora do alcance da visão do usuário;

Manter a mesma pessoa representando o computador em todas as sessões de teste.

O usuário

Interage com o protótipo;Tenta realizar as tarefas;Aponta os elementos que deseja clicar

(ex: botões, links);Preenche os campos de formulários;

Descreve a ação que vai executar em voz alta e explica o que está sentido com a experiência.

Os Observadores

Ter no máximo dois observadores na sala de teste;

Faça um rodízio de observadores caso tenha mais de dois;Para reduzir barulho, interrupção e distraçõesO usuário sente-se mais confortável com

poucos observadores;É difícil observar o teste com mais de dois

observadores;Compartilha suas anotações com o Facilitador ao

final de cada sessão;Devem ter cópias do protótipo.

Conduzindo o teste com o usuário

Antes de começar o teste o Facilitador deve apresentar o projeto ao usuário, explicando com ele deve interagir com o protótipo

Explicar de que se trata-se o projeto;Mencionar que o projeto está numa fase inicialExplicar que está se testando o sistema não o

usuário;Explicar ao usuário que ele deve executar as

tarefas como se estivesse em um computador;Explicar que o usuário deve apontar os

elementos que deseja clicar;Explicar que o usuário deve escrever nos

campos o que normalmente escreveria se estivesse usando o computador;

Conduzindo o teste com o usuário

Solicitar ao usuário que ele fale em voz alto o que está pensando sobre o sistema e o que pretende fazer;

Dar uma tarefa de cada vez ao usuário e ter certeza que ele a entendeu.

Dicas para condução do teste

Definir a área onde devem ficar as folhas do protótipoFazer uma marca na mesa para que as folhas

sejam sempre colocadas na mesma posição. Isto facilita a filmagem;

Manter o protótipo fora do alcance dos olhos do usuárioOs usuários facilmente se distraem ou desejam

antecipar suas ações. Por isto o protótipo deve ficar embaixo da mesa ou em outro lugar fora do alcance de seus olhos.

5 – Analisando os Resultados

Observar:Modelo mental

O protótipo corresponde ao modelo mental do usuário ?

Esquema de navegaçãoExistem caminhos que confundem o usuário?Observou-se caminhos onde o usuário se perdeu,

baixa confiança, respostas incorretas, desespero ?Conteúdo e linguagem

Está apropriado o uso das palavras e da linguagem ?

Existem links, termos e rótulos que não são claros ?

5 – Analisando os Resultados

Observar:

Agrupamento das informaçõesA arquitetura da informação está clara ?O menu está apropriado ?

Agrupe as observações semelhantes;Priorize as observações;

Quais são as mais importantes ou críticas ?Quais são viáveis ?

Faça um relatório;Recomenda-se fazer este relatório em até 24

horas após o final do teste.

6 – Modificando o Design

Considerar a viabilidade e o impacto das mudanças;Limitações técnicas;Tempo e dinheiro para implementar;

Realizar as mudanças do design que tenham o melhor custo/benefício.

7 – Refazendo o Teste

Testar as mudanças propostas e verificar se realmente forma efetiva

O teste deve ser feito com os mesmos usuários testados anteriormente e com novos usuário

Será que realmente funcionam?

Protótipos em papel realmente funcionam?

Sim, funcionam Porque a informalidade é contagiante:Os usuários sentem que podem ajudar a melhorar

o produto;Os protótipos são fáceis de serem manuseados

pelo usuário;Os protótipos indicam claramente que o projeto

ainda está numa fase de desenvolvimento; Porque são rápidos e baratos;Não é necessário nenhuma habilidade específica

ou ferramenta cara para desenvolver o protótipo; Porque permitem a colaboração de todo o time;Qualquer pessoa do time de projeto,

independente da sua formação entende e pode ajudar na construção do protótipo.

Teste de Usabilidade

Processo no qual usuários representativos avaliam o grau em que um produto se encontra em relação critérios específicos de usabilidade (RUB 94).

Servindo para diferentes propósitos: Medição de performance; Encontrar problemas de usabilidade; Recomendações no sentido de melhorias; Finalidade de comparar 2 ou mais produtos.

Teste de Usabilidade

Material Utilizado Durante a Sessão de Teste Roteiro do Avaliador:

Guia de orientação do Avaliador durante a sessão de teste;

Descreve o ambiente que será utilizado; As funções do avaliador; O perfil do participante; As tarefas do sistema; Procedimento; A lista dos formulários utilizados.

Teste de Usabilidade

Material Utilizado Durante a Sessão de Teste Questionário para Identificação do Perfil do

Participante :

Relaciona informações históricas sobre o participante auxiliando o entendimento de comportamento e performance ;

Utilizado pelo avaliador e desenvolvedores que irão avaliar os testes;

Dever ser facilmente entendido e preenchido; Deve ser curto (máximo 2 folhas); Baseado em informações que poderão afetar a

performance dos participantes.

Teste de Usabilidade

Material Utilizado Durante a Sessão de Teste Script de Orientação:

Comunicação lida aos participantes antes da realização dos testes ;

Descreve o que ira acontecer durante a sessão de testes possibilitando uma visão prévia aos participantes ;

Deve utilizar uma linguagem mais profissional porém amigável ;

Deve conter apresentação do que será realizado, qual objetivo, importância, o que se espera, descrição dos equipamento e recursos utilizados;

Teste de Usabilidade

Material Utilizado Durante a Sessão de Teste Lista de Tarefas:

Conhecido também como “Cenário das tarefas” ; É o trabalho que o usuário executa durante a

utilização do produto; Descreve os resultados finais que os participantes

devem atingir ; Estados do sistema quando a tarefa for inicial; Mensagens que o usuário verá quando executar a

tarefa.

Teste de Usabilidade

Material Utilizado Durante a Sessão de Teste Instrumentos para Coleta de Dados:

Registra os acontecimentos durantes os testes; Intenção de coletar dados concisos e confiantes; Podem ser dados sobre performance ou dados

preferenciais; Os dados coletados devem ser claros e

diretamente ligada as questões que necessitam ser resolvidas;

Teste de Usabilidade

Material Utilizado Durante a Sessão de Teste Avaliação do sistema pelo participante:

Aplicado após o teste; Objetivo de questionar e coletar informações

preferenciais dos participantes; Aprofundando o entendimento do produto,

apontando pontos fortes e pontos a melhorar baseados em problemas encontrados;

Importante formular perguntas em relação a pontos difíceis de serem detectados, tipo: sentimentos, opiniões e sugestões para melhoria.

Teste de Usabilidade

Material Utilizado Durante a Sessão de Teste Tópicos para questionamento :

Estruturar tópicos de questionamento do participante em relação aos testes realizados ;

Questionamentos que a natureza exata depende das circunstâncias encontradas durante cada sessão de testes ;

Referências

PREECE, J., ROGERS, I., SHARP, H. (2005) – Design de Interação. Além da Interação homem-computador. 1 ed. Bookman.

SOMMERVILLE, I. (2007) - Engenharia de Software. 8 ed. Addison Wesley

TEIXEIRA, E. O. (2009) – Estilos de Interação em EAD: Microblogging Twitter. Dissertação (Especialização em Engenharia de Software) Faculdade de Ciências Aplicadas e Sociais de Petrolina, FACAPE.