user interface - guidelines - ¿Debería una UI mostrar acciones que no están disponibles?

user interface design pdf (11)

La segunda opción, atenuar la opción de eliminar debería ser suficiente. Agregar una marca de interrogación para explicar, como se sugiere, me parece una buena idea. De lo contrario, el usuario probablemente no tenga idea de por qué puede eliminar algunos clientes, otros no.

Pero siempre debe considerar la posibilidad de que mientras el usuario A ya ha abierto la interfaz de usuario, con la opción de eliminación habilitada, el usuario B ingresa un nuevo contrato activo. Por lo tanto, si el usuario A desea eliminar el cliente, deberá verificar que no haya contratos activos y mostrar un mensaje de error si lo hay. En otras palabras, todavía tiene que implementar todo lo que requiere la primera opción. Por ese motivo, es probable que elija la primera opción, siempre muestre dejar la opción de eliminar visible y activa, para evitar la duplicación de código y ofrecer el comportamiento más consistente.

Lo que actualmente se considera una mejor práctica en el diseño de la interfaz de usuario para mostrar acciones que no están disponibles en el contexto actual.

Por ejemplo, una página muestra clientes que pueden tener muchos contratos asociados. No deseo permitir que el usuario elimine un cliente si hay contratos activos. Desde una perspectiva de usabilidad y UI, se considera lo mejor para la experiencia del usuario.

Siempre muestre la opción de eliminar, pero advierta al usuario cuando la seleccione que la opción no está disponible porque hay contratos activos.
Muestra la opción de eliminar, pero ponla en gris.
No mostrar la opción de borrado en absoluto

Mostrar siempre la opción tiene el beneficio de la coherencia y las acciones relevantes están siempre en el mismo lugar, etc., pero a la inversa, ¿cuál es el punto de mostrarles algo que no pueden hacer?

Grabar la opción aún tiene consistencia, pero no les permite seleccionar la acción que no pueden realizar.

No mostrar la opción en absoluto carece de consistencia pero quizás no sea tan confuso.

Antes de ayer, ni siquiera habría hecho la pregunta y habría ido directamente a la opción 2 (Desvanecimiento). Sin embargo, habiendo observado a un usuario intentar hacer clic en la imagen en gris muchas veces y, finalmente, preguntarme por qué no podían hacer clic en el botón Ya no estoy seguro de cuál es la mejor opción.

¿Qué piensan las personas con experiencia en usabilidad y pruebas de UI que es la mejor opción?

Mi enfoque (y recomendación) sería que el botón esté en gris según su opción # 2.

Cuando la UI es escasa y hay suficiente espacio disponible, con sugerencias contextuales en línea (por adelantado) (como el enfoque de signo de interrogación sugerido por Freddy, al lado del botón, que detalla el problema en línea, por ejemplo, siempre se muestra debajo del inhabilitado) botón "No se pueden eliminar usuarios. ¡Agregue algunos al ir a (enlace) esta pestaña (/ enlace)!") puede ser conveniente.

Sin embargo, tales sugerencias en línea o signos de interrogación que aparecen de vez en cuando pueden complicar el diseño o dificultar la efectividad de la interfaz cuando las propiedades inmobiliarias son importantes. En tales casos, puede ser mejor tener una sugerencia superpuesta (un globo o una punta de herramienta) que aparece al desplazarse sobre el botón desactivado , así como al hacer clic en el botón desactivado (es decir, el usuario manifiesta su intención acercándose al botón desactivado con su / su cursor); la sugerencia debe explicar por qué el botón está desactivado y en gris, es decir, "No hay usuarios que eliminar".

Lo anterior debe hacerse cargo de todos los casos (típicos y patológicos). Combina las ventajas de sus opciones n. ° 2 y n. ° 3 y, con suerte, ninguna de las desventajas.

Para este caso particular, la opción 2 es la mejor opción. Al decidir si ocultar o deshabilitar algo, la regla general que sigo es:

Si el usuario no puede realizar una operación y hay algo que puede hacer para habilitarla, entonces debe estar deshabilitada.
Si el usuario no puede realizar una operación y no hay nada que pueda hacer para habilitarla, debe ocultarse.

En su ejemplo, si el usuario se deshace de los contratos activos, puede eliminar al cliente. Por lo tanto, la operación de eliminación debe estar deshabilitada ya que tienen el control sobre la habilitación. Sin embargo, digamos que el usuario no pudo eliminar al cliente porque no tenía el permiso de "eliminar clientes". En este caso, la operación de eliminación debe estar oculta ya que no hay nada que el usuario pueda hacer que les permita eliminar al cliente (no pueden otorgarse el permiso).

Cada vez que se deshabilita una opción, debe quedar claro qué se debe hacer para habilitarla. En este ejemplo, cuando el usuario mueve el mouse sobre el botón de eliminar, debe ver una información sobre herramientas que explica por qué la operación está deshabilitada.

