WEB

WEB

Usabilidade

Por que estudar IHC ?

WEB

em janeiro de 2000 - 10 milhões de sites 1,6 bilhão de páginas 72 milhões de servidores 275 milhões de usuários navegando a cada 24hs

3,3 milhões de novas páginas 123 000 novos usuários

dezembro de 2000 - 25 milhões de sites previsão para fim de 2002 - 100 milhões de

sites


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

com a enorme oferta de alternativas usuários tem uma notável impaciência e insistência em gratificação imediata


WEB

usabilidade assume uma importância ímpar na economia da Internet no design de produtos e de software

tradicionais, usuários pagam antes e experimentam a usabilidade depois

na WEB experimentam a usabilidade antes e pagam depois


Usabilidade na WEB- Ex.: IBM


O caso IBM

recurso mais popular em seu site função de busca

as pessoas não conseguiam descobrir como navegar segundo recurso mais popular

botão de ajuda. solução

amplo processo de redesign, envolvendo centenas de pessoas e milhões de dólares.

Resultado na primeira semana depois do redesign em fevereiro de 1999

o uso do botão de ajuda caiu 84% as vendas aumentaram 400%.


Usabilidade na WEB

Clareza na arquitetura da informação essencial que o usuário consiga discernir o

que é prioritário e o que é secundário no site. Um bom arranjo da informação

usuários sempre terão dificuldades em encontrar o que procuram

devem ser ajudados prover um senso de como a informação está

estruturada e localizada. uma das alternativas adotadas em alguns sites,

é prover um mapa do site


Usabilidade na WEB

Facilidade de navegação Uma máxima é que o usuário deveria

conseguir acessar a informação desejada no máximo em três cliques

Simplicidade Quem navega quer encontrar o mais

rapidamente possível o objetivo da busca. a pirotecnia deve ser evitada, dando ao usuário

paz e tranquilidade para que possa analisar a informação


Simplicidade

Onde estou ? O que este site faz ?


Simplicidade


Usabilidade na WEB

A relevância do conteúdo Sempre que questionados sobre sites,

usuários se referem a qualidade e relevância do conteúdo

Um bom texto para essa mídia o mais conciso e objetivo possível não promocional ou publicitário leitores online imprimem textos

necessitam páginas bem curtas informação secundária deixada para páginas de

suporte


Usabilidade na WEB

Manter a consistência Quando as coisas acontecem sempre do

mesmo jeito, os usuários não precisam se preocupar a respeito do que irá acontecer

um Website deve ser gerenciado como um projeto único de interface com o usuário


Usabilidade na WEB

Tempo suportável tempo de carga das páginas deve ser curto 10 segundos é o máximo de tempo antes que as

pessoas percam o interesse na Web os usuários já têm uma baixa expectativa

limite pode aumentar para 15 segundos

Foco nos usuários 'sair do caminho'

para que o usuário possa fazer o que quer da maneira mais rápida possível.


Usabilidade na WEB - resumo

Clareza na arquitetura da informação Facilidade de navegação Simplicidade A relevância do conteúdo Manter a consistência Tempo suportável Foco nos usuários


Amazon (1995)


Amazon (2000)


UOL 1995

A Folha Web, site da Folha de S. Paulo, no ar em1995, trazia reportagens selecionadas do jornal impresso e a charge do dia


UOL Futuro

Barra de navegação principal verticalizada à esquerda

Barra superior de ajuste do navegador

Nomes das estações no miolo da página

Um dos estudos para a homepage do futuroUniverso Online, ainda com o nome de trabalhopara preservar o sigilo



UOL – 28.04.1996


UOL - agosto de 1996


UOL ( junção com Abril)

Em dezembro de 1996, a home page ficoumais quente: foi aberto espaço para imagens


UOL – 04.1999No aniversário de 3 anos do UOL, em abril de 1999,a home page do UOL mudou para espelhar ocrescimento do site. Os assinantes votaram eajudaram a escolher a nova cara do UOL


UOL - 1999

