WEBDESIGN
- UNIDADE II -
ESTRUTURAÇÃO PARA A CRIAÇÃO DE
SITE
Arquitetura da Informação (AI)
Conceito - Arquitetura da informação
2


       “A ciência e a arte de organizar e rotular websites,
        intranets, comunidades online e software para dar
        suporte à usabilidade e facilitar a busca das
        informações.”
        (Information Architecture Institute)
Exemplo - Arquitetura da informação
3
Exemplo - Arquitetura da informação
4
Por que usar?
5


       Uma má arquitetura da informação pode trazer
        grandes prejuízos para as empresas.
       27% das causas de insucesso das vendas em um
        site de comércio eletrônico são porque o usuário
        não encontrou as informações.
6




    Exemplos de MAU USO da
    Arquitetura da Informação (AI)
Exemplos de MAU USO da AI
7

    www.universodobebe.com.br
Exemplos de MAU USO da AI
8

    www. mcdonalds.com.br
Exemplos de MAU USO da AI
9

    www.bobs.com.br
10




     Exemplos de USO CORRETO da
     Arquitetura da Informação (AI)
Exemplos de USO CORRETO de AI
11

     www. habibs.com.br
Exemplos de USO CORRETO de AI
12

     www.voegol.com.br
Exemplos de USO CORRETO de AI
13


     www.submarino.com.br
Ciclo de vida para estruturação de site
14




                ARQUITETURA
      COLETA                  DESIGN DO SITE   DESENVOLVI-
                     DA
     DE DADOS                                    MENTO
                INFORMAÇÃO
Papel do Arquiteto da Informação
15


        Facilitar o acesso à
         informação
        Evidenciar as informações
         mais importantes
        Retirar informações
         desnecessárias
        Equilibrar as características e
         necessidades dos usuários,
         contexto e conteúdo.
www
16




     Obrigatoriamente
           TODO SITE
          deve ser feito
     a sua Arquitetura da Informação
Tripé da Arquitetura da Informação
17




                     CONTEXTO




              CONTEÚDO          USUÁRIOS
Tripé da Arquitetura da Informação
18




                        CONTEXTO




           Objetivos da organização, políticas,
            cultura, tecnologia e recursos humanos
Tripé da Arquitetura da Informação
19




                        CONTEÚDO




           Documentos, formatos/tipos, objetos,
            estrutura existente
Tripé da Arquitetura da Informação
20




                        USUÁRIOS




           Audiência, tarefas, necessidades,
            comportamento de busca de
            informação, experiência, vocabulário
Componentes da
21
     Arquitetura da Informação
        Sistemas de organização
        Sistemas de rotulagem
        Sistemas de navegação
        Sistemas de busca
Sistemas de Organização
22


        Exatas             Ambíguas

         - Alfabética        - Tópico
         - Cronológica       - Tarefa
         - Geográfica        - Audiência
                             - Metáfora
                             - Híbrida
Sistemas de Organização
23
Sistemas de Organização
24
Sistemas de Rotulagem
25


        São os nomes das diferentes categorias do site
        Aparece no sistema de navegação
        É um dos mais importantes aspectos e um dos
         mais difíceis de ser realizado
        Necessita-se refletir sobre o conteúdo para
         redigir na linguagem do usuário
        Pode ser em forma textual ou como imagem
         (ícone representativo)
Sistemas de Rotulagem
26
Sistemas de Rotulagem
27
Sistemas de Navegação
28


     Trata-se de especificar os modelos de navegação
     que serão vistos pelo usuário de forma que possam
     se mover pelo espaço informacional e hipertextual.
Sistemas de Navegação
29


     O sistema de navegação se apresenta em dois
     níveis de localização ou possui duas funções
     básicas para o usuário (Reis, 2007; Nielsen, 2000):
      1) indicar sua localização: mostra a posição do

        usuário em relação ao website como um todo e
        identifica em que website o usuário está; e
      2) mostrar o caminho correto para seguir e

        chegar ao seu destino: posiciona o usuário em
        relação à estrutura interna do website.
Sistemas de Navegação
30


     Tipos de Sistemas de Navegação
      Global

      Local

      Contextual

      Auxiliar
Sistemas de Navegação
31
Sistemas de Navegação
32

                             NAVEGAÇÃO LOCAL
Sistemas de Navegação   NAVEGAÇÃO
                             CONTEXTUAL
33
Sistemas de Navegação   NAVEGAÇÃO
                             AUXILIAR
34
Sistemas de Busca
35


        Interface de Busca
        Áreas de Busca
        Linguagem de Busca
        Resultado
REFERÊNCIAS
36




        BIBLIOTECA VIRTUAL
         http://www.guilhermo.com/ai_biblioteca/assunto.asp?assunto=1
OBRIGADO!
37


        PROF. SERGIO XAVIER

         E-mail:
         sergiosx@gmail.com

         Blog:
         www.profsergioxavier.wordpress.com

