Metro (lenguaje de diseño)

Lenguaje de diseño introducido por Microsoft

El centro de música y vídeo en Windows Phone

Microsoft Design Language (o MDL ), [1] anteriormente conocido como Metro , es un lenguaje de diseño creado por Microsoft . Este lenguaje de diseño se centra en la tipografía y los iconos simplificados , la ausencia de desorden, una mayor relación contenido- cromo ("contenido antes del cromo") y formas geométricas básicas. Los primeros ejemplos de los principios de MDL se pueden encontrar en Encarta 95 y MSN 2.0 . [2] [3] El lenguaje de diseño evolucionó en Windows Media Center y Zune y se presentó formalmente como Metro durante la presentación de Windows Phone 7. Desde entonces, se ha incorporado a varios de los otros productos de la empresa, incluido el software del sistema Xbox 360 y el software del sistema Xbox One , Windows 8 , Windows Phone y Outlook.com . [4] [5] Antes de que el título de "lenguaje de diseño de Microsoft" se hiciera oficial, el ejecutivo de Microsoft Qi Lu se refirió a él como el lenguaje de diseño de interfaz de usuario moderno en su discurso de apertura de la conferencia MIXX . [6] Según Microsoft, "Metro" siempre ha sido un nombre en código y nunca fue pensado como un producto final, pero los sitios web de noticias atribuyen este cambio a problemas de marca registrada. [4]

Microsoft Design Language 2 (MDL2) se desarrolló junto con Windows 10. [7] [8] En 2017, el lenguaje Fluent Design lo amplió.

Historia

El lenguaje de diseño se basa en los principios de diseño del diseño gráfico suizo clásico . Los primeros destellos de este estilo se pudieron ver en Windows Media Center para Windows XP Media Center Edition , [9] que favorecía el texto como la forma principal de navegación, así como los primeros conceptos de Neptune . [10] Esta interfaz se trasladó a iteraciones posteriores de Media Center. En 2006, Zune actualizó su interfaz utilizando estos principios. Los diseñadores de Microsoft decidieron rediseñar la interfaz y centrarse más en la tipografía limpia y menos en el cromo de la interfaz de usuario. [11] Estos principios y la nueva interfaz de usuario de Zune se trasladaron a Windows Phone lanzado por primera vez en 2010 (del que se extrajo mucho para Windows 8). El cliente de escritorio de Zune también se rediseñó con un énfasis en la tipografía y el diseño limpio que era diferente de la interfaz de usuario basada en el Media Center portátil anterior de Zune . Los "mosaicos vivos" de colores planos se introdujeron en el lenguaje de diseño durante los primeros estudios de Windows Phone.

En una entrevista se explicó que las distintas divisiones de Microsoft utilizan los productos de las demás y que la extensión de Metro no fue un enfoque de toda la empresa, sino que a equipos como Xbox les gustó Metro y lo adaptaron para sus propios productos. Muchas de las divisiones de Microsoft terminaron adoptando Metro. [12]

Microsoft Design Language 2 (MDL2) se desarrolló junto con Windows 10. Esta versión introdujo un nuevo conjunto de widgets , incluidos selectores de fecha, conmutadores y conmutadores, y redujo el grosor de los bordes de todos los elementos de la interfaz de usuario. [7] [8]

Principios

El equipo de diseño de Microsoft cita como inspiración para el lenguaje de diseño los letreros que se encuentran comúnmente en los sistemas de transporte público. [13] El lenguaje de diseño pone énfasis en una buena tipografía y tiene texto grande que llama la atención. Microsoft ve el lenguaje de diseño como "elegante, rápido, moderno" y una "renovación" de las interfaces basadas en íconos de Windows, Android e iOS . [14] Todas las instancias usan fuentes basadas en la familia de fuentes Segoe diseñada por Steve Matteson en Agfa Monotype y licenciada a Microsoft. Para Zune, Microsoft creó una versión personalizada llamada Zegoe UI, [15] y para Windows Phone Microsoft creó la familia de fuentes Segoe WP. Las fuentes en su mayoría difieren solo en detalles menores. Las diferencias más obvias entre Segoe UI y Segoe WP son evidentes en sus respectivos caracteres numéricos. La fuente Segoe UI en Windows 8 tenía diferencias obvias, similares a Segoe WP. Los caracteres con cambios tipográficos notables incluyen 1, 2, 4, 5, 7, 8, I y Q.

Joe Belfiore fue uno de los arquitectos de Metro. En Nokia World 2011, Belfiore explicó que la interfaz de usuario tiene como objetivo ser "artística" en elementos textuales e iconografía . También mencionó el "movimiento" de la interfaz de usuario, específicamente en Windows Phone, de los Live Tiles, los puntos móviles y el desplazamiento cinético. [16]

