Diseño interactivo

Una mirada al nuevo diseño de MSN.Com

Desde el 9 de marzo de este año, Microsoft ha estado desplegando su nuevo diseño de MSN.com.

Respaldados por incontables horas de pruebas y aproximadamente 70,000 comentarios de sus usuarios, el diseño ha sido ajustado en los últimos cuatro meses a su estado actual.

Visitantes que todavía no pueden verlo en http://www.msn.com puede acceder a ella en http://preview.msn.com .

En esta publicación, echamos un vistazo al nuevo rediseño y examinamos sus aspectos positivos y negativos.

Siéntase libre de compartir su opinión sobre el diseño en el área de comentarios.

Durante la última década, tres páginas principales de búsqueda establecieron una base sólida como sitios a los que recurren las personas cuando comienzan sus experiencias en línea.

Si bien Yahoo y MSN se centraron en agregar elementos funcionales a sus páginas, Google se mantuvo con un diseño mínimo y en su lugar colocaron sus nuevas aplicaciones en diferentes URL con solo menciones sutiles en su página principal. Google salió adelante, pero Yahoo y MSN no se dieron por vencidos y todavía tienen una porción importante del mercado.

Uno de los principales objetivos del nuevo diseño es actualizar la interfaz con un aspecto mucho más limpio; una apariencia que recuerda a Google. Para lograr esto, han cambiado el fondo a un blanco consistente y han agregado pestañas para las diversas secciones de contenido. También le dieron un mayor peso visual a la sección principal de noticias al darle un título más grande y agrandar sus imágenes. Esto le da al usuario una indicación clara de dónde deben tomar sus ojos de inmediato, lo que ayuda a que el sitio se sienta menos ocupado.

El fondo blanco hace que el sitio se vea limpio, pero lo hace a expensas de perder el azul, lo que hace que el sitio antiguo sea fácilmente reconocible y único. A pesar de los comentarios que MSN ha recibido que afirman que el fondo blanco se siente más limpio, a largo plazo podría ser beneficioso para Microsoft adoptar su viejo color de fondo azul. Al ir con un solo color de fondo, se eliminaron muchas líneas verticales. Esto hace que el sitio se sienta más ancho a pesar de que en realidad es un poco más delgado en alrededor de 20 píxeles.

Las pestañas también hacen que la página se vea mucho más limpia. Las secciones en la página no parecen estar agrupadas de una manera obvia, pero esto no es necesariamente perjudicial. MSN se da cuenta de que esta página no se usará como un periódico o incluso como un sitio web de noticias.

Cada sección proporciona pequeños titulares y oraciones cortas destinadas a atraer al lector para que haga clic y aprenda más. Al hablar sobre el nuevo diseño, Scott Moore (Gerente General de Contenido y Programación de MSN) explicó que el sitio utiliza el aprendizaje automático para dividir a los usuarios en ocho grupos.

No repasó los detalles, pero esto podría significar que la ubicación de las secciones / pestañas estará determinada por las cosas en las que los usuarios hayan mostrado interés.

Adiciones de contenido

Una característica en la que el equipo de MSN decidió centrarse es en las redes sociales. Los usuarios ahora pueden iniciar sesión en su cuenta de Windows Live / Facebook / Twitter para obtener actualizaciones en vivo que se muestran en su página principal de MSN.

Esta es una característica que algunas personas encontrarán muy útil y otras ignorarán por completo. "Social Media" ha sido una palabra de moda en Internet desde hace más de un año y es sorprendente que MSN haya tardado tanto en integrarlo en su página de inicio.

La adición de las redes sociales no influirá a muchas personas en el uso de su página principal, pero no afecta negativamente su apariencia y muestra que están adoptando Internet en lugar de obligar a sus usuarios a usar solo las aplicaciones de MSN.

El rediseño de la página principal de MSN le ha dado a la barra de búsqueda de Bing mucha más prominencia. Se le ha dado su propia sección en lugar de verse obligado a compartir su espacio con muchos elementos diferentes.

Este aumento en la atención de Bing le ha dado a su motor de búsqueda un aumento de dos dígitos en las búsquedas. La barra de búsqueda más grande de Bing podría ser una de las mejores características del rediseño de MSN porque muestra que MSN ahora comprende mejor que las páginas principales generalmente se utilizan como punto de partida para una búsqueda web. Las personas cambiarán rápidamente su página de inicio si creen que MSN tarda demasiado en cargar contenido irrelevante.

La tercera adición importante es un enfoque en el contenido local. En la esquina superior derecha de la página, hay un enlace para la Edición local. Local Edition es como otra versión de la página principal, pero es más relevante para cada persona. El usuario puede guardar hasta tres ciudades diferentes (o códigos postales) pero no es muy intuitivo sobre cómo agregarlos. El usuario debe ingresar un nombre de ciudad, hacer clic en "Guardar" y luego agregar otro, debe hacer clic en "Cambiar". Tendría más sentido tener en cambio el enlace "Agregar".


