stringtranslate.com

ventana modal

En el diseño de interfaz de usuario para aplicaciones informáticas, una ventana modal es un elemento de control gráfico subordinado a la ventana principal de una aplicación .

Una ventana modal crea un modo que desactiva la interacción del usuario con la ventana principal pero la mantiene visible, con la ventana modal como ventana secundaria delante de ella. Los usuarios deben interactuar con la ventana modal antes de poder regresar a la ventana principal . Esto evita interrumpir el flujo de trabajo en la ventana principal. Las ventanas modales a veces se denominan ventanas pesadas o diálogos modales porque a menudo muestran un cuadro de diálogo .

Las interfaces de usuario suelen utilizar ventanas modales para generar conciencia en el usuario y mostrar estados de emergencia, aunque los diseñadores de interacción argumentan que son ineficaces para ese uso. [1] Las ventanas modales son propensas a errores de modo . [1] [2] [3]

En la Web, suelen mostrar imágenes en detalle, como las implementadas por la biblioteca Lightbox , o se utilizan para anuncios flotantes . [4] [5]

Lo opuesto a modal es no modal . Las ventanas no modal no bloquean la ventana principal, por lo que el usuario puede cambiar su enfoque entre ellas, tratándolas como ventanas de paleta .

Relevancia y uso

Casos de uso

Los usos frecuentes de las ventanas modales incluyen:

Hojas modales en Mac OS X

Muchas características que normalmente estarían representadas por ventanas modales se implementan como paneles transitorios modales llamados "Hojas" [9] en Mac OS X. Las ventanas transitorias se comportan de manera similar a las ventanas modales: siempre están en la parte superior de la ventana principal y no se muestran en la lista de ventanas, pero no desactivan el uso de otras ventanas en la aplicación. Las hojas se deslizan fuera de la barra de título de la ventana y, por lo general, deben cerrarse antes de que el usuario pueda continuar trabajando en la ventana, pero el resto de la aplicación sigue siendo utilizable. Así crean un modo dentro de la ventana que los contiene, pero son amodales con respecto al resto de la aplicación.

Control del flujo de interacción

Las ventanas modales son comunes en los kits de herramientas GUI para guiar el flujo de trabajo del usuario. Alan Cooper sostiene que la importancia de exigir que el usuario atienda cuestiones importantes justifica restringir su libertad y que la alternativa aumentaría su frustración. [10]

Interrupciones inesperadas

Los diálogos de alerta inesperados son los culpables particulares de los errores de modo [1] con consecuencias potencialmente graves. Los profesionales de la usabilidad prescriben que las acciones peligrosas deben poder deshacerse siempre que sea posible; un cuadro de alerta que aparece inesperadamente o que se descarta por habituación no protege de la acción peligrosa. [11] Una barra de información no modal se considera cada vez más preferible a un cuadro de diálogo porque no interrumpe las actividades del usuario, sino que le permite leer información adicional en su propio tiempo.

Un enfoque propuesto es diseñar cada elemento de entrada como una interacción autónoma y orientada a tareas , guiada por sus propios requisitos específicos en lugar de por el estado global de toda la aplicación. Por ejemplo, los elementos obligatorios pueden ir precedidos de un asterisco , los elementos con datos no válidos pueden adquirir un borde rojo, etc. Con este enfoque, los usuarios realmente se benefician al ver muchos elementos de entrada a la vez: pueden ingresar datos de una manera que tenga sentido para ellos, en lugar de tener todos los demás elementos no relacionados bloqueados hasta que se complete una secuencia de ingreso de datos predefinida.

Problemas

Una ventana modal bloquea todos los demás flujos de trabajo en el programa de nivel superior hasta que se cierra la ventana modal, a diferencia de los diálogos no modal que permiten a los usuarios operar con otras ventanas. [12] Las ventanas modales están destinadas a captar toda la atención del usuario. [13] Es posible que los usuarios no reconozcan que una ventana modal requiere su atención, lo que genera confusión acerca de que la ventana principal no responde o provoca la pérdida de la entrada de datos del usuario destinada a la ventana principal (consulte Error de modo ). En casos severos, la ventana modal aparece detrás de otra ventana controlada por el mismo programa, lo que potencialmente hace que todo el programa no responda hasta que la ventana modal pueda ubicarse manualmente.

Sin embargo, muchos diseñadores de interfaces han tomado medidas recientemente para hacer que las ventanas modales sean más obvias oscureciendo el fondo detrás de la ventana o permitiendo cualquier clic del mouse fuera de la ventana modal para forzar el cierre de la ventana modal (un diseño llamado Lightbox [5] ). aliviar esos problemas. Jakob Nielsen afirma que una ventaja de los diálogos modales es que mejoran la conciencia del usuario: "Cuando es necesario arreglar algo, es mejor asegurarse de que el usuario lo sepa". Para este objetivo, el diseño de Lightbox proporciona un fuerte contraste visual del diálogo sobre el resto de las imágenes. La técnica Lightbox es ahora una herramienta común en el diseño de sitios web.

