SlideShare uma empresa Scribd logo
Design de Navegação Web




    Wellington Marion
http://www.flickr.com/photos/dcdead/4547624487/sizes/o/
Design de navegação web
http://www.flickr.com/photos/20475648@N00/3143764143/


James Kalbach
Sobre o autor
• James Kalbach é graduado em
  biblioteconomia e ciências da informação pela
  Rutgers University e mestrado em teoria e
  composição musical.

• Engenheiro de fatores humanos na LexisNexis,
  empresa líder no fornecimento de informação
  legais e notícias. Mora na Alemanha na cidade
  Hamburgo.

                      http://www.flickr.com/photos/groundzero/121209620/sizes/l/in/set-72057594111871203/
Organização deste livro
• 1 Fundamentos da Navegação



• 2 Um framework para Design de Navegação



• 3 Navegação em Contextos Especiais


                         http://www.flickr.com/photos/groundzero/121211152/sizes/l/in/photostrea
Definição navegação web
• A teoria e a pratica de como as pessoas
  movem-se de página para página na Web
• O processo de busca direcionada a objetivos e
  localização de informação hiperligadas;
  navegação web
• Todos os links, rótulos e outros elementos que
  fornecem acesso a páginas e auxiliam as
  pessoas orientar-se interagem com um dado
  site web

                     http://www.flickr.com/photos/44732300@N04/4764500270/sizes/l/in/pool-14477233@N00/
Design de navegação web
Design de navegação web
Design de navegação web
Design de navegação web
Design de navegação web
Design de navegação web
Filosofia de design
• Maioria de projetos web tem perspectiva de
  designer.

• Design centrado no usuário

• Design centrado no design



                 http://www.flickr.com/photos/patrick-smith-photography/4566993532/sizes/o/in/photostream/
Filosofia de design
• Design centrado na empresa

• Design centrado no conteúdo

• Design centrado na tecnologia




                   http://www.flickr.com/photos/patrick-smith-photography/4566993532/sizes/o/in/photostream/
Design de Navegação Web




    Wellington Marion
As Vantagens do design centrado
              no usuário
Reduzir custo.
       Expor problemas e detectar falhas


   Fomentando inovação real.
       Experiências do usuários


   Fornecendo uma vantagem estratégica
       Cultura, social, cognitivo e físico
Projetar uma aplicação web
   Como são chamados os conceitos primários
    do sistema?
       EDI


    Como são chamados os conceitos
    secundários?
       Pagamento ou cobrança
Projetar uma aplicação web
   Como são chamadas as ações que os usuários
    podem efetuar sobre os conceitos?
       Criar, Aprovar, Reprovar


   Como você pode obter vantagens?
       Rapidez, qualidade, garantia.
Projetando para emoção

Projetar para experiências do usuários

Engajamento do usuário

Prazer ao usar o mesmo e divertir-se ao usar.
O processo de busca por
                 informação
   Iniciação
       Lacuna no conhecimento


   Seleção
       Identificar e selecionar o tópico de investigação


   Exploração
       Sentimento de incerteza, confusão e dúvida
O processo de busca por
                 informação
   Formulação
       Confiança e incerteza


   Coleção
       Confiança continua aumentando


   Apresentação
       Sensação de satisfação ou descontentamento
Obrigado!!

    http://www.flickr.com/photos/44732300@N04/4718162647/sizes/l/in/pool-14477233@N00
Referências
http://www.flickr.com/photos/20475648@N00/3143764143/
http://www.flickr.com/photos/dcdead/4547624487/sizes/o/
http://www.flickr.com/photos/patrick-smith-photography/4668777251/sizes/l/in/photostream/
http://www.flickr.com/photos/benheine/3968288061/sizes/o/in/set-72157622526489442/
http://www.flickr.com/photos/vicfan/4130460992/sizes/l/in/set-72157622872611854/
http://www.flickr.com/photos/patrick-smith-photography/4627088684/sizes/o/in/photostream/
http://www.flickr.com/photos/patrick-smith-photography/4606623402/sizes/o/in/photostream/
http://www.flickr.com/photos/44732300@N04/4764500270/sizes/l/in/pool-14477233@N00/
http://www.flickr.com/photos/patrick-smith-photography/4690727287/sizes/l/in/photostream/
http://www.flickr.com/photos/patrick-smith-photography/3778473630/sizes/o/in/photostream/
http://www.flickr.com/photos/patrick-smith-photography/3578457069/sizes/o/in/photostream/

