Design Interativo

Um olhar sobre o novo design MSN.Com

Desde 9 de março deste ano, a Microsoft está lançando seu novo design do MSN.com.

Apoiado por incontáveis ​​horas de testes e cerca de 70.000 peças de feedback de seus usuários, o design foi ajustado nos últimos quatro meses para o estado atual.

Visitantes que ainda não podem visualizá-lo em http://www.msn.com pode acessá-lo em http://preview.msn.com .

Neste post, vamos dar uma olhada no novo redesenho e examinar seus aspectos positivos e negativos.

Sinta-se livre para compartilhar sua opinião sobre o design na área de comentários.

Na última década, três páginas de pesquisa principais estabeleceram uma base sólida como sites para os quais as pessoas recorrem quando iniciam suas experiências on-line.

Enquanto o Yahoo e o MSN se concentraram em adicionar elementos funcionais às suas páginas, o Google ficou com um design minimalista e, em vez disso, colocaram seus novos aplicativos em URLs diferentes, com menções apenas sutis na página principal. O Google saiu na frente, mas o Yahoo e o MSN não desistiram e ainda detêm a maior parte do mercado.

Um dos principais objetivos do novo design é atualizar a interface com uma aparência muito mais limpa; uma aparência que lembra o Google. Para conseguir isso, eles mudaram o plano de fundo para um branco consistente e adicionaram guias às várias seções de conteúdo. Eles também deram um peso visual maior para a seção de notícias principal, dando-lhe um título maior e tornando suas imagens maiores. Isso dá ao usuário uma indicação clara de onde seus olhos devem ser imediatamente desenhados, o que ajuda a deixar o site menos ocupado.

O fundo branco faz com que o site pareça limpo, mas o faz à custa de perder o azul, o que tornou o site antigo facilmente reconhecível e único. Apesar do feedback que o MSN vem recebendo que afirma que o fundo branco parece mais limpo, pode ser benéfico a longo prazo para a Microsoft abraçar sua antiga cor de fundo azul. Ao ir com uma única cor de fundo, muitas linhas verticais foram removidas. Isso faz com que o site pareça mais amplo, apesar de ser um pouco mais fino em cerca de 20 pixels.

As guias também fazem a página parecer muito mais limpa. As seções da página não parecem ser agrupadas de maneira óbvia, mas isso não é necessariamente prejudicial. O MSN percebe que esta página não será usada como um jornal ou mesmo como um site de notícias.

Cada seção fornece pequenas manchetes e frases curtas com o objetivo de estimular o leitor a clicar e aprender mais. Ao falar sobre o novo design, Scott Moore (Gerente Geral de Conteúdo e Programação do MSN) explicou que o site usa aprendizado de máquina para dividir os usuários em oito grupos.

Ele não analisou os detalhes, mas isso pode significar que o posicionamento das seções / guias será determinado pelas coisas nas quais os usuários mostraram interesse.

Adições de Conteúdo

Um recurso que a equipe do MSN decidiu se concentrar em redes sociais. Os usuários podem agora entrar em sua conta do Windows Live / Facebook / Twitter para obter atualizações ao vivo exibidas em sua página inicial do MSN.

Este é um recurso que algumas pessoas acharão um pouco útil e outras ignorarão completamente. “Social Media” tem sido uma palavra da Internet há mais de um ano e é surpreendente que o MSN tenha demorado tanto para integrá-lo em sua home page.

A adição à mídia social não influenciará muitas pessoas a usar sua página inicial, mas isso não afeta negativamente sua aparência e mostra que está adotando a Internet, em vez de forçar seus usuários a usar apenas os aplicativos do MSN.

O redesign da página inicial do MSN deu à barra de pesquisa do Bing muito mais destaque. Foi dado a sua própria seção em vez de ser forçado a compartilhar seu espaço com muitos elementos diversos.

Esse aumento na atenção do Bing deu ao mecanismo de busca um aumento de dois dígitos nas pesquisas. A maior barra de pesquisa do Bing pode ser uma das melhores características do redesign do MSN, pois mostra que o MSN agora tem um melhor entendimento de que as homepages são geralmente usadas como ponto de partida para uma pesquisa na web. As pessoas serão rápidas em mudar sua página inicial se acharem que o MSN está demorando demais para carregar conteúdo irrelevante.

A terceira grande adição é o foco no conteúdo local. No canto superior direito da página há um link para o Local Edition. O Local Edition é como outra versão da página inicial, mas é mais relevante para cada indivíduo. O usuário pode salvar até três cidades diferentes (ou códigos postais), mas não é muito intuitivo sobre como adicioná-las. O usuário deve inserir um nome de cidade, clicar em "Salvar" e depois adicionar outro nome e clicar em "Alterar". Faz mais sentido, em vez disso, ter o link como "Adicionar".


Edição local

Depois que o usuário seleciona uma cidade, ele tem acesso a notícias locais, clima, esportes, filmes / eventos, restaurantes, gás / trânsito e alguns outros itens. Todos esses recursos são realmente bem implementados, exceto na seção Restaurantes.

Para os restaurantes, basta listar os restaurantes nas proximidades com links para comentários, imagens de 5 estrelas e direções. Quando os links de Revisão ou Classificação são clicados, é carregada uma página que lista vários detalhes sobre o restaurante, mas não há comentários de clientes e o widget de classificação não é visto em lugar algum. Parece que esse recurso foi tirado de um livro de referência estático.

sOs outros recursos são bem feitos e vale a pena testá-los. Esteja ciente de que, neste momento, o Local Edition só está disponível nos Estados Unidos.

A última novidade que vale a pena mencionar é o recurso TrendWatch, que lista as últimas tendências do Twitter. Esse recurso é estranhamente semelhante à seção Trending Now do Yahoo, mas possui setas ao lado de cada consulta de pesquisa para mostrar seu momentum de popularidade. É um pouco brega e seu posicionamento na parte inferior da página faz com que pareça mais uma reflexão do que um recurso útil.


Trending Now do Yahoo comparado com o TrendWatch do MSN


atuação

Curiosamente, o antigo site do MSN faz o download de todo o seu conteúdo para a máquina do usuário usando um segundo a menos que o novo design. O novo design, em seguida, executa muito mais código, fazendo com que seu tempo de conclusão total seja quase 3 segundos maior que o antigo.

O Local Edition apresenta um desempenho um pouco melhor do que o novo com um tempo de documento de 2.582 segundos, mas o tempo totalmente pronto é de 10.545 segundos devido a um vídeo incorporado sendo carregado.

Como tudo é exibido aproximadamente na mesma quantidade de tempo, os usuários provavelmente não perceberão a diferença no desempenho e isso pode ser prejudicial ao sucesso do novo design.

As home pages devem ser extremamente rápidas e esta é uma área onde o MSN tem a oportunidade de realmente brilhar contra a maioria de seus concorrentes. Multidões de pessoas amontoadas em cafeterias ou aeroportos que compartilham redes sem fio querem sites que carreguem mais rapidamente.

Se eles tiverem o MSN configurado como home page, eles navegarão rapidamente para um site mais rápido ou usarão a pesquisa no canto superior direito da maioria dos navegadores modernos. Se isso ocorrer com freqüência suficiente, os usuários ficarão tentados a mudar completamente sua página inicial.

Nota: http://www.webpagetest.org foi usado para testes. A seguir estão os três testes que foram executados:

Design geral

O redesenho geral é eficaz. Ele aborda algumas das preocupações do MSN com seu design antigo e fornece uma imagem mais limpa para a Microsoft.

O design fornece uma hierarquia visual ligeiramente melhor, mas definitivamente há espaço para melhorias. A seção de conteúdo principal é a primeira a chamar a atenção do usuário, seguida pela considerável barra de pesquisa do Bing, mas depois desses dois elementos é difícil identificar exatamente o que chamará a atenção deles.

Isso se deve em parte à página ter uma grande quantidade de conteúdo, que possui diferentes níveis de importância para cada indivíduo. Como todos são diferentes, é difícil saber exatamente como definir o caminho visual, mas mesmo uma pequena dica pode produzir resultados significativos.

Nenhuma seção tem um peso visual maior que qualquer outra seção.

Enquanto o esquema de cores funciona, ele não define o design. Exceto pelo leve gradiente na parte superior da página e o logotipo do MSN, não há nada que exiba a identidade do MSN. O site aparece como sem graça e sem personalidade. A página não tem a chance de se vender sendo charmosa; só pode confiar em seus recursos.

Um dos melhores aspectos do redesenho foi a introdução de espaços em branco significativos. Cada título de notícias recebeu 12 pixels extras de espaço vertical para separá-lo dos outros títulos. O tamanho da fonte também foi aumentado, o que torna tudo muito mais fácil de ler.

Conclusão

Este novo design parece estar sendo atualizado para se adequar aos concorrentes do MSN. Enquanto tudo parece bom e se comporta como deveria, não foi feito o suficiente para fazer o design ultrapassar os limites do que um site moderno pode fazer.

O site trocou sua identidade e desordem pela limpeza e algumas poucas características medíocres. O Local Edition é um ótimo complemento e tem uma boa chance de ser utilizado, especialmente se for oferecida uma versão móvel bem comercializada.

Referências


    Este artigo foi escrito exclusivamente para o Web Designer Depot de Eli Penner

    O que você acha do redesenho do MSN? O que você teria feito diferente?


    desenhar redesenhar msn