Edición local

Una vez que el usuario ha seleccionado una ciudad, tiene acceso a noticias locales, clima, deportes, películas / eventos, restaurantes, gas / tráfico y algunos otros artículos. Todas estas características están realmente bien implementadas, excepto en la sección Restaurantes.

Para los restaurantes, simplemente enumera restaurantes cercanos con enlaces a reseñas, imágenes de 5 estrellas y direcciones. Cuando se hace clic en los enlaces Revisar o Clasificar, se carga una página que enumera varios detalles sobre el restaurante, pero no tiene comentarios de los clientes y el widget de calificación no se ve por ningún lado. Parece que esta función se tomó de un libro de referencia estático.

sLas demás funciones están bien hechas y vale la pena probarlas. Tenga en cuenta que en este momento, Local Edition solo está disponible en los Estados Unidos.

La última adición que vale la pena mencionar es la función TrendWatch que enumera las últimas tendencias de Twitter. Esta característica es extrañamente similar a la sección Tendencias actuales de Yahoo, pero tiene flechas al lado de cada consulta de búsqueda para mostrar su ímpetu de popularidad. Es un poco hortera y su ubicación en la parte inferior de la página hace que se sienta más como una opción de pensamiento tardío que útil.


Tendencias de Yahoo ahora comparadas con TrendWatch de MSN


Actuación

Curiosamente, el viejo sitio de MSN descarga todo su contenido a la máquina del usuario usando un segundo menos que el nuevo diseño. El nuevo diseño ejecuta mucho más código haciendo que su tiempo total de finalización sea casi 3 segundos más largo que el diseño anterior.

La edición local tiene un rendimiento ligeramente mejor que el nuevo diseño con un tiempo de preparación de documentos de 2.582 segundos, pero el tiempo de finalización completa es de unos feos 10.545 segundos debido a la carga de un video incrustado.

Debido a que todo se muestra en aproximadamente la misma cantidad de tiempo, es probable que los usuarios no noten la diferencia en el rendimiento y esto podría ser perjudicial para el éxito del nuevo diseño.

Las páginas de inicio deberían ser extremadamente rápidas y esta es un área donde MSN tiene la oportunidad de brillar realmente contra la mayoría de sus competidores. Multitudes de personas hacinados en cafeterías o aeropuertos que comparten redes inalámbricas quieren que los sitios carguen más rápido.

Si tienen MSN configurado como su página de inicio, navegarán rápidamente a un sitio más rápido o utilizarán la búsqueda en la esquina superior derecha de la mayoría de los navegadores modernos. Si esto ocurre con frecuencia, los usuarios tendrán la tentación de cambiar su página de inicio por completo.

Nota: http://www.webpagetest.org fue utilizado para probar Las siguientes son las tres pruebas que se realizaron:

Diseño general

El rediseño general es efectivo. Aborda algunas de las preocupaciones de MSN con su diseño anterior y proporciona una imagen más limpia para Microsoft.

El diseño proporciona una jerarquía visual ligeramente mejor, pero definitivamente hay margen de mejora. La sección de contenido principal es la primera en captar la atención del usuario, seguida de la considerable barra de búsqueda de Bing, pero después de esos dos elementos es difícil determinar qué atraerá su atención al momento.

Esto se debe en parte a que la página tiene una gran cantidad de contenido que tiene diferentes niveles de importancia para cada individuo. Debido a que cada persona es diferente, es difícil saber exactamente cómo establecer la ruta visual, pero incluso una pequeña sugerencia podría arrojar resultados significativos.

Ninguna sección tiene un peso visual más alto que cualquier otra sección.

Si bien el esquema de colores funciona, no define el diseño. Excepto por el ligero degradado en la parte superior de la página y el logotipo de MSN, no hay nada que muestre la identidad de MSN. El sitio parece soso y sin personalidad. La página no tiene la oportunidad de venderse por ser encantador; solo puede confiar en sus características.

Uno de los mejores aspectos del rediseño ha sido la introducción de un espacio en blanco significativo. A cada título de noticias se le han asignado 12 píxeles adicionales de espacio vertical para separarlo de los otros títulos. También se ha aumentado el tamaño de la fuente, lo que hace que todo sea mucho más fácil de leer.

Conclusión

Este nuevo diseño parece que se está actualizando para adaptarse a la competencia de MSN. Si bien todo se ve bien y se comporta como debería, no se ha hecho lo suficiente para que el diseño traspase los límites de lo que un sitio web moderno puede hacer.

El sitio intercambió su identidad y el desorden por la limpieza y algunas características mediocres. La edición local es una gran adición y tiene muchas posibilidades de ser popular, especialmente si tiene una versión móvil bien comercializada.

Referencias


    Este artículo fue escrito exclusivamente para Web Designer Depot por Eli Penner

    ¿Qué piensas del rediseño de MSN? ¿Qué habrías hecho diferente?


    diseño rediseñar msn