O documento discute a arquitetura da informação, definindo-a como a estruturação e distribuição de conteúdo em um site para tornar as informações facilmente identificáveis e a navegação intuitiva. Ele explica os principais instrumentos do arquiteto de informação, incluindo sitemaps para representar a estrutura do site e wireframes para estruturar o conteúdo de cada página.

1. Arquitetura de Informação!
Uma breve explicação!

2. Agenda!
 Arquitetura da Informação!
 Introdução!
 O que é?!
 Os princípios básicos!
 Instrumentos do arquiteto de informação!

3. Arquitetura de Informação!
 Tem lugar de honra!
 É a partir da estrutura criada para sites e
afins (arquitetura de informação) que se
distribui a informação (através do
webwriting) e produz-se conhecimento.!
 Muito recente, foi formalizada há pouco
tempo.!

4. O que é?!
 É a tarefa de estruturar e distribuir áreas,
principais e secundárias, tornando as
informações facilmente identificáveis, sua
distribuição bem definida e, a navegação
intuitiva.!

5. O que é?!
 Pode ser aplicada em:!
 Sites,hotsite e minisites!
 Intranet!
 Cds-Rom!
 DVDs-Rom!

6. Princípios Básicos!
 Organizar: sugerir diversas opções de
construção para um ambiente digital
como um todos e para as áreas
secundárias.!
 Navegar: aprender com a informação do
usuário, quanto na percepção como ele
navega.!

7. Princípios Básicos!
 Nomear: estudar de qual maneira as
áreas serão identificadas, seja pela
palavra, ícone, ou de ambos.!
 Buscar: como indexar a informação para
que a sua procura seja tranqüila.!
 Pesquisar: apurar toda a informação
necessária à construção do conteúdo.!

8. Princípios Básicos!
 Desenhar: testa o resultado fina da AI,
antes mesmo da construção do
fluxograma.!
 Mapear: montar o fluxograma.Montar a
estrutura do site, para depois montar o
wireframe.!

9. Instrumentos para a AI!
 Osdocumentos utilizados pelo arquiteto
da informação para planejar o site são:!
 Sitemap ou Mapa do Site!
 Wireframe!

10. Sitemap!
 Éa representação gráfica da estrutura de
um website, do ponto de vista da
distribuição do conteúdo por páginas e do
caminho mis simples (hiperlink) a ser
percorrido pelo usuário para se chegar a
cada “página”pretendida.!

11. Sitemap!
 Há dois tipos de mapa do site:!
 Mapa do site estrutural: acontece na primeira
fase do projeto, apresentando as páginas do
futuro site com suas principais conexões.!
 É apenas simbólico.!

12. Exemplo!

13. Sitemap!
 O segundo tipo é o navegável, que
encontramos facilmente nos sites atuais.!
 É navegável, interativo e digital.!

14. Exemplo!
Mapa do site da
Starbucks.

15. Wireframe!
 Aliado ao mapa do site, é um documento
fundamental para o arquiteto de
informação.!
 Mas não é uma regra de estilo para os
designers.!

16. Wireframe!
 Suafunção é estrutura o conteúdo de
cada página, indicando o peso e
relevância de cada elemento do layout e
sua relação com os demais elementos
formadores do todo.!

17. Wireframe - função!
 Marcação de textos!
 Breadcrumbs de navegação!
 Guidelines da marca!
 Futuramente, serve como baliza para
testes de usabilidade.!
 Serve também para marcação das etapas
de um processo de interação entre o
usário e o sistema.!

18. Exemplo!

19. Wireframe!
 Riscos:!
 Não atender as expectativas do cliente.!
 Acomodar a equipe de criação!
 Pode gerar desencontro de entendimento!
 Necessita de tempo, educação e insistência
de uso até tornar-se corretamente entendido.!

20. Wireframe!
 Vantagens:!
 Facilitaa plicação de conceitos de
usabilidade.!
 Auxilia a equipe de desenvolvimento e
programção!
 Auxiliam nos testes de usabilidade, após o
desenvolvimento,!
 É um documento para prever futuras
modificações.!

21. Principais Softwares!
 Para criar os Sitemaps e Wireframes:!
 Visio(mais indicado)!
 Freehand!
 InDesign (mais indicado)!
 Power Point!