Compartir a través de


Directrices para la configuración de una aplicación

La configuración de la aplicación es la parte que puede personalizar el usuario de una aplicación de Windows a la que se accede mediante una página de configuración de la aplicación. Por ejemplo, una aplicación del lector de noticias puede permitir al usuario especificar qué fuentes de noticias o cuántas columnas se deben mostrar en la pantalla, mientras que una aplicación meteorológica podría permitir al usuario elegir entre Celsius y Fahrenheit. En este artículo se proporcionan los procedimientos recomendados para crear y mostrar la configuración de aplicaciones.

Cuándo se debe proporcionar una página de configuración

Estos son ejemplos de opciones de aplicación que pertenecen a una página de configuración de la aplicación:

  • Opciones de configuración que afectan al comportamiento de la aplicación y no requieren reajuste frecuente, como elegir entre Celsius o Fahrenheit como unidades predeterminadas para la temperatura en una aplicación meteorológica, cambiar la configuración de la cuenta para una aplicación de correo, la configuración de las notificaciones o las opciones de accesibilidad.
  • Opciones que dependen de las preferencias del usuario, como música, efectos de sonido o temas de color.
  • Información de la aplicación a la que no se accede con mucha frecuencia, como la directiva de privacidad, la ayuda, la versión de la aplicación o la información de copyright.

Los comandos que forman parte del flujo de trabajo de aplicación típico (por ejemplo, cambiar el tamaño del pincel en una aplicación de arte) no deben estar en una página de configuración. Para obtener más información sobre la selección de ubicación de comandos, consulte Conceptos básicos de diseño de comandos.

Recomendaciones generales

  • Mantenga las páginas de configuración simples y use controles binarios (activados y desactivados). Un modificador de alternancia suele ser el mejor control para una configuración binaria.
  • Para la configuración que permite a los usuarios elegir un elemento de un conjunto de hasta 5 opciones mutuamente excluyentes, relacionadas, use botones de radio.
  • Cree un punto de entrada para toda la configuración de la aplicación en la página de la configuración de la aplicación.
  • Mantenga la configuración sencilla. Defina los valores predeterminados inteligentes y mantenga el número de configuraciones como mínimo.
  • Cuando un usuario cambia una configuración, la aplicación debe reflejar inmediatamente el cambio.
  • No incluya comandos que formen parte del flujo de trabajo de la aplicación común.

Punto de entrada

La forma en que los usuarios acceden a la página de configuración de la aplicación deben basarse en el diseño de la aplicación.

Panel de navegación

Para un diseño de panel de navegación, la configuración de la aplicación debe ser el último elemento de la lista de opciones de navegación y anclarse a la parte inferior:

punto de entrada de configuración de la aplicación para el panel de navegación

Barra de comandos

Si usa una barra de comandos o una barra de herramientas, coloque el punto de entrada de configuración como uno de los últimos elementos del menú de desbordamiento "Más". Si es más importante detectar el punto de entrada de configuración para la aplicación, coloque el punto de entrada directamente en la barra de comandos y no dentro del desbordamiento.

punto de entrada de configuración de la aplicación para la barra de comandos

Hub

Si usa un diseño de concentrador, el punto de entrada para la configuración de la aplicación debe colocarse dentro del menú de desbordamiento "Más" de una barra de comandos.

Pestañas y tablas dinámicas

Para un diseño de pestañas o dinamizaciones, no se recomienda colocar el punto de entrada de la configuración de la aplicación como uno de los elementos principales dentro de la navegación. En su lugar, el punto de entrada de la configuración de la aplicación debe colocarse dentro del menú de desbordamiento "Más" de una barra de comandos.

Lista y detalles

En lugar de esconder el punto de entrada de la configuración de la aplicación en lo más profundo de un panel de lista y detalles, conviértalo en el último elemento anclado en el nivel superior del panel de lista.

Diseño

La ventana de configuración de la aplicación debe abrirse en pantalla completa y llenar toda la ventana. Si el menú de configuración de la aplicación tiene hasta cuatro grupos de nivel superior, esos grupos deben colocarse en cascada en una columna.

diseño de la página de configuración de la aplicación en el escritorio

Configuración de "Modo de color"

Si la aplicación permite a los usuarios elegir el modo de color de la aplicación, presenta estas opciones usando botones de radio o un cuadro combinado con el encabezado "Elegir un modo de aplicación". En las opciones debe haber lo siguiente:

  • Claro
  • Oscuro
  • Valor predeterminado de Windows

También te recomendamos que agregues un hipervínculo a la página Colores de la aplicación Configuración de Windows, en que los usuarios puedan acceder al modo de aplicación predeterminado actual y modificarlo. Usa la cadena "Configuración del color de Windows" para el texto del hipervínculo y ms-settings:colors para el URI.

