arquitetura de informação e usabilidade

Prof. Me. Marcelo TräselComunicação Digital em Publicidade e Propaganda

Famecos/PUCRS

Arquitetura e usabilidade

segunda-feira, 25 de outubro de 2010

Arquitetura de informação

• Projeto da estrutura de um site. É a base para a colocação do conteúdo depois e por isso deve ser planejado de acordo com o que uma previsão do material.

• Orienta a organização das páginas, navegação do usuário e hierarquia interna do site.


Interface

• Micros eram texto puro - DOS, monitores verdes

• Desktop (vulgo área de trabalho) - MacOS

• Janelas - Windows

• Hiperlinks - web, navegadores

• Flash/Vídeo - You Tube

• 3D - CAD, Second Life


Interface


Usabilidade

• Usabilidade é o modo como um navegador "degusta" a informação.

• Interface simples e até mesmo feinha não significa que o site não tenha boa usabilidade.

• “NÃO ME FAÇA PENSAR!” - Steve Krug


Usabilidade


Usabilidade

• Ser fácil de aprender

• Oferecer eficiência no uso

• Ter capacidade de guardar os caminhos realizados

• Não ter erros ou caminhos perdidos

• Dar satisfação para o leitor

Para Jakob Nielsen, um site deve:


Usabilidade

• Que site é esse?

• O que posso fazer aqui?

• Onde está a informação de que preciso?

• O que esse símbolo quer dizer?

O usuário jamais deve se perguntar:


Usabilidade

• Atendimento online

• Central de atendimento

• Meu cadastro

• Meus pedidos

• Busca

• Minhas compras


Usabilidade

• Marca no canto superior esquerdo

• Busca na parte superior

• Navegação global na parte superior

• Navegação local na coluna da esquerda

• “Caminho de pão” na parte superior

• Conteúdo no centro


Usabilidade


Usabilidade

• Manter a identidade visual

• Usar as convenções

• Deixar óbvio o que pode ser clicado

• Evitar a confusão

• Evitar a enrolação

• Nunca, jamais impor música de fundo

• Animações: evite


Etapas de um projeto

• POR QUE alguém visitará nosso site?

• QUEM visitará nosso site?

• O QUE nosso usuário quer encontrar?

• O que nós ofereceremos ao usuário que ele NÃO ENCONTRARÁ EM OUTRO SITES?



http://www.cafedoporto.com.br/

http://www.cafedoporto.com.br/


http://www.restaurantepueblo.com.br/page1.aspx

http://www.restaurantepueblo.com.br/page1.aspx


• Proposta inicial

• Benchmark

• Levantamento do conteúdo

• Definição das “atrações” do site

• Criação do wireframe

• Venda de anúncios



• Definição e colocação da identidade visual

• Produção/edição de conteúdo

• Teste

• Publicação

• Divulgação


#FAIL


http://www.kardini.com.br/

http://www.kardini.com.br/

#FAIL


http://www.silvercrestsubmarines.co.uk/

http://www.silvercrestsubmarines.co.uk/

#FAIL


http://www.centrosulpneus.com.br/



#FAIL


http://www.ufrgs.br/deurb/adm.htm



#FAIL


http://www.eca.usp.br/pjbr/arquivos/indice11.htm

http://www.eca.usp.br/pjbr/arquivos/indice11.htm

#FAIL


http://www.rosulonline.com.br/folharosariense/

http://www.rosulonline.com.br/folharosariense/

#FAIL


http://nebulosabar.com/SiliconValley/Heights/6882/

http://nebulosabar.com/SiliconValley/Heights/6882/

arquitetura de informação e usabilidade

Education