Aula05 webdesign

  • 1.
    WEBDESIGN - UNIDADE II- ESTRUTURAÇÃO PARA A CRIAÇÃO DE SITE Arquitetura da Informação (AI)
  • 2.
    Conceito - Arquiteturada informação 2  “A ciência e a arte de organizar e rotular websites, intranets, comunidades online e software para dar suporte à usabilidade e facilitar a busca das informações.” (Information Architecture Institute)
  • 3.
    Exemplo - Arquiteturada informação 3
  • 4.
    Exemplo - Arquiteturada informação 4
  • 5.
    Por que usar? 5  Uma má arquitetura da informação pode trazer grandes prejuízos para as empresas.  27% das causas de insucesso das vendas em um site de comércio eletrônico são porque o usuário não encontrou as informações.
  • 6.
    6 Exemplos de MAU USO da Arquitetura da Informação (AI)
  • 7.
    Exemplos de MAUUSO da AI 7 www.universodobebe.com.br
  • 8.
    Exemplos de MAUUSO da AI 8 www. mcdonalds.com.br
  • 9.
    Exemplos de MAUUSO da AI 9 www.bobs.com.br
  • 10.
    10 Exemplos de USO CORRETO da Arquitetura da Informação (AI)
  • 11.
    Exemplos de USOCORRETO de AI 11 www. habibs.com.br
  • 12.
    Exemplos de USOCORRETO de AI 12 www.voegol.com.br
  • 13.
    Exemplos de USOCORRETO de AI 13 www.submarino.com.br
  • 14.
    Ciclo de vidapara estruturação de site 14 ARQUITETURA COLETA DESIGN DO SITE DESENVOLVI- DA DE DADOS MENTO INFORMAÇÃO
  • 15.
    Papel do Arquitetoda Informação 15  Facilitar o acesso à informação  Evidenciar as informações mais importantes  Retirar informações desnecessárias  Equilibrar as características e necessidades dos usuários, contexto e conteúdo.
  • 16.
    www 16 Obrigatoriamente TODO SITE deve ser feito a sua Arquitetura da Informação
  • 17.
    Tripé da Arquiteturada Informação 17 CONTEXTO CONTEÚDO USUÁRIOS
  • 18.
    Tripé da Arquiteturada Informação 18 CONTEXTO  Objetivos da organização, políticas, cultura, tecnologia e recursos humanos
  • 19.
    Tripé da Arquiteturada Informação 19 CONTEÚDO  Documentos, formatos/tipos, objetos, estrutura existente
  • 20.
    Tripé da Arquiteturada Informação 20 USUÁRIOS  Audiência, tarefas, necessidades, comportamento de busca de informação, experiência, vocabulário
  • 21.
    Componentes da 21 Arquitetura da Informação  Sistemas de organização  Sistemas de rotulagem  Sistemas de navegação  Sistemas de busca
  • 22.
    Sistemas de Organização 22  Exatas  Ambíguas - Alfabética - Tópico - Cronológica - Tarefa - Geográfica - Audiência - Metáfora - Híbrida
  • 23.
  • 24.
  • 25.
    Sistemas de Rotulagem 25  São os nomes das diferentes categorias do site  Aparece no sistema de navegação  É um dos mais importantes aspectos e um dos mais difíceis de ser realizado  Necessita-se refletir sobre o conteúdo para redigir na linguagem do usuário  Pode ser em forma textual ou como imagem (ícone representativo)
  • 26.
  • 27.
  • 28.
    Sistemas de Navegação 28 Trata-se de especificar os modelos de navegação que serão vistos pelo usuário de forma que possam se mover pelo espaço informacional e hipertextual.
  • 29.
    Sistemas de Navegação 29 O sistema de navegação se apresenta em dois níveis de localização ou possui duas funções básicas para o usuário (Reis, 2007; Nielsen, 2000):  1) indicar sua localização: mostra a posição do usuário em relação ao website como um todo e identifica em que website o usuário está; e  2) mostrar o caminho correto para seguir e chegar ao seu destino: posiciona o usuário em relação à estrutura interna do website.
  • 30.
    Sistemas de Navegação 30 Tipos de Sistemas de Navegação  Global  Local  Contextual  Auxiliar
  • 31.
  • 32.
    Sistemas de Navegação 32 NAVEGAÇÃO LOCAL
  • 33.
    Sistemas de Navegação NAVEGAÇÃO CONTEXTUAL 33
  • 34.
    Sistemas de Navegação NAVEGAÇÃO AUXILIAR 34
  • 35.
    Sistemas de Busca 35  Interface de Busca  Áreas de Busca  Linguagem de Busca  Resultado
  • 36.
    REFERÊNCIAS 36  BIBLIOTECA VIRTUAL http://www.guilhermo.com/ai_biblioteca/assunto.asp?assunto=1
  • 37.
    OBRIGADO! 37  PROF. SERGIO XAVIER E-mail: sergiosx@gmail.com Blog: www.profsergioxavier.wordpress.com