Las ventanas modales se implementan comúnmente de manera que bloquean la posibilidad de mover, minimizar, iconificar o empujar esa ventana hacia atrás, y captan el foco de entrada, lo que a menudo impide el uso de las funciones de cortar, copiar y pegar del sistema . Esto puede interferir con el uso de sus aplicaciones principales al bloquear el acceso a otras ventanas y datos dentro de la misma aplicación, particularmente en los casos en que la ventana modal requiere que el usuario ingrese información que solo está disponible en una de las ventanas que cubre.

Para los usuarios que utilizan áreas de trabajo virtuales más grandes que sus pantallas reales, las ventanas modales pueden causar más comportamientos indeseables, incluida la creación del modal en una parte de la pantalla virtual que no se muestra actualmente, o cambiar abruptamente la pantalla de aquello en lo que el usuario estaba trabajando. una sección completamente diferente.

Las ventanas modales tienden a crear un desvío abrupto de la entrada de texto, especialmente la entrada escrita destinada a otros programas, hacia sí mismas. Además, los modales generalmente interpretan la pulsación de la tecla Intro (o, en casos raros, la presencia de una nueva línea en la entrada pegada) como una señal para aceptar la entrada y procesarla o, en casos raros, pueden interceptar un clic del mouse destinado a una persona diferente. aplicación que de repente ha sido cubierta. Dicha interceptación, llamada robo de foco (o robo de foco), puede comprometer las prácticas de privacidad y seguridad, así como capturar entradas inapropiadas y fuera de contexto que pueden causar resultados arbitrarios e indefinidos en el programa que generó la ventana modal.

Dependiendo de las características específicas de la implementación, las ventanas modales pueden violar el principio de mínima sorpresa .

Recomendaciones

Los diálogos modales son parte de un flujo de tareas y se dan recomendaciones para ubicarlos donde el foco está en ese flujo. Por ejemplo, la ventana podría colocarse cerca del elemento de control gráfico que desencadena su activación. [14]

El uso de un fondo oscuro semitransparente puede oscurecer la información en la ventana principal, por lo que es mejor usarlo solo cuando esa información distraiga. Un fondo semitransparente puede hacerse menos intrusivo haciendo que toda el área del fondo funcione como un botón de cierre: esto es estándar en la mayoría de los sistemas operativos móviles, evita que el usuario se sienta atrapado y hace que las ventanas modales parezcan menos ventanas emergentes maliciosas.

El diseño debe seguir prácticas comunes en la plataforma en la que se ejecuta el programa. Microsoft Windows utiliza controles estándar para los cuadros de diálogo de ventanas modales , con botones de acción afirmativa en la parte inferior derecha del panel. Mac OS X utiliza hojas modales con botones de acción afirmativa como comando situado más a la derecha. [15]

Ver también

Referencias

  1. ^ abcd "Nunca utilices una advertencia cuando te refieres a deshacer". alistapart.com . Consultado el 9 de octubre de 2015 .
  2. ^ Raskin, Jef (2000). La interfaz humana. Estados Unidos: Addison Wesley. ISBN 0-201-37937-6.
  3. ^ "Quisquilloso / La interfaz humana". nitpicker.pbworks.com . Regla 1a . Consultado el 9 de octubre de 2015 .
  4. ^ Explorador de patrones de UX de Quince. "Panel modales". Archivado desde el original el 27 de febrero de 2010.La popular biblioteca JavaScript Lightbox utiliza un enfoque de panel modal para mostrar las imágenes.
  5. ^ ab Jakob Nielsen, Alertbox. "Las 10 mejores interfaces de usuario de aplicaciones".
  6. ^ Joel Spolsky , Diseño de interfaz de usuario para programadores: diseño para personas que tienen mejores cosas que hacer con sus vidas
  7. ^ Raymond Chen , The Old New Thing: la respuesta predeterminada a cada cuadro de diálogo es "Cancelar"
  8. ^ Jeff Atwood, Coding Horror: enseñar a los usuarios a leer
  9. ^ "Hojas - Presentación - Componentes - Pautas de interfaz humana - Diseño - Desarrollador de Apple". Desarrollador de Apple . Consultado el 7 de septiembre de 2022 .
  10. ^ Cooper, Alan (17 de marzo de 2003). Acerca de Face 2.0: los fundamentos del diseño de interacción. Wiley. ISBN 0-7645-2641-3.
  11. ^ Raskin, Jef (2000). La interfaz humana. Addison Wesley. ISBN 0-201-37937-6.
  12. ^ "Cómo utilizar la modalidad en los cuadros de diálogo". Corporación Oráculo .
  13. ^ "Panel modal". quince.infragistics.com . Archivado desde el original el 6 de mayo de 2013.
  14. ^ "Panel modal: implementación". quince.infragistics.com . Archivado desde el original el 6 de mayo de 2013.
  15. ^ Inc., manzana. "Temas - macOS - macOS - Directrices de interfaz humana - Desarrollador de Apple". desarrollador.apple.com . Consultado el 18 de septiembre de 2018 . {{cite web}}: |last=tiene nombre genérico ( ayuda )