Ponto Frio - Análise arquitetura da informação Trabalho para a disciplina de planejamento visual 4, professora Mariana Cantisani.

1. 1
Análise da arquitetura da informação

2. Planejamento visual 4
Análise da Arquitetura da informação pontofrio.com.br
Design gráfico IFPB, Professora Mariana Cantisani
Aluno Adson Santos

3. 3
4.
5.
15.
16.
19.
20.
23.
27.
28.
29.
30.
O site
Heurísticas
Conclusão
Wireframe
Sistema de rotulação
Sistema de organização
Sistema de navegação
Sistema de busca
Página de erros
Testes
Sugestões
Sumário

4. 4
O site do Ponto Frio tem a função de comercializar produtos das mais variadas
marcas e serviços associados, buscando fidelizar os clientes através do bom
atendimento. Conta com alguns níveis de informação, destacando as ofertas do
dia, na área superior, principal da página, em seguida, ao rolar, outros produtos
podem ser visualizados
A hierarquia das informações são tratadas por diferentes níveis cromáticos, o
que pode parecer confuso em um primeiro momento, já que as cores não se
relacionam diretamente com a identidade visual da empresa.
Na navegação e fechamento do pedido, existem recursos para melhorar a
experiência da compra, como por exemplo:
- Coleção de vídeos demonstrativos sobre produtos para você fazer a melhor
escolha.
- Filtros para encontrar exatamente o produto que você precisa e procura.
- Carrinho de compras com todos os passos para fechamento do pedido em uma
única tela.
O site

5. 5
O sistema deve informar continuamente ao usuário sobre o que ele está fazendo;
10 segundos é o limite para manter a atenção do usuário focalizada no diálogo;
Heurísticas de Nielsen
1. Feedback
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7

6. 6
A terminologia deve ser baseada na linguagem do usuário e não orientada ao
sistema; As informações devem ser organizadas conforme o modelo mental do
usuário;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
2. Linguagem do usuário

7. 7
O usuário controla o sistema, ele pode, a qualquer momento, abortar
uma tarefa, ou desfazer uma operação e retornar ao estado anterior;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
3. Saídas claramente demarcadas

8. 8
Um mesmo comando ou ação deve ter sempre o mesmo efeito; A mesma
operação deve ser apresentada na mesma localização e deve ser formatada/
apresentada da mesma maneira para facilitar o reconhecimento;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
4. Consistência

9. 9
Evitar situações de erro; Conhecer as situações que mais provocam erros e
modificar a interface para que estes erros não ocorram;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
5. Prevenir erros

10. 10
O sistema deve mostrar os elementos de diálogo e permitir que o usuário faça suas
escolhas, sem a necessidade de lembrar um comando específico;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
6. Minimizar a sobrecarga de memória do usuário

11. 11
Para usuários experientes executarem as operações mais rapidamente; Abreviações,
teclas de função, duplo clique no mouse, função de volta em sistemas hipertexto;
Atalhos também servem para recuperar informações que estão numa profundidade
na árvore navegacional a partir da interface principal;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
7. Atalhos

12. 12
Deve-se apresentar exatamente a informação que o usuário precisa no
momento, nem mais nem menos; A seqüência da interação e o acesso aos objetos
e operações devem ser compatíveis com o modo pelo qual o usuário realiza suas
tarefas;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
8. Diálogos simples e naturais

13. 13
Linguagem clara e sem códigos; Devem ajudar o usuário a entender e resolver o
problema; Não devem culpar ou intimidar o usuário;
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
9. Boas mensagens de erro

14. 14
Mesmo que seja melhor que um sistema possa ser usado sem documentação,
pode ser necessário fornecer uma ajuda e documentação. Qualquer informação
deve ser fácil de se pesquisada, com foco na atividade do usuário, lista de passos
concretos a serem realizados, e não ser muito grande.
Usuário 1
Usuário 2
Usuário 3
1 2 3 4 5 6 7
1 2 3 4 5 6 7
1 2 3 4 5 6 7
10. Ajuda e documentação

15. 15
Conclusão
De maneira geral, o site proporciona ao usuário uma fácil navegação, assim ele
atende as principais necessidades. Contém bastantes informações, porém muitas
delas podem confundir usuários menos experientes, tanto pela quantidade, como
pela organização do conteúdo. A página inicial é bastante longa e pode prejudicar
o usuário que não tenha acesso a conexões mais rápidas, pois imagens acabam
demorando para serem carregadas. Porém, percebe-se que esta é uma prática
bastante usual de lojas de departamento na internet.
Uma solução para a página inicial seria diminuir o número de itens, para que a
rolagem fosse menor e menos confusa.