Microsoft diseñó el lenguaje de diseño específicamente para consolidar grupos de tareas comunes y acelerar su uso. Lo logra al excluir gráficos superfluos y, en su lugar, confiar en el contenido real para que funcione como la interfaz de usuario principal. Las interfaces resultantes prefieren los centros más grandes en lugar de los botones más pequeños y, a menudo, presentan paneles de desplazamiento lateral. Los títulos de las páginas suelen ser grandes y, en consecuencia, también aprovechan el desplazamiento lateral.

La animación juega un papel importante. Microsoft recomienda reconocer de forma constante las transiciones y las interacciones del usuario (como pulsaciones o deslizamientos) mediante algún tipo de animación o movimiento natural. Esto tiene como objetivo dar al usuario la impresión de una interfaz de usuario "viva" y reactiva con "una sensación adicional de profundidad". [17] [18]

Recepción

En el móvil

La respuesta inicial al lenguaje fue generalmente positiva. En una reseña del Zune HD , Engadget dijo: "Microsoft continúa su apuesta por una tipografía muy grande, ofreciendo un diseño sofisticado y prolijo que es casi tan funcional como atractivo". [19] CNET elogió el lenguaje de diseño, diciendo: "Es un poco más atrevido e informal que las cuadrículas de iconos estrechas y estériles y los menús Rolodex del iPhone y el iPod Touch". [20]

En su Ceremonia IDEA 2011, la Sociedad de Diseñadores Industriales de Estados Unidos (IDSA) otorgó a Windows Phone 7, que utiliza la interfaz de usuario, su premio "Gold Interactive", su "People's Choice Award" y un premio "Best in Show". [21] [22] Isabel Ancona, consultora de experiencia de usuario de IDSA, explicó por qué ganó Windows Phone: [23]

La innovación aquí es la fluidez de la experiencia y el enfoque en los datos, sin utilizar las convenciones tradicionales de la interfaz de usuario de ventanas y marcos. Los datos se convierten en elementos visuales y controles. Gestos y transiciones simples guían al usuario a través del contenido. Una experiencia verdaderamente elegante y única.

Se informó que la interfaz de usuario fue mejor recibida por las mujeres y los usuarios primerizos. [24]

Las críticas se centraron especialmente en el uso de texto en mayúsculas . Con el aumento del uso de Internet, los críticos han comparado esto con un programa de computadora que grita a su usuario. El periodista de TI Lee Hutchinson describió el uso de esta práctica por parte de Microsoft en la versión macOS de OneNote como terrible, afirmando que está "maldecida con menús de ventana de aplicación locos y no estándar EN MAYÚSCULAS que no solo violan las convenciones de diseño de OS X, sino que los sacan detrás del cobertizo, los vierten con gasolina y los prenden fuego". [25]

En el escritorio de Windows 8

Con la llegada de Windows 8 , la interfaz de usuario del sistema operativo y su uso del lenguaje de diseño atrajeron respuestas críticas generalmente negativas. El 25 de agosto de 2012, Peter Bright de Ars Technica revisó la versión preliminar de Windows 8, dedicando la primera parte de la revisión a una comparación entre los diseños del menú Inicio utilizados por Windows 8 y Windows 7. Al relatar sus pros y contras, Peter Bright concluyó que el menú Inicio en Windows 8 (denominado pantalla de Inicio), aunque no estaba exento de problemas, era un claro ganador. Sin embargo, concluyó que la interfaz de usuario de Windows 8 era frustrante y que los diversos aspectos de la interfaz de usuario no funcionaban bien juntos. [26] Woody Leonhard fue aún más crítico cuando dijo: "Desde el punto de vista del usuario, Windows 8 es un fracaso: una mezcla incómoda que lleva al usuario en dos direcciones a la vez". [27]

Además de los cambios en el menú Inicio, Windows 8 adopta un enfoque más modal con el uso de aplicaciones de pantalla completa que se alejan de la dependencia de la interfaz de escritorio basada en iconos. Sin embargo, al hacerlo, Microsoft ha desviado su atención de la multitarea y la productividad empresarial. [28]

Cambio de nombre

En agosto de 2012, The Verge anunció que se había enviado un memorando interno a los desarrolladores y empleados de Microsoft anunciando la decisión de "descontinuar el uso" del término "Metro" debido a "discusiones con un socio europeo importante", y que estaban "trabajando en un término de reemplazo". [29] Los medios de noticias tecnológicas Ars Technica , [30] TechRadar , [31] CNET , [32] Engadget [33] y Network World [34] y la prensa convencional Bits Blog de The New York Times Company [35] y BBC News Online [36] publicaron que el socio mencionado en el memorando podría ser uno de los socios minoristas de Microsoft, la empresa alemana Metro AG , ya que el nombre tenía el potencial de infringir su marca registrada "Metro". Microsoft declaró más tarde que la razón para dejar de enfatizar el nombre no estaba relacionada con ningún litigio actual, y que "Metro" era solo un nombre en clave de proyecto interno, [37] a pesar de haber promocionado intensamente la marca al público. [38] En algunos contextos, la compañía comenzó a utilizar el término "Moderno" o el modificador más genérico "Windows 8" para referirse al nuevo diseño, posiblemente como un marcador de posición. [39]