Mais conteúdo relacionado

Destaque (19)

ODP
Desing de navegação web parte III
Wellington Marion
 
PDF
Design para a web - da interface ao branding
João Alves
 
PDF
HTML, CSS & Style Guides
Bruno Trecenti
 
KEY
HTML/CSS Patterns
Leonardo Quixada
 
PDF
Arquitetura da Informação
Karine Drumond
 
PPTX
Apresentação do livro o guia para projetar ux
Lucas Darros Lorençon
 
PDF
UX Design na AG2
Samantha Rosa
 
PDF
[QCon Rio 2015] UX para desenvolvedores
Tássia Spinelli
 
PDF
Usabilidade 2 - Metas, princípios e leis do design, agile vs dcu
Marcello Cardoso
 
PDF
UX como estratégia para conquistar clientes e impactar negócios
Priscilla Albuquerque
 
PPTX
UX - Entregaveis
Daniel Coscarelli
 
PDF
Marília Veiga Interiores
Marília Veiga Interiores
 
PDF
Projetando além da usabilidade
fmemoria
 
PPS
Princípios Gerais para o Design de Interfaces
peres marlene
 
PPTX
Verner Panton
jasmine_
 
PPTX
Apresentação Terreno Maraponga
ItaloHolanda
 
PPTX
Verner Panton
Gabriela Espínola
 
PPTX
Arquitetura
Ste Escola Bernardino
 
PDF
UX para desenvolvedores - UX Conf BR 2015
Samantha Rosa
 
Desing de navegação web parte III
Wellington Marion
 
Design para a web - da interface ao branding
João Alves
 
HTML, CSS & Style Guides
Bruno Trecenti
 
HTML/CSS Patterns
Leonardo Quixada
 
Arquitetura da Informação
Karine Drumond
 
Apresentação do livro o guia para projetar ux
Lucas Darros Lorençon
 
UX Design na AG2
Samantha Rosa
 
[QCon Rio 2015] UX para desenvolvedores
Tássia Spinelli
 
Usabilidade 2 - Metas, princípios e leis do design, agile vs dcu
Marcello Cardoso
 
UX como estratégia para conquistar clientes e impactar negócios
Priscilla Albuquerque
 
UX - Entregaveis
Daniel Coscarelli
 
Marília Veiga Interiores
Marília Veiga Interiores
 
Projetando além da usabilidade
fmemoria
 
Princípios Gerais para o Design de Interfaces
peres marlene
 
Verner Panton
jasmine_
 
Apresentação Terreno Maraponga
ItaloHolanda
 
Verner Panton
Gabriela Espínola
 
UX para desenvolvedores - UX Conf BR 2015
Samantha Rosa
 

Semelhante a Design de navegação web (20)

PDF
Curso de Marketing Digital - dia 2
PontoBr Digital
 
PDF
10 Razões para continuar apostando nos Blogs
PaperCliQ Comunicação
 
PDF
Design Thinking -Análise e Síntese
UFPA
 
PDF
Gestão de Conteudo para Midias Sociais
Lisandra Maioli
 
PPTX
Design de Interfaces
Ana Migowski
 
PDF
Introducão à Ciência de Dados
João Pedro Albino
 
PPTX
Growth hacking e a redefinição do marketing digital - Maratona Digital
Maratona Digital
 
PPTX
SurveyMonkey
Pricila Yessayan
 
PPT
Como o Profissional de RP pode utilizar as mídias digitais
Gutenberg Almeida
 
PDF
Oficina de Criacao e Validacao de Ideias
UFPA
 
PPTX
Criação/Gestao_de_conteudos_digital_ppt.pptx
SilviaCunja
 
PPT
Enlink - Marketing Digital para Pequenas e Medias Empresas
Enlink
 
PDF
Monitoramento Online e Coleta de Dados para Pesquisa Acadêmica
PaperCliQ Comunicação
 
PPTX
Cesar.Edu Turma S2I
Victor Ximenes
 
PDF
Ideação de Produtos e Geração de Ideias
Leonardo Monteiro de Miranda
 
PDF
Fase de Validação - Encaixe Produto Mercado
Cotidiano Aceleradora de Startups
 
PDF
Oficina de Financiamento Coletivo para Quadrinhos (FIQ 2013)
Catarse
 
PDF
Construa o seu website com o wordpress
Cady Bocum
 
PPTX
Algumas dicas para o uso da web
Luis Borges Gouveia
 
