Posts Tagged redesign
Redesenho do site da Mirandouro
Postado por Marco Moreira em arquitetura de Informação, design dia September 24th, 2010
A Mirandouro é uma empresa tradicional na fabricação de jóias em ouro 18k e seus clientes possuem por natureza um alto grau de exigência no que diz respeito a imagem e a design, por isso ela precisava de um site que pudesse traduzir um pouco a sua imagem no mercado.
A empresa já tinha um site com um visual definido e o cliente queria “dar vida” e movimento ao site já existente. É aí que o designer aqui entra.
Propus então alguns ajustes no layout sem perder a característica já adotada, fazendo com que a nova proposta visual pudesse se encaixar melhor na construção do site em Flash. Então fiz alguns rafes em cima do layout antigo sugerindo as melhorias para o cliente com a preocupação de enriquecer a experiência do usuário, valorizar o produto e dar maior legibilidade e clareza aos textos, botões e imagens.
Com a ideia aprovada, layoutei todas as páginas. Abaixo você poderá ver um panorama geral da mudança do antigo para o novo (clique na imagem para ampliar).
Depois de todas as telas aprovadas, parti para a produção em Flash que você pode ver agora no ar.
Redesign do site da Mundo Estranho
Postado por Marco Moreira em arquitetura de Informação, design dia October 7th, 2008
Wireframe
O site da Mundo Estranho passou por uma reformulação radical. O objetivo foi a diminuição de peso e banda ocasionados pelo grande conteúdo Multimídia que o site anterior tinha, ter mais foco no que a marca tem de mais forte (curiosidades), melhorar a usabilidade e agilidade na navegação e fazer uma grande busca por perguntas e palavras-chave para que o usuário possa encontrar a resposta em forma de texto e infográficos que dão apoio às respostas.
Dentro deste objetivo comecei a organizar a informação e navegação no Axure (imagem abaixo) e finalizado e aprovado a navegação, parti para o layout do site, que segue bem a estrutura criada.
Layout
Realizei o estudo de cores e iconografia dos canais priorizando o uso de CSS, melhorando a indexação em buscadores, padronização e compatibilidade com diversos browsers, estudo de tamanhos de título e conteúdo, RSS, tamanho e padrões de imagens, módulos na home com tamanhos de imagens diferenciadas dando maior flexibilidade para o Editor e um box do lado esquerdo com rápido acesso à área participativa para assinantes e leitores da revista.
Paleta de cores
Paleta usada como “manual” com a finalidade de facilitar a vida do programador e para quem irá trabalhar com o site daqui pra frente.
Iconografia dos canais
Seguindo as cores dos canais, a designer Fabi Zambon me ajudou a conceber a iconografia de maneira que fosse facilmente reconhecida e claro, o nome do canal acompanha o ícone.
Padrões das imagens
Foi pensado também na padronização das imagens da home, imagens de promoção e tamanho padrão das capas de revista a fim de facilitar também no trabalho de atualização do designer/editor.
Magel aqui também: