it-swarm-es.com

Al menos uno es obligatorio. ¿Cómo aclaro esto?

Tengo una lista donde el usuario tiene que seleccionar algunos elementos. A veces ninguno de ellos es obligatorio, a veces uno es obligatorio y, a veces, al menos uno de cada dos es obligatorio. ¿Pero cómo muestro esto?

En este momento, la solución para marcar un elemento obligatorio es usar un triángulo de advertencia. Pero, ¿cómo muestro el escenario "uno de dos"? Una sugerencia es hacer que los triángulos sean parcialmente transparentes. Pero no creo que sea lo suficientemente claro.

one list where one item has an orange triangle with white exclamation mark; another list where two items have similar triangles that are semi-transparent

¿Alguno de ustedes tiene una mejor sugerencia de cómo dejar esto en claro? ¿Debo usar el triángulo de advertencia? ¿O hay un mejor camino?


EDITAR:

De hecho, necesito cambiar mi pregunta ya que algo que cambió todo apareció ayer. La lista es en realidad una estructura de árbol. Me gusta esto: Lists as in previous image, but items are grouped under headings

48
efrethe

Podrías dividir la lista.

  • artículos obligatorios como botones de radio.
  • opcionales como casillas de verificación

Esto también asegura que la atención por importancia no esté dividida, y permite una comparación más fácil entre los elementos obligatorios.

enter image description here

139
Tom.K

Creo que esta solución podría ser utilizable. Tenga en cuenta que el elemento obligatorio está seleccionado Y deshabilitado. El usuario se ve obligado a seleccionar uno de los elementos obligatorios a través de un menú desplegable

mockup

descargar fuente bmml - Wireframes creados con Balsamiq Mockups

38
Marco Tatta

En el sitio de admisión de mi campus, algunos estudios son opcionales, algunos estudios son obligatorios. De los estudios obligatorios, algunos estudios deben realizarse en un momento específico, mientras que otro estudio es obligatorio, pero hay varias veces disponibles y puede elegir el horario que más le convenga.

Esto es lo que hicieron: en lugar de depender de gráficos visuales, ¿por qué no simplemente dejar lo que necesita en el texto?

Debe tomar la clase A a las 10.00 p. M. Los martes y miércoles

Debe tomar la clase B. Hay varios horarios disponibles que puede consultar.

Una clase obligatoria en un horario obligatorio está deshabilitada y marcada. Cada clase obligatoria con un horario opcional tiene un triángulo rojo. ¿Qué significa este triángulo rojo? Sube al texto. El triángulo no es un imperativo "elige uno de estos", sino simplemente "recuerda esto"

mockup

descargar fuente bmml - Wireframes creados con Balsamiq Mockups

Si alguien falla la clase obligatoria con horario opcional , se emite un mensaje rojo que le indica dónde se equivocó.

Debe elegir un horario de la clase B.

Cuando visual falla, ve texto clásico.

11
Realdeo

Creo que para esta situación inusual, las soluciones bien conocidas no funcionarían. Podrías experimentar nuevas soluciones.

Una solución que puedo encontrar se da en la maqueta a continuación. Enlace las opciones que son obligatorias. Debería mostrar la advertencia como en la derecha si ninguno de ellos está seleccionado. Opcionalmente, puede mostrar la advertencia incluso si alguno de ellos está seleccionado pero en un color diferente (preferiblemente amarillo). También debe mostrar el mensaje de advertencia cuando el usuario se desplace sobre las líneas de guía.

mockup

descargar fuente bmml - Wireframes creados con Balsamiq Mockups

9
Gökhan Kurt

Para responder a su pregunta sobre "uno u otro", considere agregar algunas instrucciones al usuario que lo deletree para ellos, algo en el sentido de "Seleccione una de las siguientes" justo encima de las dos opciones. Podría funcionar mejor colocar el triángulo justo en esta llamada a la acción, en lugar de en cada una de las opciones que está eligiendo.

La funcionalidad que describió en estas opciones suena como botones de radio, donde solo se puede seleccionar uno a la vez, por lo que uno debe pensar en hacer que esas opciones aparezcan como botones de radio para dar una pista adicional al usuario de que solo se puede seleccionar uno.

Su icono de triángulo de exclamación sugiere que necesito arreglar algo en la página para poder continuar. Aunque tener un campo para corregir da una sensación ligeramente diferente, entonces un campo requerido que necesita ingresar datos, si eso es lo que está buscando, entonces creo que funciona.

No soy un gran admirador del triángulo parcialmente transparente, ya que eso me sugiere que la opción está actualmente desactivada o inactiva.

3
ToddBFisher

Una solución que aún no he visto, pero realmente depende del contexto. ¿Podría saberle al usuario que estas opciones son obligatorias? Si yo fuera el usuario, me gustaría que el triángulo no significara "Obligatorio", sino "Oye, mira esto, este es probablemente el que estás buscando".

De esa manera, puede poner un triángulo para cada uno de los tres especiales en su ejemplo. Si selecciona el verdadero obligatorio, el triángulo desaparece. Y si elige uno de los dos "requisitos obligatorios", ambos triángulos desaparecen allí.

Dependerá del contexto, se supone que el usuario debe saber qué es obligatorio, por lo que los triángulos no son lo único que lo guía. Pero después de eso solo tiene que probar combinaciones hasta que todos los triángulos hayan desaparecido.

0
ObsessionAddict

Podría explicar estos requisitos con notas al pie. Esto probablemente solo funcionará bien si las opciones obligatorias son raras.

A parent
    ☐ An option
    ☑ An option¹
A parent
    ☐ An option
    ☐ An option
    ☐ An option²
A parent
    ☐ An option²
    ☐ An option

¹Because of ______, this option must be selected. 
²Because of ______, at least one of these options must be selected.
0
uber5001

Esta no es una solución a la que iría. Lo mejor es mantenerlo limpio y simple. Menos es más como dice el refrán. Actualmente, todos sus elementos están en negrita, y cambiaría eso para diferenciar más, mejorar el enfoque y la legibilidad.

Entonces, una sugerencia podría ser poner los obligatorios en negrita para que se destaquen o, en segundo lugar, mantenerlos en línea con los demás, pero agregar un (*) En tercer lugar, podría poner todos los obligatorios en la parte superior de la lista

De esta manera, mantiene intacta la jerarquía de su información.

0
Imagestyler

Agrupe las opciones con esa propiedad (al menos una es obligatoria) en conjuntos de campos o agregue un ajuste para ellos. Cambie el fondo para ese grupo de opciones y agregue el mismo color de fondo para las opciones que son obligatorias.

Mantenga el icono ubicado en el medio del grupo (centrado verticalmente) o antes de la opción en el caso de que sea solo uno.

enter image description here

0
Madalina Taina

Este es un comportamiento que se admite fácilmente marcando los campos obligatorios con un color de relleno. Una vez que se cumple el requisito, suelta el color para que se vea como cualquier otra entrada en la página.

Ahora, en su caso, cuando se requiere que el usuario seleccione al menos una, todas las casillas de verificación se colorean hasta que se elige una sola opción. La regla puede aplicarse a cualquier cantidad de opciones requeridas en una lista.

Pero si tiene una opción que debe seleccionarse, debe seleccionarse por defecto y deshabilitarse para que el usuario no pueda cometer el error de anular su selección. Este comportamiento también puede ser impulsado por las reglas comerciales, de modo que lo que se preselecciona se debe a las elecciones realizadas en otras áreas del formulario o la aplicación.

0
RCburn