Conceptos básicos de comandos

En una aplicación de Windows, los elementos de comando son elementos interactivos de la interfaz de usuario que permiten a los usuarios realizar acciones como enviar un correo electrónico, eliminar un elemento o enviar un formulario. Las interfaces de comandos están formadas por elementos de comando comunes, las superficies de comandos que las hospedan, las interacciones que admiten y las experiencias que proporcionan.

Proporcionar la mejor experiencia de comandos

El aspecto más importante de una interfaz de comandos es lo que quieres permitir hacer a los usuarios. A la hora de planear la funcionalidad de la aplicación, ten en cuenta los pasos necesarios para realizar esas tareas y las experiencias de usuario que quieres habilitar. Una vez completado el borrador inicial de estas experiencias, puedes tomar decisiones sobre las herramientas y las interacciones para implementarlas.

Estas son algunas experiencias de comando comunes:

• Envío o envío de información
• Seleccionar la configuración y las opciones
• Buscar contenido y filtrarlo
• Abrir, guardar y eliminar archivos
• Editar y crear contenido

Se creativo a la hora de diseñar las experiencias de comandos. Elige qué dispositivos de entrada admite la aplicación y cómo responde la aplicación a cada dispositivo. Una aplicación que incorpora la gama más amplia de funcionalidades y preferencias hace que sea utilizable, portátil y accesible (consulta el artículo sobre diseño de comandos para aplicaciones de Windows para más información).

Elige los elementos de comando adecuados

Usar los elementos adecuados en una interfaz de usuario puede marcar la diferencia entre una aplicación intuitiva y fácil de usar y otra que parezca difícil o confusa. La aplicación de Windows incluye un completo conjunto de elementos de comando. Esta es una lista de algunos de los elementos de comandos para UWP más habituales.

Botones

Los botones desencadenan una acción inmediata. Algunos ejemplos son enviar un correo electrónico, enviar datos de un formulario o confirmar una acción en un cuadro de diálogo.

Listas

Enumera los elementos presentes en una lista interactiva o una cuadrícula. Por lo general, se usa para muchas opciones o para mostrar elementos. Algunos ejemplos son: lista desplegable, cuadro de lista, vista de lista y vista de cuadrícula.

Controles de selección

Permite a los usuarios elegir entre varias opciones, como al completar una encuesta o al configurar los parámetros de una aplicación. Entre los ejemplos se incluyen CheckBox, RadioButton y modificador toggle.

Calendario, selectores de fecha y hora

El calendario y los selectores de fecha y hora permiten a los usuarios ver y modificar la información de fecha y hora, por ejemplo, al crear un evento o al establecer una alarma. Algunos ejemplos son: selector de fecha del calendario, vista de calendario, selector de fecha, selector de hora.

Entrada de texto predictivo

Proporciona a los usuarios sugerencias a medida que escriben, como al escribir datos o realizar consultas. Algunos ejemplos son AutoSuggestBox.

Para obtener una lista completa, consulte Controles y elementos de la interfaz de usuario.

Colocar comandos en la superficie derecha

Puedes colocar elementos de comandos en diversas superficies de tu aplicación, como el lienzo de la aplicación o contenedores de comandos especiales, como barras de comandos, elementos flotantes de barra de comandos, barra de menús o cuadros de diálogo.

Procura siempre que los usuarios puedan manipular el contenido directamente en lugar de usar comandos que actúan en el contenido, como arrastrar y colocar para reorganizar los elementos de una lista en lugar de botones de comando para subir y bajar.

Sin embargo, tal vez esto no sea posible con determinados dispositivos de entrada o al acomodar preferencias y habilidades específicas del usuario. En estos casos, ofrece tantas prestaciones como sea posible y coloca estos elementos de comando en una superficie de comandos en la aplicación.

A continuación se incluye una lista de algunas de las superficies de comandos más habituales.

Lienzo de la aplicación (área de contenido)

Si un comando se necesita constantemente para que los usuarios realicen acciones en los escenarios principales, ponlo en el lienzo. Dado que puede colocar comandos cerca (o en) de los objetos que afectan, colocar comandos en el lienzo hace que sean fáciles y obvios de usar. Sin embargo, elija los comandos que coloque cuidadosamente en el lienzo. Si se colocan demasiados comandos en el lienzo de la aplicación, estos ocupan un valioso espacio en pantalla y pueden saturar al usuario. Si el comando no se va a usar con frecuencia, considera la posibilidad de colocarlo en otra superficie de comandos.