Sección

Sección Acerca de y botón Comentarios

Te recomendamos que coloques la sección "Acerca de esta aplicación" en la aplicación como una página dedicada o en su propia sección. Si quieres usar un botón "Enviar comentarios", colócalo en la parte inferior de la página "Acerca de esta aplicación".

En un subtítulo "Condiciones de uso", coloca los "Términos de uso" y la "Declaración de privacidad" (deberían ser botones de hipervínculo con ajuste de texto), así como información legal adicional, como el copyright.

Sección

Una vez que tenga una lista de elementos que desea incluir en la página de configuración de la aplicación, tenga en cuenta estas directrices:

  • Agrupa una configuración similar o relacionada en una etiqueta de configuración.

  • Intente mantener el número total de configuraciones en un máximo de cuatro o cinco.

  • Muestra la misma configuración independientemente del contexto de la aplicación. Si algunas opciones de configuración no son relevantes en un contexto determinado, deshabilite las del control flotante de configuración de la aplicación.

  • Use etiquetas de una sola palabra y descriptivas para la configuración. Por ejemplo, asigne un nombre a la configuración "Cuentas" en lugar de "Configuración de la cuenta" para la configuración relacionada con la cuenta. Si solo quiere una opción para la configuración y la configuración no se presta a una etiqueta descriptiva, use "Opciones" o "Valores predeterminados".

  • Si una configuración vincula directamente a la web en lugar de a un control flotante, informe al usuario de esto con una pista visual, como "Ayuda (en línea)" o "Foros web" con el estilo de hipervínculo. Considere la posibilidad de agrupar varios vínculos a la web en un control flotante con una sola configuración. Por ejemplo, una configuración "Acerca de" podría abrir un control flotante con vínculos a los términos de uso, la directiva de privacidad y el soporte técnico de la aplicación.

  • Combine la configuración menos usada en una sola entrada para que cada una de las opciones más comunes pueda tener su propia entrada. Coloque contenido o vínculos que solo contengan información en una configuración "Acerca de".

  • No duplique la funcionalidad en el panel "Permisos". Windows proporciona este panel de forma predeterminada y no se puede modificar.

  • Agregar contenido de configuración a controles flotantes de configuración

  • Presente contenido de arriba a abajo en una sola columna, desplazable si es necesario. Limite el desplazamiento a un máximo de dos veces el alto de la pantalla.

  • Use los siguientes controles para la configuración de la aplicación:

    • Modificadores de alternancia: para permitir que los usuarios establezcan valores activados o desactivados.
    • Botones de radio: para permitir que los usuarios elijan un elemento de un conjunto de hasta 5 opciones mutuamente excluyentes y relacionadas.
    • Cuadro de entrada de texto: para permitir que los usuarios escriban texto. Use el tipo de cuadro de entrada de texto que corresponde al tipo de texto que recibe del usuario, como un correo electrónico o una contraseña.
    • Hipervínculos: para llevar al usuario a otra página dentro de la aplicación o a un sitio web externo. Cuando un usuario hace clic en un hipervínculo, se descartará el control flotante Configuración.
    • Botones: para permitir que los usuarios inicien una acción inmediata sin descartar el control flotante Configuración actual.
  • Agregue un mensaje descriptivo si uno de los controles está deshabilitado. Coloque este mensaje encima del control deshabilitado.

  • Anima contenido y controles como un único bloque después del control flotante Configuración y el encabezado han animado. Animar contenido mediante las animaciones enterPage o EntranceThemeTransition con un desplazamiento izquierdo de 100px.

  • Use encabezados de sección, párrafos y etiquetas para ayudar a organizar y aclarar el contenido, si es necesario.

  • Si necesita repetir la configuración, use un nivel adicional de interfaz de usuario o un modelo de expansión o contracción, pero evite jerarquías más profundas que dos niveles. Por ejemplo, una aplicación meteorológica que proporciona la configuración por ciudad podría enumerar las ciudades y permitir que el usuario pulse en la ciudad para abrir un nuevo control flotante o expandir para mostrar las opciones de configuración.

  • Si la carga de controles o el contenido web tarda tiempo, use un control de progreso indeterminado para indicar a los usuarios que la información se está cargando. Para obtener más información, consulta Directrices para controles de progreso.

  • No use botones para la navegación ni para confirmar los cambios. Use hipervínculos para navegar a otras páginas y, en lugar de usar un botón para confirmar los cambios, guarde automáticamente los cambios en la configuración de la aplicación cuando un usuario descarte el control flotante Configuración.