SlideShare ist ein Scribd-Unternehmen logo
1 von 21
Arquitetura de Informação é o desenho de uma interface, incluindo todos seus fluxos de navegação e estruturação de conteúdo.
ASPECTOS INTERACIONAIS DA NAVEGAÇÃO Como interferem?
 
ARQUITETURA DA INFORMAÇÃO: O QUE É ISSO? Componentes da AI em um website: sistema de organização, sistema de rotulação, sistema de navegação e sistema de busca.
USUÁRIO REAL  X  USUÁRIO IDEAL  Design baseado em “personagens”: homem/mulher, adolescente/adulto, solteiro/casado...
QUEM SÃO OS RESPONSÁVEIS PELOS CLICKS DOS USUÁRIOS? O Projetista ou Design de interfaces
O projetista / design de interfaces leva em consideração 3 fatores  prioritários no desenvolvimento de um projeto de internet: * USUÁRIO * SISTEMA * INTERFACE
WIREFRAME  “ O nome “wireframe” vem da junção de duas palavras em inglês: “wire” (linhas) e “frames” (ecrãs). Ou seja, são ecrãs de baixa resolução e com um aspecto gráfico muito pobre que servem apenas para indicar onde devem estar localizados os objectos e menus de interacção. O wireframe serve para mostrar a funcionalidade e não o aspecto gráfico de uma aplicação.” (GOMES, 2005)
FUNÇÕES DO WIREFRAME * Função estrutural * Marcação das etapas de um processo de interação entre usuário e sistema
Competências de um Arquiteto de Informação  Usabilidade  Identidade e Marca
RISCOS  X  VANTAGENS
PRINCIPAIS ELEMENTOS DE UM WIREFRAME
Exemplo de wireframe de GOMES (2005)
PRINCIPAIS SOFTWARES PARA CONSTRUÇÃO DE WIREFRAMES *Visio *Freehand *QuarkXPress *InDesign. *OminiGraffle *llustrator ou ainda, em XHTML
Prototipagem em papel
INSTITUTO DA ARQUITETURA DA INFORMAÇÃO   (Information Architecture Institute) Missão: organização global voluntária para apoiar ações individuais ou organizacionais relacionadas à construção de ambientes de informação compartilhada.
O VALOR DA ARQUITETURA DA INFORMAÇÃO Trabalho intangível e invisível = incompreensão e desvalorização
REFLEXÃO PROPOSTA PELO INSTITUTO DA ARQUITETURA DA INFORMAÇÃO Qual o custo de… ...encontrar uma informação?  ...não encontrar uma informação?  … usar uma informação? … construir e gerenciar um sistema de informação?
REFLEXÃO PROPOSTA PELO INSTITUTO DA ARQUITETURA DA INFORMAÇÃO Qual o custo de… … educar empregados e consumidores? … criar redes de conhecimento? … fortalecer uma marca? ...encorajar a inovação?
Na trilha dos olhos  Pesquisas do Instituto Poynter
ALGUNS PONTOS-CHAVE DESCOBERTOS PELO ESTUDO DE “EYETRACKING”: *Fotos coloridas não chamam atenção automaticamente  *Leitores acessarão jornais online onde o elemento mais forte estiver *Usuários enxergam a página na tela como uma coisa só *Usuários aceitam facilmente o uso de negrito e a experimentação de cores  berrantes *As cores não diminuem a aquisição de informação visual pelo usuário.

Weitere ähnliche Inhalte

Ähnlich wie Arquitetura da Informação

Arquitetura da Informação em Projetos Web
Arquitetura da Informação em Projetos WebArquitetura da Informação em Projetos Web
Arquitetura da Informação em Projetos Web
Otaviano Silvério
 
Arquitetura de informação
Arquitetura de informaçãoArquitetura de informação
Arquitetura de informação
renatamruiz
 
Arquiteturadeinformao apresentao2-03-05-10
Arquiteturadeinformao apresentao2-03-05-10Arquiteturadeinformao apresentao2-03-05-10
Arquiteturadeinformao apresentao2-03-05-10
Rafael Marinho
 
Introducao à Arquitetura de Informacao
Introducao à Arquitetura de InformacaoIntroducao à Arquitetura de Informacao
Introducao à Arquitetura de Informacao
duradez
 
Arquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e CenáriosArquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e Cenários
posgraduacaorj
 
Arquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e CenáriosArquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e Cenários
posgraduacaorj
 
Arquitetura de informação
Arquitetura de informaçãoArquitetura de informação
Arquitetura de informação
pospipoca
 

Ähnlich wie Arquitetura da Informação (20)

Palestra "Usabilidade: conceito, aplicações e testes" de Renato Rosa
Palestra "Usabilidade: conceito, aplicações e testes" de Renato RosaPalestra "Usabilidade: conceito, aplicações e testes" de Renato Rosa
Palestra "Usabilidade: conceito, aplicações e testes" de Renato Rosa
 
Arquitetura da Informação em Projetos Web
Arquitetura da Informação em Projetos WebArquitetura da Informação em Projetos Web
Arquitetura da Informação em Projetos Web
 