Barras de comandos y barras de menús

Las barras de comandos ayudan a organizar los comandos para que sea más fácil acceder a ellos. Las barras de comandos se pueden colocar en la parte superior de la pantalla, en la parte inferior de la pantalla o en la parte superior e inferior de la pantalla (también se puede usar una barra de menús cuando la funcionalidad de la aplicación es demasiado compleja para una barra de comandos).

Menús y menús contextuales

Los menús y los menús contextuales ahorran espacio organizando comandos y ocultándolos hasta que el usuario los necesite. Para acceder a un menú o menú contextual, los usuarios suelen hacer clic en un botón o clic con el botón derecho en un control.

CommandBarFlyout es un tipo de menú contextual que combina las ventajas de una barra de comandos y un menú contextual en un solo control. Pueden proporcionar accesos directos a las acciones más comunes y ofrecer acceso a los comandos secundarios que solo son relevantes en contextos determinados, como el Portapapeles o los comandos personalizados.

UWP también proporciona un conjunto de menús tradicionales y menús contextuales; para obtener más información, consulta Menús y menús contextuales.

Proporcionar comentarios sobre los comandos

Los comentarios sobre los comandos comunican a los usuarios que se ha detectado un comando o interacción, cómo se interpretó y controló el comando, y si el comando se ejecutó correctamente o no. Esto ayuda a los usuarios a entender lo que han hecho y qué pueden hacer a continuación. Lo ideal es que los comentarios se integren de forma natural en la interfaz de usuario, para que los usuarios no sufran interrupciones ni tengan que realizar acciones adicionales a menos que sea absolutamente necesario.

Nota:

Proporciona comentarios solo cuando sea necesario y solo la información no está disponible en otro lugar. Mantén la interfaz de usuario de la aplicación limpia y despejada, a menos que vayas a agregar un valor.

Estas son algunas maneras de proporcionar comentarios en tu aplicación.

Barra de comandos

El área de contenido de CommandBar es un lugar intuitivo para comunicar el estado a los usuarios si quieren ver comentarios.

controles flotantes

Los controles flotantes son elementos emergentes contextuales ligeros que se puede cerrar pulsando o haciendo clic en algún lugar fuera del control flotante.

Controles de cuadro de diálogo

Los controles de cuadro de diálogo son superposiciones modales en la interfaz de usuario que proporcionan información contextual sobre la aplicación. En la mayoría de los casos, los diálogos bloquean las interacciones con la ventana de la aplicación hasta que se descartan explícitamente y, a menudo, solicitan algún tipo de acción del usuario. Los diálogos pueden ser perjudiciales y solo deben usarse en determinadas situaciones. Para obtener más información, consulta la sección Cuándo confirmar o deshacer acciones .

Sugerencia

Tenga cuidado de cuánto usa la aplicación los diálogos de confirmación; pueden ser muy útiles cuando el usuario comete un error, pero son un obstáculo cada vez que el usuario intenta realizar una acción intencionadamente.

Cuándo confirmar o deshacer acciones

Da igual lo bien diseñada que esté la interfaz de usuario de tu aplicación, todos los usuarios realizan una acción que desearían no haber hecho. La aplicación puede ayudar en este tipo de situaciones, solicitando al usuario que confirme una acción o proporcionando una manera de deshacer las acciones recientes.

En el caso de las acciones que no se pueden deshacer y que tienen consecuencias importantes, se recomienda usar un cuadro de diálogo de confirmación. Entre los ejemplos de estas acciones se incluyen:

• Sobrescribir un archivo
• No guardar un archivo antes de cerrar
• Confirmación de la eliminación permanente de un archivo o datos
• Realizar una compra (a menos que el usuario opte por no solicitar una confirmación)
• Enviar un formulario, como registrarse para algo

Para las acciones que se pueden deshacer, ofrecer un comando de deshacer simple suele ser suficiente. Entre los ejemplos de estas acciones se incluyen:

• eliminar un archivo
• Eliminar un correo electrónico (no permanentemente)
• Modificar contenido o editar texto
• cambiar el nombre de un archivo

Optimización para tipos de entrada específicos

Consulte el manual de interacción para obtener más detalles sobre la optimización de experiencias de usuario en torno a un tipo de entrada o dispositivo específico.