En septiembre de 2012, se adoptó el "lenguaje de diseño de Microsoft" como el nombre oficial para el estilo de diseño. [1] [40] El término se utilizó en la documentación de Microsoft Developer Network [41] [42] [43] [44] y en la conferencia Microsoft Build de 2012 para referirse al lenguaje de diseño. [1] [45]

En un cambio relacionado, Microsoft abandonó el uso de la frase " aplicaciones estilo Metro " para referirse a las aplicaciones móviles distribuidas a través de Windows Store . [40]

Véase también

Referencias

  1. ^ abc Foley, Mary Jo (29 de octubre de 2012). "Lenguaje de diseño de Microsoft: la forma oficial más reciente de referirse a 'Metro'". ZDNet . CBS Interactive .
  2. ^ Green, Jay (8 de febrero de 2012). "Por qué Metro ahora manda en Microsoft". CNET . CBS Interactive .
  3. ^ Massey, Stephane (15 de febrero de 2012). "Metro Ui [sic] Design Principles". stephanemassey.com . Autopublicado . Archivado desde el original el 2 de agosto de 2018 . Consultado el 17 de febrero de 2012 .
  4. ^ ab Chang, Alexandra (8 de agosto de 2012). "Microsoft no necesita un nombre para su interfaz de usuario". Wired . Condé Nast .
  5. ^ Kruzeniski, Mike (11 de abril de 2011). "Cómo el diseño de impresión es el futuro de la interacción". Kruzeniski.com . Autopublicado . Archivado desde el original el 14 de marzo de 2012. Consultado el 27 de agosto de 2011 .
  6. ^ Lu, Qi (1 de octubre de 2012). "Qi Lu: Conferencia magistral de IAB MIXX". Centro de noticias . Microsoft.
  7. ^ ab Sams, Brad (21 de abril de 2015). "De Metro a Microsoft Design Language 2: una comparación lado a lado". Neowin .
  8. ^ ab Rubino, Daniel (21 de abril de 2015). "Novedades de Microsoft Design Language 2 para Windows 10". Windows Central . Mobile Nations.
  9. ^ Lefevers, Jason (15 de septiembre de 2013). "Un recorrido por la historia de la interfaz Metro". Windows Phone Metro . Autopublicado . Archivado desde el original el 22 de mayo de 2013. Consultado el 15 de septiembre de 2013 .
  10. ^ "SuperSite Flashback: Neptuno". 6 de agosto de 2013.
  11. ^ "Sistema de diseño de Windows Phone: nombre en código 'Metro'" (PDF) . Archivado desde el original (PDF) el 15 de noviembre de 2010 . Consultado el 9 de octubre de 2010 .
  12. ^ "A veces, Microsoft diseña cosas geniales. He aquí por qué eso nunca importa". 25 de enero de 2014.
  13. ^ "Lenguaje de diseño de Windows Phone 7". .toolbox . Microsoft . Archivado desde el original el 9 de octubre de 2012 . Consultado el 5 de octubre de 2012 .
  14. ^ Hamburger, Ellis (27 de abril de 2011). «Metro». Business Insider . Archivado desde el original el 23 de abril de 2013.
  15. ^ Zheng, Long (14 de noviembre de 2007). ""Zegoe", la nueva fuente de Zune". Empecé algo . Autoedición .
  16. ^ "Construyendo un tipo diferente de UI".
  17. ^ Roberts, Chad; Shum, Albert; Smuga, Michael (15 de marzo de 2010). "Interfaz de usuario y lenguaje de diseño de Windows Phone". MIX 2010 . Microsoft .
  18. ^ Kruzeniski, Mike (17 de febrero de 2011). "Del transporte a los píxeles". Blog para desarrolladores de Windows Phone . Microsoft . Archivado desde el original el 18 de febrero de 2011.
  19. ^ Topolsky, Joshua (17 de septiembre de 2009). "Reseña del Zune HD". Engadget . AOL .
  20. ^ "Reseña del Zune HD de 64 GB". CNET . CBS Interactive . 17 de septiembre de 2009.
  21. ^ Warren, Tom (18 de septiembre de 2011). «Windows Phone gana el premio de diseño IDEA 2011, el premio de diseño elegido por el público». WinRumors . Archivado desde el original el 3 de marzo de 2012.
  22. ^ "IDEA 2011 Best in Show". Sociedad de Diseñadores Industriales de Estados Unidos . idsa.org. 23 de septiembre de 2011. Archivado desde el original el 25 de febrero de 2014.
  23. ^ "Windows Phone 7". Sociedad de Diseñadores Industriales de Estados Unidos . idsa.org. 8 de junio de 2011. Archivado desde el original el 15 de mayo de 2013. Consultado el 20 de septiembre de 2011 .
  24. ^ "Construyendo un tipo diferente de UI".
  25. ^ Hutchinson, Lee (12 de julio de 2014). "Las tendencias de diseño de software que nos encanta odiar". Ars Technica . Condé Nast .
  26. ^ Bright, Peter (25 de abril de 2012). "Windows 8 en el escritorio: un híbrido extraño". Ars Technica . Condé Nast Digital . págs. 1–5.
  27. ^ Leonhard, Woody (15 de agosto de 2012). "Revisión de Windows 8: Sí, es así de malo". InfoWorld . IDG .
  28. ^ Barney, Doug (17 de agosto de 2012). "Windows 8 ya no funciona, es hora de preocuparse". Redmond Magazine . 1105 Media.
  29. ^ Warren, Tom (2 de agosto de 2013). "Exclusiva: la marca Metro de Microsoft será reemplazada 'esta semana' según un memorando interno". The Verge . Vox Media .
  30. ^ Bright, Peter (3 de agosto de 2012). "Microsoft: "Metro" sale, "interfaz de usuario estilo Windows 8" entra, en medio de rumores de una disputa por una marca registrada". Ars Technica . Condé Nast .
  31. ^ Smith, Chris (3 de agosto de 2012). "Microsoft abandona el nombre 'Metro' para Windows 8 en medio de temores por marcas registradas". TechRadar . Consultado el 24 de septiembre de 2013 .
  32. ^ Whitney, Lance (10 de agosto de 2012). "¿Por qué Microsoft eliminó el nombre 'Metro'?". CNET . CBS Interactive .
  33. ^ Fingas, Jon (2 de agosto de 2012). "Microsoft resta importancia al nombre de diseño de Metro y podría enfrentarse a una demanda por toda esa jerga callejera". Engadget . AOL .
  34. ^ Patrizio, Andy (6 de agosto de 2012). "Fuente confirma que Microsoft abandonó Metro debido a un error de marca registrada". Network World . IDG .
  35. ^ Wingfield, Nick (3 de agosto de 2012). "Microsoft abandona el nombre Metro para su nuevo diseño de producto". Bits Blog . The New York Times Company .
  36. ^ "Microsoft dejará de usar el nombre 'Metro' para Windows". BBC News Online . BBC . 3 de agosto de 2012.
  37. ^ Foley, Mary Jo (2 de agosto de 2012). "¿'Metro' es ahora una palabra prohibida en Microsoft?". ZDNet . CBS Interactive .
  38. ^ Humphries, Matthew (3 de agosto de 2012). «Microsoft deja de utilizar el nombre Metro». Geek.com . Archivado desde el original el 16 de junio de 2015. Consultado el 13 de junio de 2015 .
  39. ^ Keizer, Gregg (10 de agosto de 2012). «Microsoft reemplaza 'Metro' con las etiquetas 'Windows 8' y 'Modern'». Computerworld . Consultado el 30 de enero de 2020 .
  40. ^ ab "Microsoft finalmente se sincera sobre sus planes de nombres para la era posterior a Metro". ZDNet . CBS Interactive . 12 de septiembre de 2012.
  41. ^ "Crear excelentes aplicaciones para la Tienda Windows". MSDN . Microsoft . Consultado el 5 de agosto de 2017 .
  42. ^ "Estudio de caso de diseño: aplicación de iPad a Windows Store". MSDN . Microsoft . Consultado el 28 de mayo de 2013 .
  43. ^ "Directrices para la tipografía". MSDN . Microsoft . Consultado el 28 de mayo de 2013 .
  44. ^ "Hoja de ruta para aplicaciones de la Tienda Windows que utilizan DirectX y C++". MSDN . Microsoft . Consultado el 28 de mayo de 2013 .
  45. ^ Tschumy, Will (16 de noviembre de 2012). "El lenguaje de diseño de Microsoft". Canal 9 . Microsoft .
  • Sitio web de Microsoft en cifras
  • Diseño moderno en Microsoft (Archivo)
  • Pautas de UX para aplicaciones de Windows Store en MSDN
  • Directrices de diseño para Windows Phone en MSDN
Obtenido de "https://es.wikipedia.org/w/index.php?title=Metro_(lenguaje_de_diseño)&oldid=1252375828"