introducao à arquitetura de informacao
TRANSCRIPT
![Page 1: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/1.jpg)
Arquitetura de Informação
Foto: http://arquiteturadeinformacao.com/
![Page 2: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/2.jpg)
Arquitetura deInformaçãoO que é e para que serve?
![Page 3: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/3.jpg)
Arquitetura deInformaçãoO que é e para que serve?
ONDE ESTOU ?
DE ONDE VIM ?
PARA ONDE VOU ?
![Page 4: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/4.jpg)
Arquitetura deInformação
O que é
É a arte e a ciência de estruturar e classificar websites e intranets a fim de ajudar as pessoas
a encontrar e a gerenciar informação.
(Peter Morville & Louis Rosenfeld, in Information Architecture for the World Wide Web)
![Page 5: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/5.jpg)
Arquitetura deInformação
O que é
Combinação entre esquemas de organização,
nomeação e navegação dentro de um sistema de informação.
(Peter Morville & Louis Rosenfeld, in Information Architecture for the World Wide Web)
![Page 6: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/6.jpg)
Facilitar a realização de tarefas
e o acesso intuitivo a contextos e conteúdos.
(Peter Morville & Louis Rosenfeld, in Information Architecture for the World Wide Web)
Arquitetura deInformação
Para que serve?
![Page 7: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/7.jpg)
Ela torna o complexo, claro.
Richard Saul Wurman (1997)
Arquitetura deInformação
Para que serve?
![Page 8: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/8.jpg)
Arquitetura deInformação
Sabe quando você entra num site e
fica perdido?
A tarefa do Arquiteto de Informação é
trabalhar para que isso não aconteça.
![Page 9: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/9.jpg)
Arquitetura deInformação
AI enquanto etapa de um projeto web
Plano de negócios
AI design desenvolvimento
![Page 10: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/10.jpg)
Arquitetura deInformação
Ecologia da Informação
![Page 11: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/11.jpg)
Arquitetura deInformação
ContextoEntender as estratégias e oportunidades de negócio,os processos e a cultura da empresa, o background do projetoe os recursos disponíveis para sua realização
UsuáriosDesign centrado no usuário > Considerar as necessidades do usuário finale entender seus tipos de comportamento em busca da informação
ConteúdoLevantar a natureza e a quantidade de conteúdo a ser desenvolvido para o projeto, projetar possíveis cenários para o crescimento do site
![Page 12: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/12.jpg)
Por que pesquisar o Contexto:
- Entender os objetivos do negócio e metas corporativas
- Descobrir o “reason why” do projeto
- Saber qual é o público-alvo
- Levantar todos os stakeholders envolvidos
- Identificar as restrições do projeto
- Avaliar erros e sucessos anteriores
- Olhar para o que está feito no mercado (benchmark funcional) > Focado nas funcionalidades e experiências de uso dos sites concorrentes
Arquitetura deInformação
![Page 13: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/13.jpg)
10 perguntas para descobrir o Contexto(briefing multidisciplinar)
1. Quais os objetivos a curto, médio e longo prazo?
2. Qual é o modelo de negócio? Quais são as políticas?
3. Quem é o público-alvo?
4. Que tipo de tarefas os usuários poderão realizar?
5. Porque os usuários visitarão o site? Porque voltarão?
6. Qual o orçamento e o cronograma do projeto?
7. Como o conteúdo será criado e gerido?
8. Qual a infraestrutura técnica?
9. O que funcionou e o que deu errado no passado?
10. O que deixei de perguntar?
Arquitetura deInformação
![Page 14: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/14.jpg)
Arquitetura deInformação
Por que pesquisar o Usuário
Os usuários são os designers
definitivos da web.
(Peter Morville & Louis Rosenfeld, in Information Architecture for the World Wide Web)
![Page 15: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/15.jpg)
Por que pesquisar o Conteúdo:
Arquitetura deInformação
![Page 16: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/16.jpg)
![Page 17: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/17.jpg)
Sistema de Rotulação
Sistema de Informação
Sistema de Navegação
Arquitetura deInformação
![Page 18: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/18.jpg)
Sistema de Rotulação
Arquitetura deInformação
![Page 19: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/19.jpg)
Rotulação
![Page 20: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/20.jpg)
Arquitetura deInformação
O que fazer ?
KISS
Testar!
![Page 21: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/21.jpg)
Arquitetura deInformação
Sistema de Organização
1. Análise dos tipos de conteúdo
2. Inventário de conteúdo
![Page 22: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/22.jpg)
3. Procurar por metadados
Descritivos:
- Todas as maneiras diferentes de descrever o objeto de conteúdo
Administrativos:
- Relação do objeto com o contexto de negócio Ex: Quem criou o conteúdo? Em que data?
Arquitetura deInformação
Sistema de Organização
![Page 23: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/23.jpg)
4. Faced Classification (Classificação Facetada)
Classificação e organização de um mesmo conjunto de informações de diferentes maneiras.
Você pode utilizar metadados para organizar as informações em esquemas diferentes.
Cada esquema é uma dimensão da estrutura do site.
Arquitetura deInformação
Sistema de Organização
![Page 24: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/24.jpg)
Arquitetura deInformação
Sistema de navegação
Navegação “embedded” (formada pelos elementos de navegação que são apresentados integrados ao site.O objetivo é oferecer contexto e flexibilidade)
![Page 25: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/25.jpg)
Arquitetura deInformação
Sistema de navegação
Navegação “embedded”
LogotipoBarra de Navegação GlobalMenu LocalBread CrumbCross content (conteúdo cruzado)
![Page 26: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/26.jpg)
Arquitetura deInformação
Sistema de navegação
Navegação suplementar(sua função é oferecer caminhos complementares para se encontrar o conteúdo e realizar tarefas)
Mapa do Site
Índices (A-Z)
Rodapés
Guias e Tutoriais
![Page 27: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/27.jpg)
Arquitetura deInformação
Mapa do site
O mapa do site é o mapa da arquitetura e inclui todas as páginas e seções de conteúdo.
Este documento será o guia para o desenvolvimento do projeto,
desde a criação de wireframes até a entrega.
![Page 28: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/28.jpg)
Wireframes
É o rascunho das páginas do site.
Deve mostrar quais os elementos de navegação,quais os elementos de maior destaque do conteúdo e
a ordenação e o agrupamento de componentes do conteúdo, além de como priorizá-los.
Pode indicar mas não define o posicionamento dos elementos na tela ou os estilos
http://www.ivogomes.com/blog/wireframes/
Arquitetura deInformação
![Page 29: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/29.jpg)
![Page 30: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/30.jpg)
Arquitetura deInformação
Exemplos de wireframes
![Page 31: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/31.jpg)
![Page 32: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/32.jpg)
![Page 33: Introducao à Arquitetura de Informacao](https://reader036.vdocuments.site/reader036/viewer/2022062312/555b31f1d8b42ae82e8b4f3b/html5/thumbnails/33.jpg)
Gliffywww.gliffy.com
Omni Graffle
http://www.omnigroup.com/applications/omnigraffle/
Arquitetura deInformação
Softwares para criação de wireframes
Axurehttp://www.axure.com/
Microsoft Visiohttp://office.microsoft.com/en-us/FX010857981033.aspx