16. 16
Wireframe home
1 2 3 4
5 6
10
8
7
9
11
12
13
14 15 16
17 18 19
20
21
22
1 - Topo
2 - Logo
3 - Busca superior
4 - Carrinho
5 - Menu geral
6 - Oferta do Pinguim
7 - Ofertas do dia
8 - Navegação ofertas do dia
9 - Escolha por faixa de preço
10 - Demais promoções
11 - Blog do Pinguim
12 - Serviços
13 - Busca inferior
14 - Dúvidas
15 - Serviços 2
16 - Institucional
17 - Televendas
18 - Atendimento
19 - Redes sociais
20 - Formas de pagamento
21 - Segurança /plataformas
22 - Endereço / CNPJ

17. 17
Wireframe identificação
12 3
4
5
6
7
1 - Topo
2 - Logo
3 - Carrinho
4 - Oferta do Pinguim
5 - Login com rede social
6 - Login cliente cadastrado
7 - Cadastro novo cliente

18. 18
Wireframe página de erro
1
2
3
4
5
1 - Logo
2 - Mensagem de erro
3 - Navegação por categorias
4 - Busca
5 - Televendas e atendimento

19. 19
Sistemas de rotulaçãoPontoFrio
Americanas
MagazineLuiza

20. 20
Taxonomia, indexação
Organização de informações e conhecimentos de forma significativa, possibilitando
que o usuário possua acesso à informação organizada e estruturada.
São organizados por ordem de importância nos três sites analisados, todos eles
possuem um link para que sejam vistos todos os departamentos.
Vocabulário controlado/ontologia:
Controlar a terminologia usada nos índices e controlar a exibição dos
relacionamentos entre conceitos nos índices.
O Ponto Frio e Magazine Luiza, utilizam as palavras para departamento, ao
contrário das Lojas Americanas que usa em sua página apenas ícones, o que
dificulta a compreensão do usuário.

21. 21
Organização por sequência
O usuário sabe em que setor eles está, baseado nas informações sequenciais.
Organização por categoria
O usuário seleciona a categoria em que ele acha que o produto procurado se
insere.
Sistemas de organização

22. 22
Esquema dirigido à metáfora
O usuário faz a leitura de pictogramas/símbolos, de conhecimento geral, para
chegar nos produtos ou categorias desejadas.

23. 23
Mapa do site
O site possui um link em que lista todas as categorias presentes, caracterizando
como um mapa do site.
Sistemas de navegação

24. 24
Informações de ordenar os produtos e outros tipos de filtro só aparecem quando
você seleciona uma das categorias existentes.
Navegação local
No topo da página existe um menu fixo com as principais informações, além de
um campo de busca que aparece na maioria das páginas.
Navegação global

25. 25
Na página individual do produto, existe um campo para avaliação do cliente e
perguntas que podem ser respondidas por outros usuários.
Navegação interna

26. 26
É possível compartilhar um produto nas redes sociais, o site destaca o facebook e o
twitter, porém ao clicar no “+compartilhar” outras redes aparecem e também pode
ser feito o compartilhamento por e-mail.
Navegação externa

27. 27
O site possui um sistema de busca que automaticamente completa ao digitar um
termo no campo e faz uma sugestão prévia de busca e produtos.
Sistema de busca

28. 28
A página de erro é simples, porém bastante útil e proporciona ao usário várias
formas de encontrar o que procura, nela existe mais um campo de busca e
navegação por categoria. Ainda é possível encontrar a ajuda online do Ponto Frio.
Páginas de erro

29. 29
A navegação pelo site foi feita em quatro navegadores diferentes, Chrome, Safari,
Firefox e Internet Explorer, usando os sitemas Windows 7 e Mac OS X Lion 10.7.5
e não foram encontrados erros. O comportamento nos diferentes ambientes
aconteceu da mesma maneira.
Testes

30. 30
O layout do site segue um padrão comum para lojas deste gênero, existem
muitas categorias e sessões e isso pode dificultar a navegação de alguns usuários,
especialmente por conta do grande número de produtos espalhados pela página
inicial. A sugestão, é que acontecesse uma diminuição na quantidade de produtos
que ficam expostos na primeira página do site.
Outro fator que pode confundir o usuário, é o excessivo número de cores para a
mesma primeira página, o tratamento cromático não segue a identidade visual da
empresa.*
As páginas internas possuem uma melhor organização das informações, possuem
um background branco, o que torna o contraste muito bom e a tipografia é de boa
legibilidade.
O mapa do site e a busca são bons e atendem as necessidades do usuário.
*Na última visita ao site, foi observada a redução de cores, isso já deixou melhor a página inicial.
Sugestões