Arquitetura de Informacao em Projetos de Design
Arquitetura de Informacao em Projetos de DesignArquitetura de Informacao em Projetos de Design
Arquitetura de Informacao em Projetos de Design
 
Arquitetura de informação
Arquitetura de informaçãoArquitetura de informação
Arquitetura de informação
 
Arquiteturadeinformao apresentao2-03-05-10
Arquiteturadeinformao apresentao2-03-05-10Arquiteturadeinformao apresentao2-03-05-10
Arquiteturadeinformao apresentao2-03-05-10
 
Introdução a experiência do usuário
Introdução a experiência do usuárioIntrodução a experiência do usuário
Introdução a experiência do usuário
 
Introdução à Arquitetura de Informação
Introdução à Arquitetura de InformaçãoIntrodução à Arquitetura de Informação
Introdução à Arquitetura de Informação
 
Design para a web - da interface ao branding
Design para a web - da interface ao brandingDesign para a web - da interface ao branding
Design para a web - da interface ao branding
 
Arquitetura da informação
Arquitetura da informaçãoArquitetura da informação
Arquitetura da informação
 
Curso Arquitetura de Informação @ iMasters Jan 2013
Curso Arquitetura de Informação @ iMasters Jan 2013Curso Arquitetura de Informação @ iMasters Jan 2013
Curso Arquitetura de Informação @ iMasters Jan 2013
 
Arquitetura da Informacao na WEB
Arquitetura da Informacao na WEBArquitetura da Informacao na WEB
Arquitetura da Informacao na WEB
 
Arquitetura de Informação
Arquitetura de InformaçãoArquitetura de Informação
Arquitetura de Informação
 
Introducao à Arquitetura de Informacao
Introducao à Arquitetura de InformacaoIntroducao à Arquitetura de Informacao
Introducao à Arquitetura de Informacao
 
Arquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e CenáriosArquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e Cenários
 
Arquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e CenáriosArquitetura de Informação - Personas e Cenários
Arquitetura de Informação - Personas e Cenários
 
Arquitetura de Informação e Usabilidade
Arquitetura de Informação e UsabilidadeArquitetura de Informação e Usabilidade
Arquitetura de Informação e Usabilidade
 
Arquitetura de informação
Arquitetura de informaçãoArquitetura de informação
Arquitetura de informação
 
Arquitetura da Informacao e Webdesign
Arquitetura da Informacao e WebdesignArquitetura da Informacao e Webdesign
Arquitetura da Informacao e Webdesign
 
Web Standards
Web StandardsWeb Standards
Web Standards
 
Criação de sites
Criação de sitesCriação de sites
Criação de sites
 

Kürzlich hochgeladen

A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
PatriciaCaetano18
 
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
HELENO FAVACHO
 
matematica aula didatica prática e tecni
matematica aula didatica prática e tecnimatematica aula didatica prática e tecni
matematica aula didatica prática e tecni
CleidianeCarvalhoPer
 
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptxResponde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
AntonioVieira539017
 

Kürzlich hochgeladen (20)

Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptxMonoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
 
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
 
Camadas da terra -Litosfera conteúdo 6º ano
Camadas da terra -Litosfera  conteúdo 6º anoCamadas da terra -Litosfera  conteúdo 6º ano
Camadas da terra -Litosfera conteúdo 6º ano
 
6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx
 
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptxSlides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
Slides Lição 6, CPAD, As Nossas Armas Espirituais, 2Tr24.pptx
 
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdfProjeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
Projeto de Extensão - ENGENHARIA DE SOFTWARE - BACHARELADO.pdf
 
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdfProjeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
Projeto_de_Extensão_Agronomia_adquira_ja_(91)_98764-0830.pdf
 
Recomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdf
Recomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdfRecomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdf
Recomposiçao em matematica 1 ano 2024 - ESTUDANTE 1ª série.pdf
 
Slides Lição 6, Betel, Ordenança para uma vida de obediência e submissão.pptx
Slides Lição 6, Betel, Ordenança para uma vida de obediência e submissão.pptxSlides Lição 6, Betel, Ordenança para uma vida de obediência e submissão.pptx
Slides Lição 6, Betel, Ordenança para uma vida de obediência e submissão.pptx
 
Cartão de crédito e fatura do cartão.pptx
Cartão de crédito e fatura do cartão.pptxCartão de crédito e fatura do cartão.pptx
Cartão de crédito e fatura do cartão.pptx
 
Jogo de Rimas - Para impressão em pdf a ser usado para crianças
Jogo de Rimas - Para impressão em pdf a ser usado para criançasJogo de Rimas - Para impressão em pdf a ser usado para crianças
Jogo de Rimas - Para impressão em pdf a ser usado para crianças
 
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
PROJETO DE EXTENSÃO I - TECNOLOGIA DA INFORMAÇÃO Relatório Final de Atividade...
 
Plano de aula Nova Escola períodos simples e composto parte 1.pptx
Plano de aula Nova Escola períodos simples e composto parte 1.pptxPlano de aula Nova Escola períodos simples e composto parte 1.pptx
Plano de aula Nova Escola períodos simples e composto parte 1.pptx
 