Em outubro de 1999, entra no ar a nova homecom a cor escolhida pelo público.


UOL 2002


USP 2002


UNICAMP - 2002

WEB

Projeto de Navegação


Navigation Design

Mais que botões e barras de índice Estudo do movimento no espaço Interação entre objetivos do usuário e

meios de como facilita-los Como remover barreiras? Como construir estradas?


Navegação (site de venda de livros)

Questões gerais: Onde estou? Para onde posso ir? Como eu cheguei aqui? Como posso voltar para o lugar de onde

sai?



Questões “purpose-oriented” Como eu sei que minhas informações financeiras

estão seguras? Como posso proteger minha privacidade? Como posso encontrar o item que procuro? E se eu não estiver seguro do que exatamente quero? Como posso fazer um preview de produtos para ver se

me servem? E se eu tiver problemas posso devolver?



Questões “product or audience-oriented” Como posso encontrar livros de um

determinado autor? Como posso encontrar livros que sejam

similares aos que eu gosto? Como posso saber o nível de leitura de um

livro? Como conseguir críticas ou recomendações? Onde posso encontrar informações sobre

novas edições ou prêmios?


Dez qualidades para uma navegação de sucesso1. Poder ser facilmente aprendida2. Ser consistente3. Prover feedback4. Aparecer dentro do contexto5. Oferecer alternativas6. Economizar ação e tempo7. Prover mensagens visuais claras 8. Usar rótulos claros e compreensíveis9. Ser apropriada para os propósitos do site10. Atender a comportamentos e objetivos do usuário


Dez qualidades para uma navegação de sucesso1. Poder ser facilmente aprendida

Conteúdo pode ser misterioso, mas chegar a ele não

Sem curva de aprendizagem Tornar o site transparente e óbvio


Dez qualidades para uma navegação de sucesso2. Consistência

Elementos navegacionais sempre presentes, no mesmo lugar e com a mesma aparência

Erro comum – desaparecer com elementos navegacionais do menu quando o usuário está na página correspondente

Se necessária a quebra por exigência de conteúdo – criar subsites


Dez qualidades para uma navegação de sucesso3.Prover feedback

Somos condicionados a esperar reações de coisas com as quais interagimos

Toda nossa interação com o ambiente é baseada na avaliação de feedbacks

Criar controles reativos e prover informação sobre localização

Rollovers or mouseovers Usar flechas ou apontadores para mostrar a

posição corrente http://www.nied.unicamp.br



Dez qualidades para uma navegação de sucesso4. Aparecer dentro do contexto

O usuário precisa ver possíveis caminhos para tomar decisões sobre movimento

Navegação deve estar sempre presente quando necessária não deixar para botões do browser

Backlinks e forwardlinks and startlinks back to / go to / start ser descritivo

Entender onde as pessoas estarão quando terminarem de fazer alguma coisa (p. ex.: leitura de um grande artigo)


Dez qualidades para uma navegação de sucesso5. Oferecer alternativas

Usuários são diferentes tanto em equipamentos computacionais que usam como em preferências

Mapas de sites, busca, sites de menor performance, etc.

Acessibilidade Importante tentar atender as necessidades de uma

pessoa cega bem como de um usuário que não tem um determinado plug-in

Criar alternativa simplificada do site Ex.: o site da Amazon tem versão somente textual.


Dez qualidades para uma navegação de sucesso6.Economizar ação e tempo

Nós ainda estamos aqui?! sindrome a ser evitada

Enorme número de passos ou enormes formulários são sérias barreiras navegacionais

Prover atalhos de navegação Mapa do site, index, lista de conteúdo, menus,

etc. são essenciais para sites complexos Estruturas recursivas

http://www.computers.com




Dez qualidades para uma navegação de sucesso7.Prover mensagens visuais claras

Estabelecer hierarquias visuais Movimento, cor, posição etc. Estabelecer um vocabulário visual

Padrões de WEB?!


http://www.dynamicdiagrams.com/





Dez qualidades para uma navegação de sucesso8. Usar rótulos claros e compreensíveis