En una nota al margen ... si los usuarios intentan hacer clic en los botones desactivados, puede que no sea lo suficientemente obvio que los botones estén desactivados. Intente cambiar el estilo de los botones para que haya una mayor distinción entre habilitado y deshabilitado (suponiendo que no esté usando controles estándar).

Prefiero mostrar las opciones, pero en gris. Aquí es por qué. Si una acción está a veces disponible y otras no, la interfaz de usuario se vuelve confusa. Parece mágico que a veces puedo ver el borrado y otras veces no. Por otro lado, si está en gris, al menos sé dónde buscar la opción más adelante.

Raymond Chen (de la fama The Old New Thing) ofrece buenas pautas:

¿Cuándo desactivas una opción y cuándo la eliminas?

De la entrada del blog:

Los experimentos han demostrado que si se muestra algo pero se deshabilita, los usuarios esperan poder habilitarlo si hacen lo suficiente como para no hacer nada. Así que deje un elemento del menú mostrado pero deshabilitado si hay algo que el usuario pueda hacer para que la operación esté disponible. Por ejemplo, en un programa de reproducción de medios, la opción para detener la reproducción se desactiva si el archivo de medios no se está reproduciendo. Pero una vez que comienza a jugar, la opción vuelve a estar disponible.
Por otro lado, si la opción no está disponible por un motivo por el cual el usuario no tiene control, entonces elimínela. De lo contrario, el usuario se volverá loco buscando la forma mágica de habilitarlo. Por ejemplo, si una impresora no es capaz de imprimir en color, no muestre ninguna de las opciones de administración de color, ya que no hay nada que el usuario pueda hacer con su programa para convertir esa impresora en una impresora a color.

Siempre me enseñaron que eliminar objetos de la interfaz de usuario era mucho más desconcertante para un usuario que deshabilitarlo. ¡No diseñe para el .01% que no puede ser ayudado!

Solo aplique el principio de la menor sorpresa : no haga nada inesperado.

Una opción en gris significa claramente que no está disponible en el contexto actual.
Una opción que falta puede significar cualquier cosa.

Un área en la que consideraría eliminar completamente de la vista los elementos de la interfaz de usuario sería cuando su aplicación proporcione múltiples niveles de accesibilidad (por ejemplo, Principiante, Intermedio, Experto) o cuando las cuentas de usuario sigan algunos roles de seguridad donde un usuario "invitado" no significa para acceder a la interfaz completa que un usuario "administrador", por ejemplo.

Sugiero la opción 1). Te diré por qué.

Opción 3) (Peor) "No mostrar la opción de eliminación en absoluto" Esto ni siquiera avisa al usuario de que existe tal característica. Así que es la peor manera de negar.

Opción 2) "Mostrar la opción de eliminar pero atenuarla"

Mejor que 3) pero el usuario puede seguir preguntándose por qué se le niega la funcionalidad. También puede comenzar a pensar que no es un usuario privilegiado y que carece de derechos.

Opción1) "Mostrar siempre la opción de eliminar, pero avisar al usuario cuando la seleccione que la opción no está disponible porque hay contratos activos".

Esto le dirá claramente al usuario lo que falta y lo educará sobre la función exacta. Los usuarios siempre están felices de trabajar en un sistema transparente que no les arroja rompecabezas.

Usted quiere que su UI sea consistente, sea cual sea el estado en particular. Muchos usuarios confían en la memoria visual para recordar la ubicación de los comandos. Tener que buscar acciones particulares cada vez es demasiado esfuerzo y está atrayendo la atención de los usuarios de su trabajo principal en la aplicación.

Por lo tanto, es mejor mostrar la acción para mantenerla en el contexto visual. Sin embargo, indican visiblemente que el estado de esta acción es modificado. Esto le dará al usuario retroalimentación sobre la existencia de la acción y al mismo tiempo sugiere que se debe cumplir alguna condición para permitir que el usuario ejecute el comando.

Cambiar la saturación de color es el enfoque más común para representar el estado deshabilitado. Hace que el elemento UI se desvanezca en el fondo.

Hay ocasiones en que la eliminación de los botones de la barra de herramientas es la forma correcta, pero en general.

Al eliminarlo, el usuario se pregunta dónde está. Mientras que, deshabilitar le permite al usuario saber dónde está, pero que no está disponible. Entonces, en lugar de perder el tiempo tratando de ver dónde está la opción, pueden pasar el tiempo averiguando por qué no está disponible.

Para ese escenario, use 2, pero agregue un signo de interrogación además de que explica por qué está deshabilitado. Actualización 1: Tenga en cuenta que le da la oportunidad de tener muy claro cuándo estará activo / deshabilitado.