Ponto Frio - Análise arquitetura da informação

1,177 views

Published on

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

Published in: Design

Ponto Frio - Análise arquitetura da informação

  1. 1. 1 Análise da arquitetura da informação
  2. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 19 Sistemas de rotulaçãoPontoFrio Americanas MagazineLuiza
  20. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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

×