Aplicaciones de compras

El libro de ideas de la aplicación de compras describe una aplicación de compras ficticia para Windows 8.1. Puedes inspirarte en ella para diseñar tu propia aplicación de compras. Revisa los escenarios de este tema y fíjate en cómo se usa el lenguaje de diseño de Microsoft en la aplicación.

Muestra de código disponible: Tallan Inc. creó una excelente aplicación de muestra basada en el libro de ideas de una aplicación de compras. Puedes descargar la aplicación de muestra para ver una implementación real de las funciones descritas en este libro de ideas, entre otros temas. Descarga la aplicación de compras de muestra de Tallan aquí.

Escenarios de la aplicación de compras

La aplicación de compras que se describe en este tema usa las características de diseño de Microsoft para crear una atrayente experiencia de compras para los usuarios.

Iconos dinámicos y exploraciónBúsqueda y cambio de tamaño de ventanaCompartir
imagen de iconos dinámicos y exploraciónimagen de la búsquedaimagen de compartir

 

Llama la atención a los usuarios hacia el contenido de tu aplicación

Puedes usar el lenguaje de diseño Microsoft para crear una experiencia de exploración informal que sea divertida, fácil y potente. También puedes usar iconos dinámicos para llamar la atención a los usuarios hacia la aplicación. Sigue este escenario para ver cómo puedes hacer que tu aplicación de compras sea atrayente.

imagen de iconos dinámicos y exploración

Tomás Navarro está usando su tableta Windows 8.1 en el autobús de camino a casa después del trabajo.

imagen de iconos dinámicos y exploración

Un icono dinámico que dice "Recién llegado:" avisa a Tomás sobre la llegada de nuevos artículos de la temporada de otoño. Esto le interesa a Tomás, así que hace clic en el icono para entrar en la aplicación.

imagen de iconos dinámicos y exploración

Tomás necesita una chaqueta nueva, así que hace clic en la categoría "Sobre los hombros".

imagen de iconos dinámicos y exploración

La vista de las categorías está distribuida horizontalmente, con una vista detallada de todas las opciones que se muestran en el mismo Canvas. Tomás puede explorar sin tener que navegar por ninguna jerarquía de contenido.

imagen de iconos dinámicos y exploración

Tomás acerca los dedos para activar el zoom semántico, que le permite visualizar y navegar rápidamente por la lista de elementos.

imagen de iconos dinámicos y exploración

Después de hacer clic en la sección de "Chaquetas", Tomás selecciona una chaqueta para verla en la vista de elementos y la agrega al carro de la compra.

imagen de iconos dinámicos y exploración

Tomás completa su compra adquiriendo la chaqueta y una camisa que ya había agregado al carro antes.

imagen de iconos dinámicos y exploración

 

Resumen de iconos dinámicos y escenario de exploración

En este escenario, veremos casos de uso que sacan provecho de los siguientes elementos de diseño:

  • Los iconos dinámicos llaman la atención al usuario hacia la aplicación mostrando información que es relevante para el usuario.
  • El contenido destaca en la aplicación sin ningún contenedor visual y permite que los usuarios se sumerjan en la experiencia que les interesa.

Para obtener información sobre los iconos dinámicos y el zoom semántico, consulta los siguientes temas:

Para ayudarte a elegir el mejor patrón de navegación para tu aplicación, consulta Patrones de navegación.

Consulta el patrón de navegación plano como parte de nuestra serie Características de aplicaciones, de principio a fin.

Dirige la participación de los usuarios

Puedes usar el lenguaje de diseño de Microsoft para atraer a los usuarios cuando están listos para comprar agregando un cuadro de búsqueda, implementando el contrato de Buscar y habilitando la multitarea de los usuarios, y diseñando aplicaciones que funcionan correctamente cuando se cambia su tamaño a anchos estrechos.

imagen de iconos dinámicos y exploración

Antonio Bermejo está usando su tableta Windows 8.1 para leer un blog de estilo.

imagen de iconos dinámicos y exploración

Desde Internet Explorer, o cualquier otra aplicación, Antonio puede sacar el acceso a Buscar en el lado derecho y buscar una chaqueta similar.

imagen de iconos dinámicos y exploración

imagen de iconos dinámicos y exploración

Antonio selecciona la aplicación "Head to Toe", que muestra sus resultados de la búsqueda del término "Chaqueta".

imagen de iconos dinámicos y exploración

Antonio usa un filtro para reducir los resultados de la búsqueda según el precio. Después selecciona un elemento.

imagen de iconos dinámicos y exploración

Antonio cambia el tamaño de la aplicación a la izquierda para poder comparar el elemento con la chaqueta del blog. Satisfecho con su elección, Antonio agrega la chaqueta a su carro de la compra.

imagen de iconos dinámicos y exploración

Mientras está aún en el ancho estrecho, Antonio decide completar la compra.

imagen de iconos dinámicos y exploración

 

Resumen de cómo dirigir la participación de los usuarios

En este escenario, veremos casos de uso que sacan provecho de los siguientes elementos de diseño:

  • El contrato de Buscar pone la aplicación en la lista de destinos posibles cuando el cliente pretende realizar una compra.
  • Una aplicación que funciona correctamente en anchos estrechos permite que los clientes puedan explorar y comparar tu contenido con otras aplicaciones y sitios web.

Para obtener información sobre la búsqueda y los tamaños de ventana, consulta los siguientes temas:

Conectar con Compartir

Puedes usar el lenguaje de diseño Microsoft para conectar a los usuarios con cualquier otra aplicación, contacto o red social.

imagen de iconos dinámicos y exploración

Diego Arteaga acaba de comprar una chaqueta. Después de realizar el pedido, se le dice que puede compartir la noticia.

imagen de iconos dinámicos y exploración

Diego usa el contrato para contenido compartido para compartir el código promocional con sus amigos.

imagen de iconos dinámicos y exploración

 

Resumen de conectar a los usuarios con Compartir

En este escenario, veremos casos de uso que sacan provecho de los siguientes elementos de diseño:

  • Puedes convertir tu contenido en origen de contenido compartido y Windows 8.1 te conecta con otras aplicaciones, correo electrónico y redes sociales.
  • Puedes hacer que tu aplicación sea un destino de contenido compartido para recibir contenido, vínculos u otros tipos de datos estructurados.

Para obtener información sobre el contenido compartido, consulta los siguientes temas:

Temas relacionados

Conocer las aplicaciones de la Tienda Windows
Directrices de experiencia del usuario para aplicaciones de la Tienda Windows
Aplicación de compras de muestra
Muestra de iconos dinámicos
Directrices de iconos dinámicos
Muestra de zoom semántico (C#/VB/C++)
Muestra de zoom semántico (JavaScript)
Directrices de zoom semántico
Muestra de Buscar
Instrucciones de búsqueda
Directrices sobre el tamaño de la ventana
Directrices sobre el diseño estrecho
Muestra de origen de contenido compartido
Muestra de destino de contenido compartido
Instrucciones de Compartir

 

 

Mostrar:
© 2015 Microsoft