matematica aula didatica prática e tecni
matematica aula didatica prática e tecnimatematica aula didatica prática e tecni
matematica aula didatica prática e tecni
 
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdfPROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
PROJETO DE EXTENSÃO I - SERVIÇOS JURÍDICOS, CARTORÁRIOS E NOTARIAIS.pdf
 
Apresentação ISBET Jovem Aprendiz e Estágio 2023.pdf
Apresentação ISBET Jovem Aprendiz e Estágio 2023.pdfApresentação ISBET Jovem Aprendiz e Estágio 2023.pdf
Apresentação ISBET Jovem Aprendiz e Estágio 2023.pdf
 
Currículo - Ícaro Kleisson - Tutor acadêmico.pdf
Currículo - Ícaro Kleisson - Tutor acadêmico.pdfCurrículo - Ícaro Kleisson - Tutor acadêmico.pdf
Currículo - Ícaro Kleisson - Tutor acadêmico.pdf
 
PROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdf
PROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdfPROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdf
PROJETO DE EXTENSÃO - EDUCAÇÃO FÍSICA BACHARELADO.pdf
 
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptxResponde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
Responde ou passa na HISTÓRIA - REVOLUÇÃO INDUSTRIAL - 8º ANO.pptx
 
Seminário Biologia e desenvolvimento da matrinxa.pptx
Seminário Biologia e desenvolvimento da matrinxa.pptxSeminário Biologia e desenvolvimento da matrinxa.pptx
Seminário Biologia e desenvolvimento da matrinxa.pptx
 

Arquitetura da Informação

  • 1. Arquitetura de Informação é o desenho de uma interface, incluindo todos seus fluxos de navegação e estruturação de conteúdo.
  • 2. ASPECTOS INTERACIONAIS DA NAVEGAÇÃO Como interferem?
  • 3.  
  • 4. ARQUITETURA DA INFORMAÇÃO: O QUE É ISSO? Componentes da AI em um website: sistema de organização, sistema de rotulação, sistema de navegação e sistema de busca.
  • 5. USUÁRIO REAL X USUÁRIO IDEAL Design baseado em “personagens”: homem/mulher, adolescente/adulto, solteiro/casado...
  • 6. QUEM SÃO OS RESPONSÁVEIS PELOS CLICKS DOS USUÁRIOS? O Projetista ou Design de interfaces
  • 7. O projetista / design de interfaces leva em consideração 3 fatores prioritários no desenvolvimento de um projeto de internet: * USUÁRIO * SISTEMA * INTERFACE
  • 8. WIREFRAME “ O nome “wireframe” vem da junção de duas palavras em inglês: “wire” (linhas) e “frames” (ecrãs). Ou seja, são ecrãs de baixa resolução e com um aspecto gráfico muito pobre que servem apenas para indicar onde devem estar localizados os objectos e menus de interacção. O wireframe serve para mostrar a funcionalidade e não o aspecto gráfico de uma aplicação.” (GOMES, 2005)
  • 9. FUNÇÕES DO WIREFRAME * Função estrutural * Marcação das etapas de um processo de interação entre usuário e sistema
  • 10. Competências de um Arquiteto de Informação Usabilidade Identidade e Marca
  • 11. RISCOS X VANTAGENS
  • 12. PRINCIPAIS ELEMENTOS DE UM WIREFRAME
  • 13. Exemplo de wireframe de GOMES (2005)
  • 14. PRINCIPAIS SOFTWARES PARA CONSTRUÇÃO DE WIREFRAMES *Visio *Freehand *QuarkXPress *InDesign. *OminiGraffle *llustrator ou ainda, em XHTML
  • 16. INSTITUTO DA ARQUITETURA DA INFORMAÇÃO (Information Architecture Institute) Missão: organização global voluntária para apoiar ações individuais ou organizacionais relacionadas à construção de ambientes de informação compartilhada.
  • 17. O VALOR DA ARQUITETURA DA INFORMAÇÃO Trabalho intangível e invisível = incompreensão e desvalorização
  • 18. REFLEXÃO PROPOSTA PELO INSTITUTO DA ARQUITETURA DA INFORMAÇÃO Qual o custo de… ...encontrar uma informação? ...não encontrar uma informação? … usar uma informação? … construir e gerenciar um sistema de informação?
  • 19. REFLEXÃO PROPOSTA PELO INSTITUTO DA ARQUITETURA DA INFORMAÇÃO Qual o custo de… … educar empregados e consumidores? … criar redes de conhecimento? … fortalecer uma marca? ...encorajar a inovação?
  • 20. Na trilha dos olhos Pesquisas do Instituto Poynter
  • 21. ALGUNS PONTOS-CHAVE DESCOBERTOS PELO ESTUDO DE “EYETRACKING”: *Fotos coloridas não chamam atenção automaticamente *Leitores acessarão jornais online onde o elemento mais forte estiver *Usuários enxergam a página na tela como uma coisa só *Usuários aceitam facilmente o uso de negrito e a experimentação de cores berrantes *As cores não diminuem a aquisição de informação visual pelo usuário.