Boa rotulagem é mais uma arte que uma ciência Baseado no senso comum e na sensibilidade do

usuário e no contexto Ex.: em um site de restaurante o rótulo map site é

associado com o quê? Links como parte de uma história Diferença sutil entre mistério e frustração Economizar sempre que possível (departamento de

administração de vendas X vendas)


Dez qualidades para uma navegação de sucesso9.Ser apropriada para os propósitos do site

Um site de vendas não necessariamente tem que ter as mesmas soluções de navegação de um site de informação

Comprar um livro é bem diferente de conseguir uma informação sobre um virus!


Dez qualidades para uma navegação de sucesso10. Suportar objetivos e comportamento

dos usuários Chave do sucesso de qualquer design Como conhecer de que forma os usuários vão

agir, pensar e o que realmente querem? Cenários, observação etnográfica, entrevistas,

etc. Teste de usuário

Ex.: recommendation center da Amazon http;//www.amazon.com



Sites exemplo

Educação DigitalThink

http://www.digitalthink.com/ National Geographic: Kids

http://www.nationalgeographic.com/kids/ Bibl. Virtual do estudante brasileiro

http://www.bibvirt.futuro.usp.br


Sites Exemplo

Informação MSNBC

http://www.msnbc.com Lycos

http://www.lycos.com Computers.com

http://www.computers.com UOl

http://www.uol.com.br


Sites exemplo

Comunidade SceneServer

http://www.dkaweb.com/sceneServer/ FireFly

http://www.firefly.com Café Utne

http://www.utne.com

WEB

Futuro


Próximos 5 anos

Crescimento dos sites em fator de 20 10 milhões de sites em 1999 200 milhoes de sites em 2005

Páginas 1 bilhão em 1999 50 bilhões em 2005

Usuários 200 milhões em 2000

No Brasil : 10.870.896 500 milhões em 2005 1 bilhão em 2010


Information Appliances

Acesso móvel “Anyone,anywhere, anytime:connected”

Pequenos dispositivos de acesso Páginas Web terão que funcionar em

diferentes tamanhos de displays Desafio atual: celulares


Futuro

WebTV Desde 1996 – um grande fracasso

Qualidade dos monitores Design inadequado para TV

Morte dos Web browsers Nenhum grande progresso desde 1993 Navegação como mecanismo universal de suporte

Hard disk, intranets, internet,… Mecanismo universal de busca !?

Dado local e dado da Internet


Futuro

Crescimento lendo da largura de banda Nos últimos 15 anos cresceu somente 50%

Empresas de telecomunicacões são conservadoras Usuários são relutantes em investir dinheiro em uma banda

mais larga Grande crescimento de novos usuários que não adotam

banda larga de inicio Design minimalista

Metáforas para Web TV

Web – user driven TV – broadcasting mass medium

TV + Internet = adiciona valor aos telespectadores sem realizar o verdadeiro potencial da Web


Futuro

Metáfora para Web Telefone

é um meio 1-to-1 Por isso marketing tipo TV não funciona

Telemarketing X spam A ação é iniciada pelo usuário Todo mundo pode publicar


Futuro

Reestruturação do espaço de midia Adeus aos jornais! Por que a midia tradicional é tão separada

Por que temos que escolher entre: Ver cenas de um evento na TV Ler a história completa nos jornais Ler uma análise mais profunda nas revistas

Limitações da Web para integrar: Largura de banda torna vídeo impossivel e limita gráficos,

animações e outros formatos não textuais Baixa resolução dos monitores de computador Browsers e mecanismos de busca mal projetados

Problemas que estarão resolvidos nos próximos 5 a 10 anos

2003 a 2008


Usabilidade, uma necessidade

Invenção de uma nova economia Negócios e modos de vida

Nós somos os construtores Usabilidade cresceu de importância

Usuários leais é o único valor verdadeiro da Internet Usabilidade é a competência central para a

sobrevivência na nova economia Não mais aceitar a opressão da tecnologia da

informação Defesa da humanidade na era das máquinas

Documents

WEB