Trabalho de Design de Interface
Taís Malheiros
Bianca Phaeton
Lívia Neves
Walison Santana
.com.br
• ATIVIDADE 01
DISCIPLINA DESIGN DE INTERFACE
ANÁLISE DO SITE DA EMPRESA NORTE-AMERICANA
XÉROX
WEBARCHIVE
LOGO ATUAL
Imprimir imagens com alta definição. Escanear com qualidade. Digitalizar com perfeição.
“Xerocar”. Copiar com cores vivas ...
Evolução da Marca
Análise da Evolução do layout e conteúdo do Site
1997
- Site sem margens e
diagramação organizada,
hierarquia de conteúdo ...
1997
• Site sem margens e diagramação organizada, hierarquia de conteúdo ou
cor.
• Utilização de ícones para alguns links ...
1998
- Utiliza o logo criado em
1994 com o novo slogan
“The Document
Company”, porém
pequeno, com pouca
visibilidade.
-Uso...
1998
• Layout simples e básico, utilizando fontes do padrão da época (não
segue uma identidade visual própria da marca.) F...
1999
- Ainda é usado o mesmo layout
de 1998: simples e básico (não
segue uma identidade visual
própria da marca. Porém, ag...
1999
• Ainda é usado o mesmo layout de 1998: simples e básico (não segue
uma identidade visual própria da marca. Porém, ag...
2000
- Não foi possível analisar bem
o layout, pois pelo fato do site
ser construído principalmente
por links sobre imagen...
2000
• Não foi possível analisar bem o layout, pois pelo fato do site ser
construído principalmente por links sobre imagen...
2002
- Grande mudança no
layout. Agora este já utiliza
cores e grafismos
institucionais e o wireframe
mudou completamente....
2002
• A partir deste ano percebe-se uma grande mudança no layout do site. Agora este já utiliza cores
e grafismos institu...
2003
- Continua-se utilizando as
novas cores e novos
grafismos institucionais e o
wireframe do site mantém
as mesmas mudan...
2003
• Este ano mantém as grandes mudança no layout do site iniciadas em 2002.
Continua-se utilizando as novas cores e nov...
2004
- Os grafismos utilizados
anteriormente são
substituídos por um
layout mais simples e
clean, priorizando as
cores ins...
2004
• Neste ano o site sofre novamente grandes mudanças. Os grafismos utilizados
anteriormente são substituídos por um la...
2005
- O botão "home" volta
para o menu principal
em primeira posição.
- Destaques para
produtos recomendados
na Home.
2005
• O botão "home" volta para o menu principal em primeira posição.
• Destaques para produtos recomendados na Home.
2006
- Cor da logo menos
explorada no site. Menu
passa a ser azul e a cor
laranja é usada para
destacar categorias nos
lin...
2006
• Cor da logo menos explorada no site. Menu passa a ser azul e a cor
laranja é usada para destacar categorias nos lin...
2008
- Neste ano houve a
maior reformulação do
site, inclusive no logo da
empresa. Site maior,
mas amplo.
- Dispensa do bo...
2008
• Neste ano houve a maior reformulação do site, inclusive no logo da empresa.
Site maior, mas amplo.
• Dispensa do bo...
2010
- Aparecimento do Blog,
como canal de novidades
da Xerox
2010
• Aparecimento do Blog, como canal de novidades da Xerox.
2011
- Mudança de Menu para
um formato que destaca
dois itens importantes:
Produtos e Serviços.
- Home mais estática,
apen...
2011
• Mudança de Menu para um formato que destaca dois itens importantes:
Produtos e Serviços.
• Home mais estática, apen...
2012
- Integração com redes
sociais e blog .
- Nota-se uma inversão
de “produtos” por
“serviços” na posição do
menu do sit...
2012
• Site passa a ser Integrado com redes sociais.
2013
- O site não foi
mais reformulado
este ano, mas
nota-se a inclusão
de imagem dos
produtos e
serviços no
menu, além de...
2013
• O site não foi mais reformulado este ano, mas nota-se a inclusão de
imagem dos produtos e serviços no menu, além de...
OBRIGADO!
Próximos SlideShares
Carregando em…5
×

Xerox _Design de Interação

1.048 visualizações

Publicada em

Publicada em: Design
0 comentários
0 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

  • Seja a primeira pessoa a gostar disto

Sem downloads
Visualizações
Visualizações totais
1.048
No SlideShare
0
A partir de incorporações
0
Número de incorporações
4
Ações
Compartilhamentos
0
Downloads
2
Comentários
0
Gostaram
0
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Xerox _Design de Interação

  1. 1. Trabalho de Design de Interface Taís Malheiros Bianca Phaeton Lívia Neves Walison Santana .com.br
  2. 2. • ATIVIDADE 01 DISCIPLINA DESIGN DE INTERFACE ANÁLISE DO SITE DA EMPRESA NORTE-AMERICANA XÉROX WEBARCHIVE LOGO ATUAL
  3. 3. Imprimir imagens com alta definição. Escanear com qualidade. Digitalizar com perfeição. “Xerocar”. Copiar com cores vivas e muita nitidez. Quando o assunto é imagens não existe especialista maior no mundo que a XEROX, uma empresa líder em processos de negócios e gestão de documentos, oferece tecnologias, especialidades e serviços que permitem que negócios operem com maior precisão e eficiência, em qualquer situação. Chester Carlson, o criador do processo de cópia por fotocondutividade (futuramente conhecido como “xérox”) faz a primeira cópia da história em 1938. Já em 1942 consegue a patente para o seu invento. Em 1947, uma pequena empresa chamada Haloid compra o direito de produzir as primeiras máquinas xerográficas. Em 1948 a empresa inventa o nome Xerox e registra a marca. A empresa tornou-se XEROX CORPORATION oficialmente em 18 de abril de 1961 após ampla aceitação da XEROX 914, a primeira copiadora automática para escritório que utilizava papel comum. Em todo o mundo a XEROX amargou, desde 2001, uma forte queda em suas vendas, associada a uma enorme crise de liquidez, causada pela necessidade de pagar nos Estados Unidos uma multa de US$ 10 milhões por erros contábeis, a maior da história por violação aos informes financeiros. A XEROX que saiu da crise está mais sólida, mas ainda luta para não ser uma cópia pálida de si mesma. Em 2009, a empresa adquiriu a Affiliated Computer Services (ACS) por US$ 6.4 bilhões, operação que colocou a XEROX como líder mundial, além de permitir uma ampliação dos mercados.
  4. 4. Evolução da Marca
  5. 5. Análise da Evolução do layout e conteúdo do Site 1997 - Site sem margens e diagramação organizada, hierarquia de conteúdo ou cor. - Utilização de ícones para alguns links importantes. Banners publicitários em gif animado. Presença do logo em tamanho pequeno e do “X” como um logotipo. Apresentação da empresa na Home. Formulário grande de “Fale conosco” com o nome de “Linha Direta”.
  6. 6. 1997 • Site sem margens e diagramação organizada, hierarquia de conteúdo ou cor. • Utilização de ícones para alguns links importantes. • Banners publicitários em gif animado. • Presença do logo em tamanho pequeno e do “X” como um logotipo. • Apresentação da empresa na Home. • Formulário grande de “Fale conosco” com o nome de “Linha Direta”.
  7. 7. 1998 - Utiliza o logo criado em 1994 com o novo slogan “The Document Company”, porém pequeno, com pouca visibilidade. -Uso frequente de gif animado para dar movimento ao site - No meio da página estão os dois principais setores do site: produtos & serviços (catálogo) e softwares & drivers e na coluna direita estão os “trending topics” - No topo está o menu de apoio, com itens como “mapa do site” e abaixo um banner do principal lançamento da época, no caso a máquina Document WorkCentre Pro 745 - Layout simples e básico, utilizando fontes do padrão da época (não segue uma identidade visual própria da marca.) Faz uso do vermelho do logo no design do site.
  8. 8. 1998 • Layout simples e básico, utilizando fontes do padrão da época (não segue uma identidade visual própria da marca.) Faz uso do vermelho do logo no design do site. • Utiliza o logo criado em 1994 com o novo slogan “The Document Company”, porém pequeno, com pouca visibilidade. • Uso frequente de gif animado para dar movimento ao site • Apresenta como menu principal o lateral contendo os ícones: planeta XEROX (história da marca), drivers & softwares, atendimento ao cliente, aqui tem Xerox (localização de pontos de venda) e novidade (feed de notícias da marca). • No meio da página estão os dois principais setores do site: produtos & serviços (catálogo) e softwares & drivers e na coluna direita estão os “trending topics” • No topo está o menu de apoio, com itens como “mapa do site” e abaixo um banner do principal lançamento da época, no caso a máquina Document WorkCentre Pro 745
  9. 9. 1999 - Ainda é usado o mesmo layout de 1998: simples e básico (não segue uma identidade visual própria da marca. Porém, agora já faz uso de fontes coloridas como forma de diagramação para diferentes conteúdos - Ainda se utiliza o logo criado em 1994 com o novo slogan “The Document Company”. - A parte do meio do site agora contém um texto como uma chamada de um grande acontecimento para a marca, junto de uma imagem ilustrativa (espaço destinado para propaganda própria) - No topo está o menu de apoio, com itens como “mapa do site” e abaixo um banner com propaganda própria - O menu principal continua na lateral esquerda, mas agora foram adicionados os itens “compre aqui – loja Xerox”, “novidades” e “Xerox no ano 2000” (ano seguinte).
  10. 10. 1999 • Ainda é usado o mesmo layout de 1998: simples e básico (não segue uma identidade visual própria da marca. Porém, agora já faz uso de fontes coloridas como forma de diagramação para diferentes conteúdos • Ainda se utiliza o logo criado em 1994 com o novo slogan “The Document Company”. • A parte do meio do site agora contém um texto como uma chamada de um grande acontecimento para a marca, junto de uma imagem ilustrativa (espaço destinado para propaganda própria) • O menu principal continua na lateral esquerda, mas agora foram adicionados os itens “compre aqui – loja Xerox”, “novidades” e “Xerox no ano 2000” (ano seguinte). • A parte da lateral direita ainda é destinada aos “trending topics” • No topo está o menu de apoio, com itens como “mapa do site” e abaixo um banner com propaganda própria
  11. 11. 2000 - Não foi possível analisar bem o layout, pois pelo fato do site ser construído principalmente por links sobre imagens sem tags de acessibilidade, uma vez que estas imagens não estão mais disponíveis nas redes, não é possível ver o que estava naquele espaço do site. Logo, apesar de perceber mudanças no posicionamento do conteúdo, não é possível analisar os grafismos em si. - A página principal perde seus cantos arredondados, passando a ter um visual mais sério e menos colorido. - O menu de apoio continua no topo, mas agora encontra-se abaixo do banner de propaganda própria. - A parte do meio da página agora é dividida entre duas chamadas para grandes acontecimentos da marca, cada um associado a uma imagem ilustrativa. - A parte da lateral direita agora contém além dos trending topics, o botão para se inscrever na mailling list da marca.
  12. 12. 2000 • Não foi possível analisar bem o layout, pois pelo fato do site ser construído principalmente por links sobre imagens sem tags de acessibilidade, uma vez que estas imagens não estão mais disponíveis nas redes, não é possível ver o que estava naquele espaço do site. Logo, apesar de perceber mudanças no posicionamento do conteúdo, não é possível analisar os grafismos em si. • A página principal perde seus cantos arredondados, passando a ter um visual mais sério e menos colorido. • O menu de apoio continua no topo, mas agora encontra-se abaixo do banner de propaganda própria. • A parte do meio da página agora é dividida entre duas chamadas para grandes acontecimentos da marca, cada um associado a uma imagem ilustrativa. • A parte da lateral direita agora contém além dos trending topics, o botão para se inscrever na mailling list da marca.
  13. 13. 2002 - Grande mudança no layout. Agora este já utiliza cores e grafismos institucionais e o wireframe mudou completamente. - O header ficou maior e assim foi possível colocar uma imagem grande em destaque junto com o logo da empresa (mesmo posicionamento que as versões anteriores), com um campo de busca ao lado e o botão para encontrar os pontos de venda. Abaixo está um banner institucional. - O menu agora é um só e encontra-se abaixo do banner (ainda no topo). - A parte de conteúdo do site foi dividida em três colunas de larguras iguais. - O menu de apoio virou o rodapé do site e fica junto do símbolo da marca (antes não utilizado). -Agora o site possui ferramenta de filtro interna.
  14. 14. 2002 • A partir deste ano percebe-se uma grande mudança no layout do site. Agora este já utiliza cores e grafismos institucionais e o wireframe do site mudou completamente. • O header ficou maior e assim foi possível colocar uma imagem grande em destaque junto com o logo da empresa (mesmo posicionamento que as versões anteriores), porém em maior tamanho e em destaque no topo da página, com um campo de busca ao lado e o botão para encontrar os pontos de venda. Abaixo está um banner institucional. • O menu agora é um só e encontra-se abaixo do banner (ainda no topo) contendo os itens: produtos (antigo produtos & serviços), Suprimentos, Soluções por indústria, Serviços para Empresas, Suportes & Drivers e Minha Xerox. • A parte de conteúdo do site foi dividida em três colunas de larguras iguais: a da esquerda destinada para atalhos dos setores principais do site e considerada uma das melhores evoluções deste novo formato de site - hiperlink para navegação dentro do conteúdo do site - (drivers para download, como comprar, portal dos fornecedores, recursos humanos, instituto Xerox e portal Sophya), a coluna do meio destinada a imagens de propaganda própria e a da direita, ainda destinada aos “trending topics”, mas que agora não tem mais o botão para se inscrever na mailling list e sim o Planeta Xerox (que saiu do menu principal e dos principais atalhos). • O menu de apoio virou o rodapé do site e fica junto do símbolo da marca (antes não utilizado). • Agora o site possui ferramenta de filtro interna.
  15. 15. 2003 - Continua-se utilizando as novas cores e novos grafismos institucionais e o wireframe do site mantém as mesmas mudanças. No topo que foi adicionada uma notificação de que alguma páginas só poderiam ser exibidas em inglês; mudaram os botões do menu principal e dos atalhos da coluna esquerda da parte de conteúdo. Mudanças realizadas após o feedback dos clientes e provavelmente devido a testes. - Nas imagens de apoio da área central, foi retirada a opção de link de texto da imagem, mantendo somente a imagem como um link. - Ausência de gif, troca pelo flash , porém a quantidade de textos continua grande.
  16. 16. 2003 • Este ano mantém as grandes mudança no layout do site iniciadas em 2002. Continua-se utilizando as novas cores e novos grafismos institucionais e o wireframe do site mantém as mesmas mudanças. • As únicas mudanças que podem ser percebidas em relação a versão de 2002 é no topo que foi adicionada uma notificação de que alguma páginas só poderiam ser exibidas em inglês; mudaram os botões do menu principal e dos atalhos da coluna esquerda da parte de conteúdo. Mudanças realizadas após o feedback dos clientes e provavelmente devido a testes. • Nas imagens de apoio da área central, foi retirada a opção de link de texto da imagem, mantendo somente a imagem como um link. • Ausência de gif, troca pelo flash , porém a quantidade de textos continua grande.
  17. 17. 2004 - Os grafismos utilizados anteriormente são substituídos por um layout mais simples e clean, priorizando as cores institucionais (vermelho, azul e branco, nesta ordem de importância). - O topo agora contém o logo no canto esquerdo, acima o campo de seleção do país (sinaliza que o site já é adaptável para diferentes idiomas na mesma página), campo de busca ao lado e no canto direito dois botões com as tags “como comprar” e “loja Xerox”. Agora o banner institucional é animado. Menu principal teve os seus ícones mudados e agora está menor, apresentando somente quatro botões. ou seja, uma estrutura mais direta e simples para o acesso ao conteúdo do site. - O conteúdo agora apresenta uma estrutura mais harmônica e tem somente duas colunas, uma da esquerda menor, um menu com informações úteis para o cliente e outro com informações sobre a empresa e do lado, direito, links para os principais produtos e para promoções, além de dois banners com propaganda de produtos de lançamento. - O rodapé do site com o menu de apoio e o logo associado a marca das Olímpiadas e com a sinalização de marca registrada e direitos reservados. - Chamadas mais concentrada, menos conteúdo espalhado pelo site
  18. 18. 2004 • Neste ano o site sofre novamente grandes mudanças. Os grafismos utilizados anteriormente são substituídos por um layout mais simples e clean, priorizando as cores institucionais (vermelho, azul e branco, nesta ordem de importância). • O topo agora contém o logo no canto esquerdo (mesma posição das versões anteriores), acima o campo de seleção do país (grande melhoria em relação a versão anterior, pois sinaliza que o site já é adaptável para diferentes idiomas na mesma página), com o campo de busca ao lado e no canto direito dois botões com as tags “como comprar” e “loja Xerox”. Agora o banner institucional é animado e fica abaixo do menu principal e este teve os seus ícones mudados novamente e agora está menor, agora apresenta somente quatro botões, ou seja, uma estrutura mais direta e simples para o acesso ao conteúdo do site. • A parte do conteúdo agora apresenta uma estrutura mais harmônica e tem somente duas colunas, uma da esquerda menor com um menu com informações úteis para o cliente e outro com informações sobre a empresa e uma maior do lado direito com links para os principais produtos do momento, links para promoções e dois banners de propaganda de produtos de lançamento. • O rodapé do site continua com o menu de apoio, mas agora apresenta o logo associado a marca das Olímpiadas e também com a sinalização de marca registrada e direitos reservados. • Chamadas mais concentrada, menos conteúdo espalhado pelo site
  19. 19. 2005 - O botão "home" volta para o menu principal em primeira posição. - Destaques para produtos recomendados na Home.
  20. 20. 2005 • O botão "home" volta para o menu principal em primeira posição. • Destaques para produtos recomendados na Home.
  21. 21. 2006 - Cor da logo menos explorada no site. Menu passa a ser azul e a cor laranja é usada para destacar categorias nos links laterais. - Aparece mais um menu horizontal com três informações possivelmente consideradas mais importantes: HOME, Como Comprar, Fale Conosco. - Menu horizontal de produtos ganha dropdown. - Rodapé ganha cor mais neutra. Cores são usadas para hierarquizar destaque de informações.
  22. 22. 2006 • Cor da logo menos explorada no site. Menu passa a ser azul e a cor laranja é usada para destacar categorias nos links laterais. • Rodapé ganha cor mais neutra. Cores são usadas para hierarquizar destaque de informações. • Aparece mais um menu horizontal com três informações possivelmente consideradas mais importantes: HOME, Como Comprar, Fale Conosco. • Menu horizontal de produtos, ganha dropdown.
  23. 23. 2008 - Neste ano houve a maior reformulação do site, inclusive no logo da empresa. Site maior, mas amplo. - Dispensa do botão "Home" no menu principal, utilização de link na logo - Destaque de notícias, momento em que o conteúdo começa a ganhar importância - Site clean, sem muitas bordas e linhas e com maior organização de conteúdo. Utilização de cores e imagens no dropdown do menu. - Utilização de fontes pequenas em quase toda a Home, para melhor organização e entendimento. - Mouseover padrão para o links. - Maior destaque para banner em flash com informações de responsabilidades e sustentabilidade da empresa. Empresa se preocupa mais com responsabilidade sócio ambiental.
  24. 24. 2008 • Neste ano houve a maior reformulação do site, inclusive no logo da empresa. Site maior, mas amplo. • Dispensa do botão "Home" no menu principal, utilização de link na logo. • Maior destaque para banner em flash com informações de responsabilidades e sustentabilidade da empresa. Empresa se preocupa mais com responsabilidade sócio ambiental. • Destaque de notícias, momento em que o conteúdo começa a ganhar importância • Site clean, sem muitas bordas e linhas e com maior organização de conteúdo. Utilização de cores e imagens no dropdown do menu. • Utilização de fontes pequenas em quase toda a Home, para melhor organização e entendimento. • Mouseover padrão para o links.
  25. 25. 2010 - Aparecimento do Blog, como canal de novidades da Xerox
  26. 26. 2010 • Aparecimento do Blog, como canal de novidades da Xerox.
  27. 27. 2011 - Mudança de Menu para um formato que destaca dois itens importantes: Produtos e Serviços. - Home mais estática, apenas com a movimentação do banner, mas sem utilização de Flash. - Banner ocupa a maior parte da Home. - Diminuição de informações em destaques. Muitas passaram para o rodapé como link. - Utilização de bordas, como box e links em imagens e "call to action". - Divulgação da loja Virtual, o que leva a crer que é por esse motivo que possui menos informação em destaque. - Utilização do termo "contato" no menu.
  28. 28. 2011 • Mudança de Menu para um formato que destaca dois itens importantes: Produtos e Serviços. • Home mais estática, apenas com a movimentação do banner, mas sem utilização de Flash. • Banner ocupa a maior parte da Home. • Diminuição de informações em destaques. Muitas informações passaram para o rodapé como link. • Utilização de bordas, como box e links em imagens e "call to action". • Divulgação da loja Virtual, o que leva a crer que é por esse motivo que possui menos informação em destaque. • Utilização do termo "contato" no menu. • Divisão do site em parte branca e barra cinza, causa a impressão de termino da Home.
  29. 29. 2012 - Integração com redes sociais e blog . - Nota-se uma inversão de “produtos” por “serviços” na posição do menu do site, provavelmente por algum resultado de teste.
  30. 30. 2012 • Site passa a ser Integrado com redes sociais.
  31. 31. 2013 - O site não foi mais reformulado este ano, mas nota-se a inclusão de imagem dos produtos e serviços no menu, além de links e botões que levam direto para a loja online ou para busca de loja física.
  32. 32. 2013 • O site não foi mais reformulado este ano, mas nota-se a inclusão de imagem dos produtos e serviços no menu, além de links e botões que levam direto para a loja online ou para busca de loja física.
  33. 33. OBRIGADO!

×