PDF
Sistemas de Recomendação Aplicados a WebComo converter visitantes em comprado...
Arthur Fortes
 
Curso de Marketing Digital - dia 2
PontoBr Digital
 
10 Razões para continuar apostando nos Blogs
PaperCliQ Comunicação
 
Design Thinking -Análise e Síntese
UFPA
 
Gestão de Conteudo para Midias Sociais
Lisandra Maioli
 
Design de Interfaces
Ana Migowski
 
Introducão à Ciência de Dados
João Pedro Albino
 
Growth hacking e a redefinição do marketing digital - Maratona Digital
Maratona Digital
 
SurveyMonkey
Pricila Yessayan
 
Como o Profissional de RP pode utilizar as mídias digitais
Gutenberg Almeida
 
Oficina de Criacao e Validacao de Ideias
UFPA
 
Criação/Gestao_de_conteudos_digital_ppt.pptx
SilviaCunja
 
Enlink - Marketing Digital para Pequenas e Medias Empresas
Enlink
 
Monitoramento Online e Coleta de Dados para Pesquisa Acadêmica
PaperCliQ Comunicação
 
Cesar.Edu Turma S2I
Victor Ximenes
 
Ideação de Produtos e Geração de Ideias
Leonardo Monteiro de Miranda
 
Fase de Validação - Encaixe Produto Mercado
Cotidiano Aceleradora de Startups
 
Oficina de Financiamento Coletivo para Quadrinhos (FIQ 2013)
Catarse
 
Construa o seu website com o wordpress
Cady Bocum
 
Algumas dicas para o uso da web
Luis Borges Gouveia
 
Sistemas de Recomendação Aplicados a WebComo converter visitantes em comprado...
Arthur Fortes
 
Anúncio

Mais de Wellington Marion (9)

PDF
Reuniões eficazes Integração Criatividade Produtividade
Wellington Marion
 
PDF
Dicas de oratória
Wellington Marion
 
PDF
Liderando na Velocidade da Confiança
Wellington Marion
 
PDF
As 5 tentações de um CEO
Wellington Marion
 
PDF
Test day 2012
Wellington Marion
 
PDF
Periódicos março testers
Wellington Marion
 
PDF
TDC 2011 Trilha de Teste
Wellington Marion
 
ODP
Desing de navegação web parte IV
Wellington Marion
 
PPTX
Ergodesing e arquitetura de Informação
Wellington Marion
 
Reuniões eficazes Integração Criatividade Produtividade
Wellington Marion
 
Dicas de oratória
Wellington Marion
 
Liderando na Velocidade da Confiança
Wellington Marion
 
As 5 tentações de um CEO
Wellington Marion
 
Test day 2012
Wellington Marion
 
Periódicos março testers
Wellington Marion
 
TDC 2011 Trilha de Teste
Wellington Marion
 
Desing de navegação web parte IV
Wellington Marion
 
Ergodesing e arquitetura de Informação
Wellington Marion
 
Anúncio

Último (7)

PPTX
Gestão de Mudanças - O que é e como é implementada
Gateware Group
 
PPTX
Desenvolvimento-de-Produtos-Inovadores.pptx
ssuser1d7565
 
PPTX
Computacao-e-Tecnologias-Digitais-Por-Que-Aprender.pptx
RobertaOliveiradaFon1
 
PPTX
Gestão de Mudanças - Os maiores desafios da Gestão de Mudanças e Gestão de Pr...
Gateware Group
 
PPTX
Gestão de Mudanças - Fases do processo de mudança organizacional
Gateware Group
 
PDF
Explorando o Futuro do Corpo: Implantes Neurais e o Biohacking dos Sentidos
cooperliora
 
PDF
Certificado em Redes Neurais Artificiais em Python
CaioSilva506151
 
Gestão de Mudanças - O que é e como é implementada
Gateware Group
 
Desenvolvimento-de-Produtos-Inovadores.pptx
ssuser1d7565
 
Computacao-e-Tecnologias-Digitais-Por-Que-Aprender.pptx
RobertaOliveiradaFon1
 
Gestão de Mudanças - Os maiores desafios da Gestão de Mudanças e Gestão de Pr...
Gateware Group
 
Gestão de Mudanças - Fases do processo de mudança organizacional
Gateware Group
 
Explorando o Futuro do Corpo: Implantes Neurais e o Biohacking dos Sentidos
cooperliora
 
Certificado em Redes Neurais Artificiais em Python
CaioSilva506151
 

Design de navegação web