usabilidade
DESCRIPTION
Trabalho sobre usabilidade para a universidade de Aveiro.TRANSCRIPT
UsabilidadeTecnologias Dinâmicas para a Internet
1
2
Grupo 5
Universidade de Aveiro 09
Fábio Santos | 38156Jessica Simões | 38732Karolina Gonzalez | 48513Ricardo Marques | 35725
USABILIDADE = FACILIDADE DE USO
Facilidade de uso é obter afirmações...
...e não interrogações!
Boa Navegabilidade.
Alcance de objectivos de forma
eficaz, eficiente e simples.
Princípios Usabilidade
Aprendizagem | Eficiência | Memorização | Erros | Satisfação
REGRAS
Clareza na arquitectura da informação
Facilidade de navegação
Simplicidade
A relevância do conteúdo
Coerência
Rapidez
Foco na experiência do usuário
QUESTÕES
Questões com foco no utilizador
(o que um utilizador não deverá perguntar)
Questões com foco no criador
Missão do site
Público Alvo
Vantagens | Desvantagens
Vantagens
Satisfaz o utilizador que visite o site
Permite que o utilizador encontre o que procura (ler, comprar, jogar, etc.)
Aquisição de fealdade do utilizador ao site
Desvantagens
Não ajuda o utilizador na procura de informação;
Causa frustração ao utilizador por não obter o que procura;
Perda do utilizador para a concorrência;
Avaliação de Usabilidade
Aspectos
(1) Avaliar a extensão das funcionalidades de um sistema
(2) Avaliar os efeitos da interface no utilizador
(3) Identificar eventuais problemas específicos no sistema
Dix et al.’s (1998, pp. 406-407)
Metodologias
Categorização dos métodos e testes de usabilidade
- Dix et al. (1998, pp. 405-435) apresentam uma divisão hierárquica;
- Ben Shneiderman (1998, pp. 124-151) apresenta uma visão mais linear;
- Apesar desta diferença, ambos Dix et al. e Shneiderman discutem técnicas e métodos semelhantes.
Heurísticas
(1) Viabilidade do estado do sistema
(2) Consistência entre o sistema e o mundo real
(3) Controle e liberdade para o usuário
(4) Consistência e padrões
(5) Prevenção de erros
(6) Reconhecimento em vez de lembrança
(7) Flexibilidade e eficiência de uso
(8) Desenho estético e minimalista
(9) Auxílio no reconhecimento, no diagnóstico e na recuperação de erros
(10) Ajuda e documentação
COERÊNCIA DA NAVEGAÇÃO
PRINCIPIOS BÁSICOS
• Apresentar claramente a navegação principal ou global;
• Acesso claro e rápido para a página inicial ;
• Explorar a utilização de cabeçalhos e rodapés;
• Usar com cautela gráficos como parte da navegação;
• Manter a consistência na selecção de cores atribuídas às ligas e
páginas visitadas;
• Ajudar o utilizador quanto à sua localização no site (breadcrumb);
DESENHO DE INTERFACE
CONVENÇÕES
WIREFRAME
DIRECTIVAS
BOAS VINDAS
• Não oferecer "Boas Vindas" ou "Bem-Vindo" no site;
• Utilizar o espaço de "Boas Vindas"/"Bem-Vindo" para publicar um slogan ou logótipo referente ao site;
INFORMAR OBJECTIVO DO SITE
CONTEÚDO
ARQUIVO / ACESSO A CONTEÚDO ANTERIOR
LINKS
NAVEGAÇÃO
PESQUISA
ATALHOS
IMAGENS E ANIMAÇÕES - I
IMAGENS E ANIMAÇÕES - II
DESIGN GRÁFICO - I
DESIGN GRÁFICO - II
DESIGN GRÁFICO - III
COMPONENTES DE INTERFACE COM O UTILIZADOR
TÍTULOS DE JANELAS
URL’S – BONS EXEMPLOS
URL’S – MAUS EXEMPLOS
JANELAS POP-UP / JANELAS INTERMÉDIAS- III
• Evitar Janelas intermediárias aquando o digitar do URL pelo utilizador;
• O URL deve redireccionar o utilizador para a página inerente ao URL digitado;
• Evitar Janelas de Pop-up (omitem a homepage, são confundidas com publicidade, dificultam a navegação a utilizadores inexperientes ou com dificuldades motoras);
PUBLICIDADE - I
COMUNICAR PROBLEMAS / EMERGÊNCIAS
ACTUALIZAÇÃO DE PÁGINAS
• Não actualizar a homepage automaticamente (provoca a perda de atenção e interesse do utilizador caso este esteja a visualizar algum conteúdo no momento de actualização);
• Aquando de uma actualização, não modificar conteúdo que não foi modificado, actualizar apenas acrescentando novo conteúdo ou aquele que foi modificado (ex: actualizações de notícias num jornal online);
OBTENÇÃO DE DADOS DO CLIENTE
• Aquando de um registo explicar ao cliente as suas vantagens;
• Não fornecer links de registo na homepage;
EXEMPLOS A EVITAR
53
Boas práticas por linguagem
Inovar SIM!
Mas com modos…
54
Resultado: Backspace
Passados10segundos
Loading… Boring
55
Dicas
Saber o que o utilizador quer
Definir bem objectivo do site
Não descuidar na usabilidade
56
Organização da informação
57
Organização da informação
Dividir a informação em unidades lógicas.
Estabelecer uma hierarquia por ordem de importância e
generalidade.
Usar esta hierarquia para estabelecer relações entre trecho de
informação
58
Organização da informação
Linear
59
Organização da informação
hierarquicamente
60
Organização da informação
Poli-hierarquicamente
61
Organização da informação
Em rede
62
Disposição dos conteúdos
63
Disposição dos conteúdos
Alfabética
64
Disposição dos conteúdos
Cronológica
65
Disposição dos conteúdos
Geográfica
66
Disposição dos conteúdos
Miscelânea
67
Disposição dos conteúdos
Tarefa
68
Disposição dos conteúdos
Público-alvo
69
Disposição dos conteúdos
Tag Cloud
70
Usabilidade Conteúdos
71
O título é o elemento mais importante!
72
Um bom título:
Rico e conciso
Deverá conter as palavras-chave
Confirmar a informação que se segue
Não revelar tudo
73
O sumário é o segundo elemento mais importante!
74
O sumário deve:
Conter os principais pontos
Não fornecer todas as informações
75
TextosPouco texto
Colunas estreitas
Espaços em branco
76
Divulgação de conteúdos
77
1. Media Display e Rich Media
2. Search Engine Marketing
3. Pay-Per-Click
4. E-mail Marketing
5. Redes sociais virtuais
6. Link Building
7. Custo por Mil Impressões
8. Custo por Acção
9. Media tradicionais
78
1. Media Display e Rich Media
São constituídos por banners .
Constituídos por uma mensagem e um estímulo para clicar.
79
2. Search Engine Marketing (SEM)
Tem como objectivo obter o melhor posicionamento dos
Websites nos resultados naturais ou orgânicos dos motores de pesquisa.
80
2. Search Engine Marketing (SEM)
Boas práticas:
Título sucinto e coerente com o conteúdo
Palavra-chave que melhor caracteriza o site
Palavras-chave mais específicas obtém um melhor posicionamento
Uma boa estratégia de SEO
81
3. Pay-Per-Click (PPC)
O anunciante apenas paga por cada clique efectuado no anúncio.
VantagensVisitantes qualificados para o WebsiteResultados imediatosFácil e rápido de implementarA campanha segmentada ao público-alvo
DesvantagensAs fraudes! Podem acontecer quando uma pessoa ou um script automático imitam um utilizador normal da Web e o anúncio é clicado vezes sem conta
82
4. Email Marketing
Marketing online directo para comunicação comercial ou campanhas de sensibilização.
Boas práticas-Personalização do e-mail
-Medir resultados, calendarizar as acções efectuadas
-Segmentar muito bem o público-alvo
-Informação bastante clara e objectiva acima de tudo
-Corrigir erros que ocorram (e-mails considerados spam, e-mails inválidos, utilizadores não identificados, etc.)
83
5. Redes sociais virtuaisTwitter
Twittad
FacebookFacebook Ads
YoutubeBrand ChannelMasthead Video Banner
Boas práticasPlanos diferentes para cada rede virtualCriar vinculações marca-cliente
84
6. Link Building
Boas práticasEscrever e distribuir artigos originais na Web
Escrever e publicar comunicados de imprensa na Web
Ter o site bem optimizado
85
7. Custo por Mil Impressões
O utilizador paga por 1000 vezes que o anúncio for
publicado independentemente de ser clicado ou não
8. Custo por AcçãoO utilizador paga quando o utilizador cumpre uma tarefa pré definida, como por exemplo a conclusão do formulário de venda.
86
9. Media Tradicionais
Sentido da comunicação: emissor receptorReceptor passivoEnvolve gastos elevados
Media OnlineSentido da comunicação: emissor receptor
Receptor activoPode não envolver gastos
Comunicação e informação em tempo realSelectividade
87
Web semântica 3.0 máquina inteligente
88
Toda a linguagem tem sintaxe e semântica
89
Sintaxe estuda a gramática
90
Semântica estuda o significado
91
O Problema
92
Páginas web são feitas em html
93
HTML trata da estrutura(sintaxe) da informação e não da semântica!
94
Computadores
comunicam por números
101010101101010110100100101010101010100101001010101010011001010010111110110101110101010100110010111110001010011101010101001010
95
Pessoas comunicam
por palavras
Bidé corvina pes mac windows frango chuveiro aroma catinga amor odeio paixão comer chorar jogar brincar ajax flash comunicar aritmética matemática português
96
Se os computadores entenderem as letras por trás dos números
97
Poderão “entender” o que nos interessa
Poderão ajudar-nos a encontrar o que queremos
Maior Usabilidade
98
99
Meta-informação
100
Estruturas de dados sobre os próprios dados, uma breve descrição do conteúdo
da página
101
Dicas
Tags simples e concisas
Prioridade às palavras-chave mais importantes
Evite o uso da meta tag REFRESH
Não abuse das meta tags
Para o Google, elas não existem
102
MICROFORMATOS
103
Simples convenções para agregar a semântica ao HTML
104
Vantagens
Providenciam uma maneira estandardizada e fácil de catalogar os conteúdos
Por ser open source, facilitam o desenvolvimento de ferramentas
Ligação entre o conteúdo online e aplicações como o Outlook ou iCal
Dotam o conteúdo de significado para as máquinas
Poupam tempo e esforço ao utilizador, logo aumentam a usabilidade
105
EXEMPLOS
HcardhCalendarGeoEntre outros
106
OBRIGADO PELA ATENÇÃO