Diseño

El diseño de tu aplicación (tanto el contenido como la navegación entre páginas) es fundamental para el aspecto general de la aplicación. Con el diseño puedes crear una jerarquía, organizar el contenido y reflejar tu marca. La experiencia de un usuario con un diseño depende de la estructura de las páginas y el contenido.

Diseño en Windows

Los diseños de Windows son genuinamente digitales. Se centran en el medio digital y prescinden de la metáforas de la vida real que con frecuencia son innecesarias o crean confusión en el mundo digital. La libertad de los diseños digitales sin ataduras y espontáneos permite crear aplicaciones y experiencias de gran belleza y eficacia para los usuarios.

Los diseños de Windows tienen un aspecto limpio y despejado e intentan reducir la aglutinación visual del lienzo. Puedes elegir mover los controles a las barras de la aplicación de los bordes. Así, las características más importantes de la aplicación pueden ocupar un lugar destacado en el lienzo, con lo cual la aplicación será más fácil de usar.

Según cuál sea el contenido de la aplicación, puede que quieras lograr una composición ligera y espaciosa con fragmentos interactivos grandes, o bien una experiencia más densa plagada de contenido y comandos en los que adentrarse. Por ejemplo, el diseño de la aplicación Lista de lectura es abierto y minimalista. Piensa en qué hay visible en tu aplicación y qué se puede quitar del lienzo, así como el modo en que las opciones de diseño afectan a la experiencia y uso de la aplicación.

En la aplicación Xbox Music se emplea una cuadrícula vertical no tradicional y un movimiento panorámico vertical para mostrar una amplia variedad de contenido al mismo tiempo. Gracias a barra de la aplicación persistente de abajo, los controles usados frecuentemente estarán siempre disponibles para que los usuarios puedan desplazarse rápidamente por sus listas de reproducción mientras exploran otras áreas de la aplicación.

Innovación en el diseño

En Songza, una aplicación de música que cambia en función del escenario del usuario, se utiliza un diseño horizontal y minimalista. La premisa aquí es que menos es más, puesto que los usuarios dedican la mayor parte del tiempo en esta aplicación a escuchar, no a navegar activamente.

Muchas aplicaciones usan un sistema de navegación jerárquico. El concentrador, o página de aterrizaje, es el punto de entrada del usuario a la aplicación y a más niveles de contenido. Muestra el contenido en una vista panorámica enriquecida que permite a los usuarios obtener una vista rápida de lo que es nuevo y atractivo, para luego profundizar en el contenido de la aplicación. Este concentrador proporciona el marco y la flexibilidad necesarios para que personalices la aplicación de acuerdo con tu marca.

La navegación jerárquica es solo un modelo de diseño de la aplicación y, en este sentido, tu aplicación debe sacar partido del modelo de diseño y navegación que sea más adecuado para tu marca y que consiga la mejor experiencia para los usuarios. La composición y el diseño están abiertos a la creatividad y brindan una oportunidad colosal a los creadores de lograr algo único.

Considera la orientación tanto horizontal como vertical en tu aplicación. Decide si la cuadrícula en la que vas a disponer el contenido es más eficaz en formato horizontal o vertical. A medida que aumenta el número de aplicaciones que saca partido del lenguaje de diseño moderno de Windows, los métodos de diseño de aplicaciones evoluciona para amoldarse a la marca y las necesidades individuales de cada aplicación. El diseño es perfecto para innovar y hacer que tu aplicación destaque. Consulta Diseñar una página de la aplicación para obtener más información sobre el sistema de cuadrículas de Windows.

Ejemplos

Facebook

Facebook emplea un diseño muy marcado basado en cuadrículas para organizar la inmensidad de contenido y comandos en el lienzo, lo que hace que los usuarios se adentren de inmediato en todos los servicios que Facebook ofrece.

Foursquare

Foursquare es una aplicación sobre lugares y nuevas experiencias. El diseño de la aplicación refleja su cometido con imágenes atrevidas que exhiben cada sitio destacado. Las puntuaciones y comentarios se anclan debajo de la imagen, de modo que se logra una composición unificada con la que los usuarios pueden evaluar un sitio de un solo vistazo y pulsar para seguir curioseando.

El diseño de Foursquare es dinámico y se reestructura para adaptar el contenido a cada área de la aplicación de la mejor forma posible. Un movimiento panorámico totalmente a la izquierda hace que aparezca un mapa de sitios populares en las proximidades. Si pulsas en un lugar, se abre una página de detalles con todas las entradas y comentarios de los usuarios. Si pulsas en cualquiera de estos elementos, se abre un pequeño fragmento de la recomendación.

NOOK

La aplicación NOOK de Barnes & Noble emplea los conceptos básicos de un modelo jerárquico basado en concentrador, pero lo personaliza hasta tal punto que lo convierte en una experiencia de la marca NOOK inconfundible. En vez de mostrar simplemente la imagen de cada portada, la tenue sombra detrás de cada ejemplar hace que se vislumbre la calidad material de los libros. En este caso, la sugerencia de una analogía con el mundo real mejora la experiencia del usuario.

Temas relacionados

Directrices para el control del concentrador

Patrones de navegación

Diseñar una página de la aplicación

Diseñar la interfaz de usuario (aplicaciones de Windows en tiempo de ejecución)

Elección de un diseño (aplicaciones de la Tienda Windows con JavaScript y HTML)

Diseñar la interfaz de usuario (XAML)

Galería